added contrast in buttons

src/parts/_forms.css

@@ -29,6 +29,14 @@ select {
   outline: none;
 }
 
+button,
+input[type='submit'],
+input[type='button'] {
+  background-color: var(--background-btn);
+  padding-right: 30px;
+  padding-left: 30px;
+}
+
 input[type='color'] {
   min-height: 2rem;
   padding: 8px;
@@ -94,17 +102,12 @@ select[multiple] {
   overflow-y: auto;
 }
 
-button,
-input[type='submit'],
-input[type='button'] {
-  padding-right: 30px;
-  padding-left: 30px;
-}
-
 button:hover,
 input[type='submit']:hover,
 input[type='button']:hover {
   background: var(--button-hover);
+
+  /* transform: scale(1.03); */
 }
 
 input:focus,

src/variables-dark.css

@@ -1,6 +1,7 @@
 :root {
   --background-body: #202b38;
   --background: #161f27;
+  --background-btn: #0c151c;
   --background-alt: #1a242f;
   --selection: #1c76c5;
   --text-main: #dbdbdb;
@@ -11,7 +12,7 @@
   --border: #526980;
   --code: #ffbe85;
   --animation-duration: 0.1s;
-  --button-hover: #324759;
+  --button-hover: #2f5372;
   --scrollbar-thumb: var(--button-hover);
   --scrollbar-thumb-hover: color-mod(var(--scrollbar-thumb) lightness(+8%));
   --form-placeholder: #a9a9a9;

src/variables-light.css

@@ -1,6 +1,7 @@
 :root {
   --background-body: #fff;
-  --background: #efefef;
+  --background: #e2e2e2;
+  --background-btn: #d0cfcf;
   --background-alt: #f7f7f7;
   --selection: #9e9e9e;
   --text-main: #363636;
@@ -11,11 +12,11 @@
   --border: #dbdbdb;
   --code: #000;
   --animation-duration: 0.1s;
-  --button-hover: #ddd;
+  --button-hover: rgb(170, 170, 170);
   --scrollbar-thumb: color-mod(var(--button-hover) lightness(-3%));
   --scrollbar-thumb-hover: color-mod(var(--button-hover) lightness(-10%));
   --form-placeholder: #949494;
-  --form-text: #000;
+  --form-text: rgb(29, 29, 29);
   --variable: #39a33c;
   --highlight: #ff0;
   --select-arrow: svg-load('./assets/select-arrow.svg', fill: #161f27);