UX: revert chat footer changes partially (#27591)

This commit is contained in:
chapoi
2024-06-24 17:46:54 +02:00
committed by GitHub
parent e5c0cfcd27
commit 9f40ac0918
3 changed files with 29 additions and 27 deletions

View File

@ -68,7 +68,7 @@ export default class ChatFooter extends Component {
aria-label={{i18n "chat.direct_messages.aria_label"}} aria-label={{i18n "chat.direct_messages.aria_label"}}
id="c-footer-direct-messages" id="c-footer-direct-messages"
class={{concatClass class={{concatClass
"btn-flat" "btn-transparent"
"c-footer__item" "c-footer__item"
(if (eq this.currentRouteName "chat.direct-messages") "--active") (if (eq this.currentRouteName "chat.direct-messages") "--active")
}} }}
@ -85,7 +85,7 @@ export default class ChatFooter extends Component {
aria-label={{i18n "chat.my_threads.aria_label"}} aria-label={{i18n "chat.my_threads.aria_label"}}
id="c-footer-threads" id="c-footer-threads"
class={{concatClass class={{concatClass
"btn-flat" "btn-transparent"
"c-footer__item" "c-footer__item"
(if (eq this.currentRouteName "chat.threads") "--active") (if (eq this.currentRouteName "chat.threads") "--active")
}} }}

View File

@ -28,44 +28,37 @@
height: 100%; height: 100%;
position: relative; position: relative;
color: var(--primary-medium); color: var(--primary-medium);
background: var(
--d-nav-bg-color
) !important; // todo: remove need for !important
.d-icon { &.--active {
margin-right: 0; .d-icon,
font-size: var(--font-up-2); .d-button-label {
margin-bottom: 0.15em; color: var(--d-nav-color--active);
color: inherit;
&.d-icon-discourse-threads {
font-size: var(--font-up-2); // visual correction
} }
} }
&:hover, &:hover,
&:focus { &:focus {
.discourse-no-touch & { .discourse-no-touch &,
background: var( .discourse-touch & {
--d-nav-bg-color--hover .d-icon,
) !important; // todo: remove need for !important .d-button-label {
color: var(--d-nav-color--hover); color: var(--d-nav-color--active);
.d-icon {
color: var(--d-nav-color--hover);
} }
} }
} }
&.--active, .d-icon {
&.--active:hover { margin-right: 0;
@include nav-active(); font-size: var(--font-up-2);
background: var( color: inherit;
--d-nav-bg-color--active
) !important; // todo: remove need for !important &.d-icon-discourse-threads {
font-size: var(--font-up-1); //visual correction
}
} }
.d-button-label { .d-button-label {
font-size: var(--font-down-1-rem); font-size: var(--font-down-1-rem);
color: var(--primary-medium);
} }
.c-unread-indicator { .c-unread-indicator {

View File

@ -17,6 +17,15 @@
.c-unread-indicator.-urgent { .c-unread-indicator.-urgent {
margin-left: 1rem; margin-left: 1rem;
} }
&.--active {
.full-page-chat & {
.d-icon,
.d-button-label {
color: var(--d-nav-color--active);
}
}
}
} }
} }