diff options
author | Thibaut Girka <thib@sitedethib.com> | 2019-02-15 18:21:00 +0100 |
---|---|---|
committer | Thibaut Girka <thib@sitedethib.com> | 2019-02-15 18:21:00 +0100 |
commit | a151c5566a9268930b4b4728121f8f1692019238 (patch) | |
tree | 2ae23cffcc0c7ca858a091e470df97121b3f4a39 /app/javascript/flavours/glitch/styles/components/accounts.scss | |
parent | 4dcb04b888dafd9745829f9e4f5665c84523fe5c (diff) |
[Glitch] Fix hashtags select styling in default and high contrast skins
Port 169b9d4428d8e54d7bee365fd76be9a6e2a92da5 to glitch-soc
Diffstat (limited to 'app/javascript/flavours/glitch/styles/components/accounts.scss')
-rw-r--r-- | app/javascript/flavours/glitch/styles/components/accounts.scss | 66 |
1 files changed, 63 insertions, 3 deletions
diff --git a/app/javascript/flavours/glitch/styles/components/accounts.scss b/app/javascript/flavours/glitch/styles/components/accounts.scss index ce6cc8b29..0b7b58bb0 100644 --- a/app/javascript/flavours/glitch/styles/components/accounts.scss +++ b/app/javascript/flavours/glitch/styles/components/accounts.scss @@ -339,14 +339,41 @@ display: block; font-weight: 500; margin-bottom: 10px; +} + +.column-settings__hashtags { + .column-settings__row { + margin-bottom: 15px; + } - .column-settings__hashtag-select { + .column-select { &__control { @include search-input(); } + &__placeholder { + color: $dark-text-color; + padding-left: 2px; + font-size: 12px; + } + + &__value-container { + padding-left: 6px; + } + &__multi-value { background: lighten($ui-base-color, 8%); + + &__remove { + cursor: pointer; + + &:hover, + &:active, + &:focus { + background: lighten($ui-base-color, 12%); + color: lighten($darker-text-color, 4%); + } + } } &__multi-value__label, @@ -354,9 +381,42 @@ color: $darker-text-color; } - &__indicator-separator, + &__clear-indicator, &__dropdown-indicator { - display: none; + cursor: pointer; + transition: none; + color: $dark-text-color; + + &:hover, + &:active, + &:focus { + color: lighten($dark-text-color, 4%); + } + } + + &__indicator-separator { + background-color: lighten($ui-base-color, 8%); + } + + &__menu { + @include search-popout(); + padding: 0; + background: $ui-secondary-color; + } + + &__menu-list { + padding: 6px; + } + + &__option { + color: $inverted-text-color; + border-radius: 4px; + font-size: 14px; + + &--is-focused, + &--is-selected { + background: darken($ui-secondary-color, 10%); + } } } } |