151 lines
6.5 KiB
SCSS
151 lines
6.5 KiB
SCSS
@use "../../colors" as c;
|
|
|
|
:root {
|
|
--brand-experiment: #{c.$yellow};
|
|
}
|
|
|
|
.theme-dark {
|
|
--header-primary: #{c.$fg};
|
|
--header-secondary: #{c.$fg-dark};
|
|
--text-normal: #{c.$fg};
|
|
--text-muted: #{c.$fg-dark};
|
|
--text-link: #{c.$yellow};
|
|
--text-link-low-saturation: var(--text-link);
|
|
--text-positive: #{c.$green};
|
|
--text-warning: #{c.$yellow};
|
|
--text-danger: #{c.$red};
|
|
--text-brand: #{c.$yellow};
|
|
--interactive-normal: #{c.$fg};
|
|
--interactive-hover: #{c.$fg-bright};
|
|
--interactive-active: #{c.$fg-bright};
|
|
--interactive-muted: #{c.$fg-dark};
|
|
--mention-foreground: #{c.$fg};
|
|
--mention-background: #{c.$yellow}#{33};
|
|
--background-primary: #{c.$bg};
|
|
--background-secondary: #{c.$bg};
|
|
--background-secondary-alt: #{c.$bg};
|
|
--background-tertiary: #{c.$bg};
|
|
--background-accent: #{c.$bg};
|
|
--background-floating: #{c.$bg};
|
|
--background-nested-floating: #{c.$bg};
|
|
--background-mobile-primary: #{c.$bg};
|
|
--background-mobile-secondary: #{c.$bg};
|
|
--chat-background: #{c.$bg};
|
|
--chat-border: #{c.$bg};
|
|
--chat-input-container-background: #{c.$bg};
|
|
--background-modifier-hover: #{c.$bg};
|
|
--background-modifier-active: #{c.$bg};
|
|
--background-modifier-selected: #{c.$bg};
|
|
--background-modifier-accent: #{c.$bg};
|
|
--info-positive-background: #{c.$green}#{33};
|
|
--info-positive-foreground: #{c.$green};
|
|
--info-positive-text: #{c.$fg};
|
|
--info-warning-background: #{c.$yellow}#{33};
|
|
--info-warning-foreground: #{c.$yellow};
|
|
--info-warning-text: #{c.$fg};
|
|
--info-danger-background: #{c.$red}#{33};
|
|
--info-danger-foreground: #{c.$red};
|
|
--info-danger-text: #{c.$fg};
|
|
--info-help-background: #{c.$yellow}#{33};
|
|
--info-help-foreground: #{c.$yellow};
|
|
--info-help-text: #{c.$fg};
|
|
--status-positive-background: #{c.$green};
|
|
--status-positive-text: #{c.$fg};
|
|
--status-warning-background: #{c.$yellow};
|
|
--status-warning-text: #{c.$fg};
|
|
--status-danger-background: #{c.$red};
|
|
--status-danger-text: #{c.$fg};
|
|
--status-positive: #{c.$green};
|
|
--status-warning: #{c.$yellow};
|
|
--status-danger: #{c.$red};
|
|
--button-danger-background: #{c.$red};
|
|
--button-danger-background-hover: #{c.$red-bright};
|
|
--button-danger-background-active: #{c.$red-bright};
|
|
--button-danger-background-disabled: #{c.$bg-dark};
|
|
--button-positive-background: #{c.$green};
|
|
--button-positive-background-hover: #{c.$green-bright};
|
|
--button-positive-background-active: #{c.$green-bright};
|
|
--button-positive-background-disabled: #{c.$bg-dark};
|
|
--button-secondary-background: #{c.$bg};
|
|
--button-secondary-background-hover: #{c.$bg-bright};
|
|
--button-secondary-background-active: #{c.$bg-bright};
|
|
--button-secondary-background-disabled: #{c.$bg-dark};
|
|
--button-outline-danger-text: #{c.$fg};
|
|
--button-outline-danger-border: #{c.$red};
|
|
--button-outline-danger-background: #{c.$bg}#{00};
|
|
--button-outline-danger-background-hover: #{c.$red-bright};
|
|
--button-outline-danger-text-hover: #{c.$fg};
|
|
--button-outline-danger-border-hover: #{c.$red-bright};
|
|
--button-outline-danger-background-active: #{c.$red-bright};
|
|
--button-outline-danger-text-active: #{c.$fg};
|
|
--button-outline-danger-border-active: #{c.$red-bright};
|
|
--button-outline-positive-text: #{c.$fg};
|
|
--button-outline-positive-border: #{c.$green};
|
|
--button-outline-positive-background: #{c.$bg}#{00};
|
|
--button-outline-positive-background-hover: #{c.$green-bright};
|
|
--button-outline-positive-text-hover: #{c.$fg};
|
|
--button-outline-positive-border-hover: #{c.$green-bright};
|
|
--button-outline-positive-background-active: #{c.$green-bright};
|
|
--button-outline-positive-text-active: #{c.$fg};
|
|
--button-outline-positive-border-active: #{c.$green-bright};
|
|
--button-outline-brand-text: #{c.$fg};
|
|
--button-outline-brand-border: #{c.$yellow};
|
|
--button-outline-brand-background: #{c.$bg}#{00};
|
|
--button-outline-brand-background-hover: #{c.$yellow-bright};
|
|
--button-outline-brand-text-hover: #{c.$fg};
|
|
--button-outline-brand-border-hover: #{c.$yellow-bright};
|
|
--button-outline-brand-background-active: #{c.$yellow-bright};
|
|
--button-outline-brand-text-active: #{c.$fg};
|
|
--button-outline-brand-border-active: #{c.$yellow-bright};
|
|
--button-outline-primary-text: #{c.$fg};
|
|
--button-outline-primary-border: #{c.$bg-brighter};
|
|
--button-outline-primary-background: #{c.$bg}#{00};
|
|
--button-outline-primary-background-hover: #{c.$bg-bright};
|
|
--button-outline-primary-text-hover: #{c.$fg};
|
|
--button-outline-primary-border-hover: #{c.$bg-brighter};
|
|
--button-outline-primary-background-active: #{c.$bg-bright};
|
|
--button-outline-primary-text-active: #{c.$fg};
|
|
--button-outline-primary-border-active: #{c.$bg-brighter};
|
|
--modal-background: #{c.$bg};
|
|
--modal-footer-background: #{c.$bg};
|
|
--scrollbar-thin-thumb: #{c.$yellow};
|
|
--scrollbar-thin-track: transparent;
|
|
--scrollbar-auto-thumb: #{c.$yellow};
|
|
--scrollbar-auto-track: #{c.$bg};
|
|
--scrollbar-auto-scrollbar-color-thumb: #{c.$yellow};
|
|
--scrollbar-auto-scrollbar-color-track: #{c.$bg};
|
|
--input-background: v#{c.$bg};
|
|
--input-placeholder-text: #{c.$fg-dark};
|
|
--logo-primary: #{c.$fg};
|
|
--focus-primary: var(--focus-primary-500);
|
|
--control-brand-foreground: var(--brand-360);
|
|
--control-brand-foreground-new: var(--brand-new-360);
|
|
--background-mentioned: transparent;
|
|
--background-mentioned-hover: transparent;
|
|
--background-message-hover: transparent;
|
|
--background-message-automod: hsl(var(--status-red-500-hsl)/0.05);
|
|
--background-message-automod-hover: hsl(var(--status-red-500-hsl)/0.1);
|
|
--background-message-highlight: hsl(var(--brand-360-hsl)/0.08);
|
|
--background-message-highlight-hover: hsl(var(--brand-360-hsl)/0.06);
|
|
--channels-default: var(--primary-dark-345);
|
|
--channel-icon: var(--primary-dark-360);
|
|
--channel-text-area-placeholder: #{c.$fg-dark};
|
|
--channeltextarea-background: #{c.$bg};
|
|
--activity-card-background: #{c.$bg};
|
|
--textbox-markdown-syntax: var(--primary-dark-360);
|
|
--spoiler-revealed-background: var(--primary-dark-660);
|
|
--spoiler-hidden-background: var(--primary-dark-700);
|
|
--android-navigation-bar-background: var(--primary-dark-830);
|
|
--android-ripple: hsl(var(--white-500-hsl)/0.07);
|
|
--deprecated-card-bg: hsl(var(--primary-dark-700-hsl)/0.6);
|
|
--deprecated-card-editable-bg: hsl(var(--primary-dark-700-hsl)/0.3);
|
|
--deprecated-store-bg: var(--primary-dark-600);
|
|
--deprecated-quickswitcher-input-background: var(--primary-dark-400);
|
|
--deprecated-quickswitcher-input-placeholder: hsl(var(--white-500-hsl)/0.3);
|
|
--deprecated-text-input-bg: var(--primary-dark-700);
|
|
--deprecated-text-input-border: hsl(var(--black-500-hsl)/0.3);
|
|
--deprecated-text-input-border-hover: var(--primary-dark-900);
|
|
--deprecated-text-input-border-disabled: var(--primary-dark-700);
|
|
--deprecated-text-input-prefix: var(--primary-dark-200);
|
|
}
|