Align better with main branch and update changesets

.changeset/dirty-beans-wonder.md

@@ -1,5 +0,0 @@
----
-"water.css": patch
----
-
-changed hover color close to base color

.changeset/rude-pots-sort.md

@@ -2,4 +2,4 @@
 "water.css": patch
 ---
 
-Added Contrast to the Buttons
+Update button colors for better contrast, especially in tables

.changeset/stale-dodos-chew.md

@@ -1,5 +0,0 @@
----
-"water.css": patch
----
-
-Better button color inside table.

src/parts/_forms.css

@@ -1,6 +1,7 @@
 button,
 select,
 input[type='submit'],
+input[type='reset'],
 input[type='button'],
 input[type='checkbox'],
 input[type='range'],
@@ -8,11 +9,16 @@ input[type='radio'] {
   cursor: pointer;
 }
 
-input:not([type='checkbox']):not([type='radio']),
+input,
 select {
   display: block;
 }
 
+[type='checkbox'],
+[type='radio'] {
+  display: initial;
+}
+
 input,
 button,
 textarea,
@@ -31,12 +37,20 @@ select {
 
 button,
 input[type='submit'],
+input[type='reset'],
 input[type='button'] {
-  background-color: var(--background-btn);
+  background-color: var(--button-base);
   padding-right: 30px;
   padding-left: 30px;
 }
 
+button:hover,
+input[type='submit']:hover,
+input[type='reset']:hover,
+input[type='button']:hover {
+  background: var(--button-hover);
+}
+
 input[type='color'] {
   min-height: 2rem;
   padding: 8px;
@@ -102,14 +116,6 @@ select[multiple] {
   overflow-y: auto;
 }
 
-button:hover,
-input[type='submit']:hover,
-input[type='button']:hover {
-  background: var(--button-hover);
-
-  /* transform: scale(1.03); */
-}
-
 input:focus,
 select:focus,
 button:focus,
@@ -120,6 +126,7 @@ textarea:focus {
 input[type='checkbox']:active,
 input[type='radio']:active,
 input[type='submit']:active,
+input[type='reset']:active,
 input[type='button']:active,
 input[type='range']:active,
 button:active {

src/variables-dark.css

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

src/variables-light.css

@@ -1,7 +1,6 @@
 :root {
   --background-body: #fff;
   --background: #e2e2e2;
-  --background-btn: #d0cfcf;
   --background-alt: #f7f7f7;
   --selection: #9e9e9e;
   --text-main: #363636;
@@ -12,9 +11,10 @@
   --border: #dbdbdb;
   --code: #000;
   --animation-duration: 0.1s;
-  --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%));
+  --button-base: #d0cfcf;
+  --button-hover: #9b9b9b;
+  --scrollbar-thumb: color-mod(var(--button-hover) lightness(+6%));
+  --scrollbar-thumb-hover: var(--button-hover);
   --form-placeholder: #949494;
   --form-text: rgb(29, 29, 29);
   --variable: #39a33c;