Keegan George
4b159e9296
## 🔍 Overview This update ensures that the sidebar new topic button isn't shown on the AI conversations sidebar. It also styles the new conversation button to make use of Horizon's accent color ## 📸 Screenshots ### ← Before <img width="1228" alt="Screenshot 2025-05-02 at 14 16 41" src="https://github.com/user-attachments/assets/b187d31e-881a-4c34-b663-f4b55b8bc565" /> ### → After <img width="1232" alt="Screenshot 2025-05-02 at 14 15 34" src="https://github.com/user-attachments/assets/987cfba3-ad7c-49a9-80d8-14c3e52dd5c0" />
98 lines
2.3 KiB
SCSS
98 lines
2.3 KiB
SCSS
:root {
|
|
--d-button-border-radius: 6.25rem;
|
|
}
|
|
|
|
.discourse-no-touch .topic-body .actions .fade-out {
|
|
transition: none;
|
|
}
|
|
|
|
.sidebar-new-topic-button__wrapper .topic-drafts-menu-trigger.btn.no-text {
|
|
background: var(--accent-color);
|
|
&:hover,
|
|
&:focus-visible {
|
|
background: oklch(from var(--accent-color) 40% c h) !important;
|
|
box-shadow: none;
|
|
}
|
|
.d-icon {
|
|
color: var(--accent-text-color);
|
|
}
|
|
}
|
|
|
|
.discourse-no-touch .dropdown-menu__item .btn {
|
|
background: transparent;
|
|
}
|
|
|
|
.discourse-no-touch .btn-default.sidebar-new-topic-button,
|
|
.discourse-no-touch .btn-default,
|
|
.discourse-no-touch .select-kit .select-kit-header.btn-default {
|
|
background: var(--primary-100);
|
|
.d-icon {
|
|
color: var(--accent-color);
|
|
}
|
|
|
|
&:hover {
|
|
border-color: transparent;
|
|
box-shadow: 0px 0px 8px 1px var(--button-box-shadow);
|
|
background: var(--d-content-background);
|
|
color: var(--accent-color);
|
|
.d-icon {
|
|
color: var(--accent-color);
|
|
}
|
|
}
|
|
&:focus-visible {
|
|
background: var(--d-content-background);
|
|
color: var(--accent-color);
|
|
box-shadow: 0px 0px 0px 3px var(--button-box-shadow);
|
|
.d-icon {
|
|
color: var(--accent-color);
|
|
}
|
|
}
|
|
&:active:not(:hover, :focus) {
|
|
color: var(--primary);
|
|
background: var(--tertiary-300);
|
|
background-image: none;
|
|
.d-icon {
|
|
color: var(--tertiary-high);
|
|
}
|
|
}
|
|
}
|
|
|
|
.btn-primary,
|
|
#create-topic.btn,
|
|
.discourse-no-touch .btn-default.ai-new-question-button {
|
|
background-color: var(--accent-color);
|
|
color: var(--accent-text-color);
|
|
.d-icon {
|
|
color: var(--accent-text-color);
|
|
}
|
|
&:hover {
|
|
.discourse-no-touch & {
|
|
background: light-dark(
|
|
oklch(from var(--accent-color) 40% c h),
|
|
oklch(from var(--accent-color) 50% c h)
|
|
);
|
|
box-shadow: 0px 0px 6px 1px var(--button-box-shadow);
|
|
color: var(--accent-text-color);
|
|
.d-icon {
|
|
color: var(--accent-text-color);
|
|
}
|
|
}
|
|
}
|
|
&:focus-visible {
|
|
.discourse-no-touch & {
|
|
background: light-dark(
|
|
oklch(from var(--accent-color) 40% c h),
|
|
oklch(from var(--accent-color) 50% c h)
|
|
);
|
|
box-shadow: 0px 0px 0px 4px var(--button-box-shadow);
|
|
color: var(--accent-text-color);
|
|
}
|
|
}
|
|
&:active {
|
|
background: light-dark(
|
|
oklch(from var(--accent-color) 40% c h),
|
|
oklch(from var(--accent-color) 50% c h)
|
|
);
|
|
}
|
|
}
|