From 6391a869aee853b01bdd9136b390e2f9b21857cb Mon Sep 17 00:00:00 2001
From: Eugen Rochko <eugen@zeonfederated.com>
Date: Tue, 22 Mar 2022 06:08:05 +0100
Subject: [PATCH] [Glitch] Fix color of show more link in report dialog in web
 UI

Port 69f9dc4f4eed9211a0a4ff55c18f64c99165a9e0 to glitch-soc

Signed-off-by: Claire <claire.github-309c@sitedethib.com>
---
 .../flavours/glitch/styles/components/modal.scss       |  9 +++++++++
 .../flavours/glitch/styles/components/status.scss      | 10 ++++++----
 2 files changed, 15 insertions(+), 4 deletions(-)

diff --git a/app/javascript/flavours/glitch/styles/components/modal.scss b/app/javascript/flavours/glitch/styles/components/modal.scss
index 7e6918356..61c292b19 100644
--- a/app/javascript/flavours/glitch/styles/components/modal.scss
+++ b/app/javascript/flavours/glitch/styles/components/modal.scss
@@ -609,6 +609,15 @@
     color: $inverted-text-color;
   }
 
+  .status__content__spoiler-link {
+    color: $primary-text-color;
+    background: $ui-primary-color;
+
+    &:hover {
+      background: lighten($ui-primary-color, 8%);
+    }
+  }
+
   .dialog-option .poll__input {
     border-color: $inverted-text-color;
     color: $ui-secondary-color;
diff --git a/app/javascript/flavours/glitch/styles/components/status.scss b/app/javascript/flavours/glitch/styles/components/status.scss
index ad6c24ea6..0d7dfd64d 100644
--- a/app/javascript/flavours/glitch/styles/components/status.scss
+++ b/app/javascript/flavours/glitch/styles/components/status.scss
@@ -198,7 +198,8 @@
   .status__content__spoiler-link {
     background: lighten($ui-base-color, 30%);
 
-    &:hover {
+    &:hover,
+    &:focus {
       background: lighten($ui-base-color, 33%);
       text-decoration: none;
     }
@@ -222,13 +223,13 @@
   background: lighten($ui-base-color, 30%);
   border: 0;
   color: $inverted-text-color;
-  font-weight: 500;
+  font-weight: 700;
   font-size: 11px;
   padding: 0 5px;
   text-transform: uppercase;
   line-height: inherit;
   cursor: pointer;
-  vertical-align: bottom;
+  vertical-align: top;
 
   &:hover {
     background: lighten($ui-base-color, 33%);
@@ -760,7 +761,8 @@ a.status__display-name,
     background: $ui-base-lighter-color;
     color: $inverted-text-color;
 
-    &:hover {
+    &:hover,
+    &:focus {
       background: lighten($ui-base-color, 29%);
       text-decoration: none;
     }