From eaa1f9e4509ee4031b834500490e0f47873ebf20 Mon Sep 17 00:00:00 2001
From: KMY <tt@kmycode.net>
Date: Fri, 7 Jul 2023 07:10:36 +0900
Subject: [PATCH] Change emoji reactions bar color

---
 app/javascript/styles/contrast/variables.scss       | 3 +++
 app/javascript/styles/mastodon-light/variables.scss | 3 +++
 app/javascript/styles/mastodon/components.scss      | 4 ++--
 app/javascript/styles/mastodon/variables.scss       | 4 ++++
 4 files changed, 12 insertions(+), 2 deletions(-)

diff --git a/app/javascript/styles/contrast/variables.scss b/app/javascript/styles/contrast/variables.scss
index e38d24b271..2ab7723739 100644
--- a/app/javascript/styles/contrast/variables.scss
+++ b/app/javascript/styles/contrast/variables.scss
@@ -6,6 +6,9 @@ $classic-primary-color: #9baec8;
 $classic-secondary-color: #d9e1e8;
 $classic-highlight-color: #6364ff;
 
+$emoji-reaction-color: #42485a !default;
+$emoji-reaction-selected-color: #617ed5 !default;
+
 $ui-base-color: $classic-base-color !default;
 $ui-primary-color: $classic-primary-color !default;
 $ui-secondary-color: $classic-secondary-color !default;
diff --git a/app/javascript/styles/mastodon-light/variables.scss b/app/javascript/styles/mastodon-light/variables.scss
index cae065878c..d1f98cf085 100644
--- a/app/javascript/styles/mastodon-light/variables.scss
+++ b/app/javascript/styles/mastodon-light/variables.scss
@@ -7,6 +7,9 @@ $classic-primary-color: #9baec8;
 $classic-secondary-color: #d9e1e8;
 $classic-highlight-color: #6364ff;
 
+$emoji-reaction-color: #dfe5f5 !default;
+$emoji-reaction-selected-color: #9ac1f2 !default;
+
 // Differences
 $success-green: lighten(#3c754d, 8%);
 
diff --git a/app/javascript/styles/mastodon/components.scss b/app/javascript/styles/mastodon/components.scss
index 850fe07349..88f071db67 100644
--- a/app/javascript/styles/mastodon/components.scss
+++ b/app/javascript/styles/mastodon/components.scss
@@ -1346,7 +1346,7 @@ body > [data-popper-placement] {
   margin: 12px 0 2px 4px;
 
   .emoji-reactions-bar__button {
-    background: lighten($ui-base-color, 12%);
+    background: $emoji-reaction-color;
     border: 0;
     cursor: pointer;
     display: flex;
@@ -1355,7 +1355,7 @@ body > [data-popper-placement] {
     height: 24px;
 
     &.toggled {
-      background: darken($ui-primary-color, 16%);
+      background: $emoji-reaction-selected-color;
     }
 
     > .emoji {
diff --git a/app/javascript/styles/mastodon/variables.scss b/app/javascript/styles/mastodon/variables.scss
index 73d3aa2a94..d2b4abc965 100644
--- a/app/javascript/styles/mastodon/variables.scss
+++ b/app/javascript/styles/mastodon/variables.scss
@@ -15,6 +15,10 @@ $classic-primary-color: #9baec8; // Echo Blue
 $classic-secondary-color: #d9e1e8; // Pattens Blue
 $classic-highlight-color: #6364ff; // Brand purple
 
+// Values for kmyblue original functions
+$emoji-reaction-color: #42485a !default;
+$emoji-reaction-selected-color: #617ed5 !default;
+
 // Variables for defaults in UI
 $base-shadow-color: $black !default;
 $base-overlay-background: $black !default;