diff --git a/app/javascript/flavours/glitch/styles/components/misc.scss b/app/javascript/flavours/glitch/styles/components/misc.scss index 064d500d5a..40fd159879 100644 --- a/app/javascript/flavours/glitch/styles/components/misc.scss +++ b/app/javascript/flavours/glitch/styles/components/misc.scss @@ -1345,7 +1345,7 @@ button.icon-button.active i.fa-retweet { display: flex; align-items: center; justify-content: center; - background: rgba($black, 0.5); + background: transparent; width: 100%; height: 100%; padding: 0; @@ -1354,6 +1354,10 @@ button.icon-button.active i.fa-retweet { color: $white; &__label { + background-color: rgba($black, 0.45); + backdrop-filter: blur(10px) saturate(180%) contrast(75%) brightness(70%); + border-radius: 6px; + padding: 10px 15px; display: flex; align-items: center; justify-content: center; @@ -1367,6 +1371,13 @@ button.icon-button.active i.fa-retweet { font-weight: 400; font-size: 13px; } + + &:hover, + &:focus { + .spoiler-button__overlay__label { + background-color: rgba($black, 0.9); + } + } } }