these values are not exactly the same as the palette values, so we're essentially flattening the color palette used in the theme, but this is needed when assigning custom colors for it to look good.
103 lines
4.5 KiB
SCSS
103 lines
4.5 KiB
SCSS
//
|
|
// PALETTE COLOR: accent color
|
|
$accent-color: var(--accent-color);
|
|
$button-bg-color: var(--accent-color);
|
|
$button-link-fg-color: var(--accent-color);
|
|
$button-primary-bg-color: var(--accent-color);
|
|
$input-valid-border-color: var(--accent-color);
|
|
$reaction-row-button-selected-border-color: var(--accent-color);
|
|
$roomsublist-chevron-color: var(--accent-color);
|
|
$tab-label-active-bg-color: var(--accent-color);
|
|
$togglesw-on-color: var(--accent-color);
|
|
$username-variant3-color: var(--accent-color);
|
|
$accent-color-50pct: var(--accent-color-50pct); //still needs alpha at .5
|
|
//
|
|
// PALETTE COLOR: background color
|
|
$authpage-body-bg-color: var(--background-color);
|
|
$avatar-bg-color: var(--background-color);
|
|
$button-secondary-bg-color: var(--background-color);
|
|
$field-focused-label-bg-color: var(--background-color);
|
|
$lightbox-border-color: var(--background-color);
|
|
$menu-bg-color: var(--background-color);
|
|
$message-action-bar-bg-color: var(--background-color);
|
|
$primary-bg-color: var(--background-color);
|
|
$roomtile-focused-bg-color: var(--background-color);
|
|
$roomtile-selected-bg-color: var(--background-color);
|
|
$togglesw-ball-color: var(--background-color);
|
|
$droptarget-bg-color: var(--background-color-50pct); //still needs alpha at .5
|
|
$authpage-modal-bg-color: var(--background-color-50pct); //still needs alpha at .59
|
|
//
|
|
// PALETTE COLOR: base color
|
|
$interactive-tooltip-bg-color: var(--base-color);
|
|
$tagpanel-bg-color: var(--base-color);
|
|
$tooltip-timeline-bg-color: var(--base-color);
|
|
//
|
|
// PALETTE COLOR: panel color
|
|
$event-selected-color: var(--panel-color);
|
|
$header-panel-bg-color: var(--panel-color);
|
|
$reaction-row-button-bg-color: var(--panel-color);
|
|
$panel-gradient: var(--panel-color-0pct), var(--panel-color);
|
|
// these were #f2f5f8 instead of #f3f8fd, but close enough
|
|
$dark-panel-bg-color: var(--panel-color);
|
|
$input-lighter-bg-color: var(--panel-color);
|
|
$plinth-bg-color: var(--panel-color);
|
|
$roomsublist-background: var(--panel-color);
|
|
$secondary-accent-color: var(--panel-color);
|
|
$selected-color: var(--panel-color);
|
|
$widget-menu-bar-bg-color: var(--panel-color);
|
|
//
|
|
// PALETTE COLOR: panel contrast color
|
|
$input-darker-bg-color: var(--panel-contrast-color);
|
|
$panel-divider-color: var(--panel-contrast-color);// originally #dee1f3, not #e3e8f0, but close enough
|
|
$primary-hairline-color: var(--panel-contrast-color);// originally #e5e5e5, not #e3e8f0, but close enough
|
|
//
|
|
// PALETTE COLOR: body text color
|
|
$message-action-bar-fg-color: var(--body-text-color);
|
|
$primary-fg-color: var(--body-text-color);
|
|
$settings-profile-overlay-placeholder-fg-color: var(--body-text-color);
|
|
$dialog-backdrop-color: var(--body-text-color-50pct); //still needs alpha at .38
|
|
$roomtopic-color: var(--body-text-color-50pct); //still needs alpha at .5
|
|
$tab-label-fg-color: var(--body-text-color);
|
|
$tab-label-icon-bg-color: var(--body-text-color); //was #454545
|
|
// was #212121
|
|
$roomtile-notified-color: var(--body-text-color);
|
|
$roomtile-selected-color: var(--body-text-color);
|
|
$topleftmenu-color: var(--body-text-color);
|
|
// was #45474a
|
|
$dialog-title-fg-color: var(--body-text-color);
|
|
$roomheader-color: var(--body-text-color);
|
|
$tab-label-fg-color: var(--body-text-color);
|
|
// was #4e5054
|
|
$authpage-lang-color: var(--body-text-color);
|
|
//
|
|
// PALETTE COLOR: body contrast color
|
|
$authpage-secondary-color: var(--body-contrast-color);
|
|
$memberstatus-placeholder-color: var(--body-contrast-color);
|
|
$notice-secondary-color: var(--body-contrast-color);
|
|
$pinned-color: var(--body-contrast-color);
|
|
$roomsublist-label-fg-color: var(--body-contrast-color);
|
|
$roomtile-name-color: var(--body-contrast-color);
|
|
$settings-subsection-fg-color: var(--body-contrast-color);
|
|
$roomheader-addroom-bg-color: var(--body-contrast-color);
|
|
// was #747474
|
|
$light-fg-color: var(--body-contrast-color);
|
|
// was #777777
|
|
$blockquote-fg-color: var(--body-contrast-color);
|
|
// was #888888
|
|
$greyed-fg-color: var(--body-contrast-color);
|
|
$info-plinth-fg-color: var(--body-contrast-color);
|
|
$preview-widget-fg-color: var(--body-contrast-color);
|
|
//
|
|
// PALETTE COLOR: primary color
|
|
$accent-color-alt: var(--primary-color);
|
|
$input-focused-border-color: var(--primary-color);
|
|
//
|
|
// PALETTE COLOR: warning color
|
|
$button-danger-bg-color: var(--warning-color);
|
|
$event-highlight-fg-color: var(--warning-color);
|
|
$input-invalid-border-color: var(--warning-color);
|
|
$mention-user-pill-bg-color: var(--warning-color);
|
|
$notice-primary-color: var(--warning-color);
|
|
$pinned-unread-color: var(--warning-color);
|
|
$warning-color: var(--warning-color);
|
|
$button-danger-disabled-bg-color: var(--warning-color-50pct); // still needs alpha at 0.5
|