From 3237c3c44acf63c85b65242a73b998d54e595ab2 Mon Sep 17 00:00:00 2001 From: kvakazyambra Date: Sat, 11 Nov 2023 17:27:29 +0300 Subject: [PATCH] Fixed author subscribe buttons style --- .../Author/AuthorBadge/AuthorBadge.module.scss | 5 +---- src/components/Author/AuthorBadge/AuthorBadge.tsx | 4 ++-- src/components/_shared/Button/Button.module.scss | 12 +++++++++--- 3 files changed, 12 insertions(+), 9 deletions(-) diff --git a/src/components/Author/AuthorBadge/AuthorBadge.module.scss b/src/components/Author/AuthorBadge/AuthorBadge.module.scss index c7d4ce19..f119cb5d 100644 --- a/src/components/Author/AuthorBadge/AuthorBadge.module.scss +++ b/src/components/Author/AuthorBadge/AuthorBadge.module.scss @@ -11,9 +11,6 @@ margin-bottom: 0; } } - @include media-breakpoint-down(sm) { - flex-direction: column; - } @include media-breakpoint-up(sm) { margin-bottom: 2rem; @@ -96,7 +93,7 @@ &.iconed { padding: 6px !important; - min-width: 32px; + min-width: 4rem; width: unset; &:hover img { diff --git a/src/components/Author/AuthorBadge/AuthorBadge.tsx b/src/components/Author/AuthorBadge/AuthorBadge.tsx index 79d7b506..74b49154 100644 --- a/src/components/Author/AuthorBadge/AuthorBadge.tsx +++ b/src/components/Author/AuthorBadge/AuthorBadge.tsx @@ -59,14 +59,14 @@ export const AuthorBadge = (props: Props) => { } const subscribeValue = createMemo(() => { if (props.iconButtons) { - return + return } return isSubscribing() ? t('subscribing...') : t('Subscribe') }) const unsubscribeValue = () => { if (props.iconButtons) { - return + return } return ( diff --git a/src/components/_shared/Button/Button.module.scss b/src/components/_shared/Button/Button.module.scss index 1147d926..cbca6357 100644 --- a/src/components/_shared/Button/Button.module.scss +++ b/src/components/_shared/Button/Button.module.scss @@ -144,8 +144,6 @@ width: 10em; .icon { - margin-right: 0.5em; - img { filter: invert(1); } @@ -156,7 +154,7 @@ color: #000; .icon img { - filter: invert(0); + filter: invert(0) !important; } .buttonSubscribeLabel { @@ -181,9 +179,17 @@ background: #fff; color: #000; + .icon img { + filter: invert(0); + } + &:hover { background: #000; color: #fff; + + .icon img { + filter: invert(1) !important; + } } } }