mirror of
https://github.com/discourse/discourse.git
synced 2026-08-05 17:25:34 +08:00
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" />
117 lines
2.3 KiB
SCSS
Vendored
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;
|
|
}
|