diff --git a/plugins/chat/assets/stylesheets/common/index.scss b/plugins/chat/assets/stylesheets/common/index.scss index 63180512d43..70b67999592 100644 --- a/plugins/chat/assets/stylesheets/common/index.scss +++ b/plugins/chat/assets/stylesheets/common/index.scss @@ -1,7 +1,6 @@ @import "chat-unread-indicator"; @import "chat-height-mixin"; @import "base-common"; -@import "sidebar-extensions"; @import "chat-drawer-routes"; @import "chat-browse"; @import "chat-channel"; diff --git a/plugins/chat/assets/stylesheets/common/sidebar-extensions.scss b/plugins/chat/assets/stylesheets/common/sidebar-extensions.scss deleted file mode 100644 index 4c3431b32b9..00000000000 --- a/plugins/chat/assets/stylesheets/common/sidebar-extensions.scss +++ /dev/null @@ -1,172 +0,0 @@ -// Styles to make channels list in sidebar match sidebar theme -.chat-enabled { - .has-sidebar { - .sidebar-header { - .d-header .menu-panel { - top: calc(3.4em - 2px) !important; - } - .d-header-icons .icon { - width: 2em; - height: 2em; - img.avatar, - #logo-small { - width: 2em; - height: 2em; - } - } - } - .header-dropdown-toggle.chat-header-icon { - .chat-channel-unread-indicator { - border-color: var(--primary-very-low); - } - } - .sidebar-container { - .channels-list { - .chat-channel-divider { - padding: 0 0.5em 0 1.75rem; - } - .chat-channel-row { - padding-right: 0.75em; - } - .chat-channel-leave-btn { - padding: 0; - } - } - } - } - - .sidebar-section-wrapper.sidebar-section[data-section-name="my-threads"] { - .sidebar-section-content { - padding-bottom: 0; - } - } - - .sidebar-container { - .channels-list { - color: var(--primary); - font-size: var(--font-down-1); - padding-bottom: 2em; - width: 100%; - overflow-x: hidden; - - .chat-channel-divider { - padding: 0 1.75rem; - - &:hover { - .title-caret { - opacity: 1; - } - } - } - - .channels-list-container { - margin-bottom: 1rem; - } - - .channel-list-empty-message { - margin: 0; - padding: 0em 2em 0.5em; - } - - .chat-channel-row:not(.active) { - &:hover { - .category-chat-private { - .d-icon { - background-color: var(--primary-low); - } - } - } - .category-chat-private { - .d-icon { - background-color: var(--primary-very-low); - } - } - } - - .open-new-message-btn, - .open-browse-page-btn, - .edit-channels-dropdown .select-kit-header, - .chat-channel-leave-btn { - display: flex; - padding: 0.25em; - border-radius: 0.25em; - - &:hover { - background-color: var(--primary-low); - - .d-icon { - color: var(--primary-medium); - } - } - - .d-icon { - color: var(--primary-medium); - font-size: var(--font-down-1); - padding: 0.25em; - } - } - - .chat-channel-leave-btn { - padding-top: 0; - padding-bottom: 0; - height: 100%; - border-radius: 0; - - &:hover { - .d-icon { - color: var(--primary-medium); - } - } - } - - .chat-channel-row { - padding-left: calc(1.8rem / 2); - margin-left: calc(1.8rem / 2); - border-radius: 0.25em; - padding-right: 1.8rem; - min-height: 28px; - margin-bottom: 0.125rem; - - &:hover { - background-color: var(--primary-low); - } - - .chat-channel-title { - padding: 0.25rem; - font-weight: unset; - margin: 0; - } - } - } - } -} - -.chat-enabled { - .sidebar-section-link-prefix { - .prefix-image { - border: 1px solid transparent; - } - - &.active .prefix-image { - box-shadow: 0px 0px 0px 1px var(--success); - } - } - - .sidebar-section-link--active { - background: var(--primary-low); - } - - .sidebar-section-link--muted { - opacity: 0.5; - - .sidebar-section-link-prefix.icon .d-icon { - color: var(--primary-medium); - } - - &.active { - .sidebar-section-link-prefix.icon .d-icon { - color: var(--primary-high); - } - } - } -} diff --git a/plugins/chat/assets/stylesheets/desktop/base-desktop.scss b/plugins/chat/assets/stylesheets/desktop/base-desktop.scss index 9cc0f3061f8..be92d2443c2 100644 --- a/plugins/chat/assets/stylesheets/desktop/base-desktop.scss +++ b/plugins/chat/assets/stylesheets/desktop/base-desktop.scss @@ -3,9 +3,9 @@ } .full-page-chat { - &.teams-sidebar-on { + &.full-page-chat-sidebar-enabled { grid-template-columns: 1fr; - + overflow: inherit; .chat-channel { border-radius: var(--full-page-border-radius); } @@ -69,50 +69,18 @@ } // Full Page Styling in Core -.has-full-page-chat:not(.discourse-sidebar) { - --max-chat-width: 1200px; - +.has-full-page-chat { #main-outlet { - max-width: var(--max-chat-width); padding: 0; } .full-page-chat { - border-right: 1px solid var(--primary-low); border-left: 1px solid var(--primary-low); + border-right: 1px solid var(--primary-low); } - @media screen and (max-width: var(--max-chat-width)) { - #main-outlet { - max-width: 100%; - padding: 0; - } - - .full-page-chat { - border: none; - grid-template-columns: 250px 1fr; - } - } -} - -// Full page styling with sidebar enabled -.discourse-sidebar.has-full-page-chat { - #main-outlet { - padding: 2em 0 0 0; - } - - .full-page-chat.teams-sidebar-on { - .chat-channel { - border-radius: 0; - } - - .chat-message { - padding-left: 1em; - } - - .chat-messages-container .chat-message-deleted { - padding: 0.25em 1em; - } + &.has-sidebar-page .full-page-chat { + border-left: 0; } } diff --git a/plugins/chat/assets/stylesheets/desktop/index.scss b/plugins/chat/assets/stylesheets/desktop/index.scss index 3a3178be68b..7ae411ba1b0 100644 --- a/plugins/chat/assets/stylesheets/desktop/index.scss +++ b/plugins/chat/assets/stylesheets/desktop/index.scss @@ -9,4 +9,3 @@ @import "chat-message-creator"; @import "chat-message-thread-indicator"; @import "chat-side-panel"; -@import "sidebar-extensions"; diff --git a/plugins/chat/assets/stylesheets/desktop/sidebar-extensions.scss b/plugins/chat/assets/stylesheets/desktop/sidebar-extensions.scss deleted file mode 100644 index 34eda5b38e6..00000000000 --- a/plugins/chat/assets/stylesheets/desktop/sidebar-extensions.scss +++ /dev/null @@ -1,4 +0,0 @@ -.full-page-chat.full-page-chat-sidebar-enabled { - grid-template-columns: 1fr; - overflow: inherit; -}