Improve vote button hover

MbinOrg · Feb 11, 2025 · d008056 · d008056
1 parent 2271be2
commit d008056
Show file tree

Hide file tree

Showing 7 changed files with 13 additions and 6 deletions.
diff --git a/assets/styles/components/_vote.scss b/assets/styles/components/_vote.scss
@@ -24,6 +24,7 @@
 
     &:hover,
     &:focus-visible {
+      background-color: var(--kbin-vote-bg-hover-bg);
       color: var(--kbin-vote-text-hover-color);
     }
 

diff --git a/assets/styles/mixins/theme-dark.scss b/assets/styles/mixins/theme-dark.scss
@@ -100,13 +100,14 @@
 
   //vote
   --kbin-vote-bg: #1c1c1c;
+  --kbin-vote-bg-hover-bg: #161616;
   --kbin-vote-text-color: #b6b6b6;
   --kbin-vote-text-hover-color: #fafafa;
   --kbin-upvoted-color: #24b270;
   --kbin-downvoted-color: #dc2f3f;
 
-   //boost
-   --kbin-boosted-color: var(--kbin-upvoted-color);
+  //boost
+  --kbin-boosted-color: var(--kbin-upvoted-color);
 
   // alerts
   --kbin-alert-info-bg: rgba(153,116,4,0.15);

diff --git a/assets/styles/mixins/theme-light.scss b/assets/styles/mixins/theme-light.scss
@@ -101,8 +101,9 @@
 
   //vote
   --kbin-vote-bg: #e7e7e7;
-  --kbin-vote-text-color: #1f1f1f;
-  --kbin-vote-text-hover-color: #000;
+  --kbin-vote-bg-hover-bg: #dfdfdf;
+  --kbin-vote-text-color: #222222;
+  --kbin-vote-text-hover-color: #0d0014;
   --kbin-upvoted-color: #0f5132;
   --kbin-downvoted-color: #842029;
 

diff --git a/assets/styles/mixins/theme-solarized-dark.scss b/assets/styles/mixins/theme-solarized-dark.scss
@@ -118,6 +118,7 @@ $green: #859900;
 
   //vote
   --kbin-vote-bg: #00242c;
+  --kbin-vote-bg-hover-bg: #001f25;
   --kbin-vote-text-color: #b6b6b6;
   --kbin-vote-text-hover-color: #fafafa;
   --kbin-upvoted-color: #{$green};

diff --git a/assets/styles/mixins/theme-solarized-light.scss b/assets/styles/mixins/theme-solarized-light.scss
@@ -118,13 +118,14 @@ $green: #859900;
 
   //vote
   --kbin-vote-bg: #fff5db;
+  --kbin-vote-bg-hover-bg: #f3e8cd;
   --kbin-vote-text-color: #{$base01};
   --kbin-vote-text-hover-color: #{$base1};
   --kbin-upvoted-color: #{$green};
   --kbin-downvoted-color: #{$red};
 
-   //boost
-   --kbin-boosted-color: var(--kbin-upvoted-color);
+  //boost
+  --kbin-boosted-color: var(--kbin-upvoted-color);
 
   // alerts
   --kbin-alert-info-bg: #fff3cd;

diff --git a/assets/styles/themes/_kbin.scss b/assets/styles/themes/_kbin.scss
@@ -98,6 +98,7 @@
 
   //vote
   --kbin-vote-bg: #2B2D31;
+  --kbin-vote-bg-hover-bg: #222427;
   --kbin-vote-text-color: #B6BAC2;
   --kbin-vote-text-hover-color: #fafafa;
   --kbin-upvoted-color: #24b270;

diff --git a/assets/styles/themes/_tokyo-night.scss b/assets/styles/themes/_tokyo-night.scss
@@ -98,6 +98,7 @@
 
   // vote
   --kbin-vote-bg: #1c1d26;
+  --kbin-vote-bg-hover-bg: #13141b;
   --kbin-vote-text-color: #d6d6ff;
   --kbin-vote-text-hover-color: #9999ff;
   --kbin-upvoted-color: var(--kbin-success-color);