diff --git a/app/javascript/flavours/glitch/styles/components/status.scss b/app/javascript/flavours/glitch/styles/components/status.scss index 4fb4fcc451..5a4d738c38 100644 --- a/app/javascript/flavours/glitch/styles/components/status.scss +++ b/app/javascript/flavours/glitch/styles/components/status.scss @@ -293,23 +293,28 @@ } } + +@mixin focusable { + outline: 0; + background: lighten($ui-base-color, 4%); + + &.status.status-direct { + background: lighten($ui-base-color, 12%); + + &.muted { + background: transparent; + } + } + + .detailed-status, + .detailed-status__action-bar { + background: lighten($ui-base-color, 8%); + } +} .focusable { - &:focus { - outline: 0; - background: lighten($ui-base-color, 4%); - - &.status.status-direct { - background: lighten($ui-base-color, 12%); - - &.muted { - background: transparent; - } - } - - .detailed-status, - .detailed-status__action-bar { - background: lighten($ui-base-color, 8%); - } + &:focus, + &:hover { + @include focusable; } }