0
0
Fork 0
mirror of https://github.com/discourse/discourse.git synced 2026-08-05 17:25:34 +08:00
discourse/themes/horizon/scss/sidebar.scss
chapoi 28d4adf0db
FIX: Horizon > Apply create-topic-label transformer to Horizon sidebar button (#40730)
Previously, the new topic button in the Horizon theme's sidebar
hardcoded its label and icon, so plugins like
discourse-calendar could not relabel it (e.g. to "New Event" in an
events category) even though the button outside the sidebar updated
correctly.
  
This change runs the label and icon through the `create-topic-label` and
`create-topic-icon` value transformers,
matching core's `d-navigation` behaviour so plugin overrides apply in
the sidebar too.

Since this button can now have two states, the icon is brought back to
improve quick-glance clarity.

<img width="1519" height="807" alt="CleanShot 2026-06-10 at 12 11 12"
src="https://github.com/user-attachments/assets/1c1e79fb-d509-40a7-b385-9e3efebf3d09"
/>
2026-06-10 12:12:28 +02:00

117 lines
2.3 KiB
SCSS
Vendored

@use "lib/viewport";
:root {
--sidebar-section-wrapper-padding: 0 var(--space-2) var(--space-4)
var(--space-4);
--d-sidebar-active-background: var(--d-selected);
}
body.has-full-page-chat .sidebar-wrapper,
.sidebar-wrapper,
.sidebar-hamburger-dropdown {
@include viewport.until(lg) {
background: var(--secondary);
.sidebar-footer-wrapper {
background: var(--secondary);
.sidebar-footer-container::before {
display: none;
}
}
}
.has-full-page-chat &,
.has-full-page-chat & .sidebar-footer-wrapper {
background: transparent;
}
.sidebar-container {
border-right: none;
}
.sidebar-section-link {
transition: none;
border-radius: var(--d-border-radius);
}
.dropdown-menu__item .sidebar-section-link {
border-radius: 0;
}
}
.sidebar-hamburger-dropdown {
.sidebar-new-topic-button__wrapper {
width: 100%;
margin: 0 0 var(--space-2);
}
}
.sidebar-section-wrapper {
--d-sidebar-section-border-color: var(--d-sidebar-border-color);
@include viewport.from(xl) {
padding-block: 0.45em;
}
@include viewport.until(sm) {
.hamburger-panel .revamped & {
margin-bottom: var(--space-4);
}
}
.sidebar-section-header {
font-size: var(--font-down-2);
}
.sidebar-section-content {
margin: 0;
display: flex;
flex-direction: column;
@include viewport.from(xl) {
gap: var(--space-1);
}
}
}
.sidebar-wrapper .sidebar-sections {
--scrollbarThumbBg: var(--d-selected);
}
.sidebar-section-link-wrapper .sidebar-section-link:focus,
.sidebar-section-link-wrapper .sidebar-section-link:hover {
.d-icon {
color: var(--primary);
}
}
.sidebar-new-topic-button__wrapper {
margin: 0 var(--space-2) var(--space-4) var(--space-4);
}
// put the draft menu above the slide-out hamburger on small desktop screens
@include viewport.until(md) {
html:not(.mobile-view) {
.topic-drafts-menu-content {
z-index: z("modal", "overlay");
}
}
}
.admin-area .sidebar-wrapper .admin-panel {
--d-sidebar-highlight-background: var(--d-selected);
--d-sidebar-link-icon-color: var(--d-sidebar-link-color);
}
.sidebar-theme-toggle__wrapper {
order: -1;
.d-icon-paintbrush {
display: none;
}
}
.sidebar-theme-toggle-dropdown.select-kit.combo-box .select-kit-header {
padding-left: 1em;
}