From 9acb3faac8db04bf6d85d09c7081706e01f20d67 Mon Sep 17 00:00:00 2001 From: Timo Tijhof Date: Sat, 14 Nov 2020 19:35:55 +0000 Subject: [PATCH] fix: change dark grayscale to use have a brighter action-button color (#1881) The pressed state, such as used for the "Unfollow" button, was effectively identical to the background, thus making it invisible. Brighten it up to fix this. The relative differences are kept the same as before and match the default theme,, e.g. the brightness ranges from (darkest) Unfollow > Unfollow-hover > Follow > Follow-hover (brightest) Fixes https://github.com/nolanlawson/pinafore/issues/1880. --- src/scss/themes/dark-grayscale.scss | 11 +++++++++++ 1 file changed, 11 insertions(+) diff --git a/src/scss/themes/dark-grayscale.scss b/src/scss/themes/dark-grayscale.scss index f16059af..22644881 100644 --- a/src/scss/themes/dark-grayscale.scss +++ b/src/scss/themes/dark-grayscale.scss @@ -14,3 +14,14 @@ $compose-background: lighten($main-theme-color, 52%); @import "_dark.scss"; @import "_dark_navbar.scss"; @import "_dark_scrollbars.scss"; + +:root { + // like base.scss, but with $anchor-color instead of $main-theme-color + // + --action-button-fill-color: #{lighten($anchor-color, 18%)}; + --action-button-fill-color-hover: #{lighten($anchor-color, 22%)}; + --action-button-fill-color-active: #{lighten($anchor-color, 5%)}; + --action-button-fill-color-pressed: #{darken($anchor-color, 7%)}; + --action-button-fill-color-pressed-hover: #{darken($anchor-color, 2%)}; + --action-button-fill-color-pressed-active: #{darken($anchor-color, 15%)}; +}