mirror of
https://github.com/element-hq/element-web
synced 2024-10-23 11:15:47 +03:00
Color cleanup number 7 (#7094)
* $reaction-row-button-selected-border-color -> $accent-color Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com> * $reaction-row-button-bg-color -> $header-panel-bg-color Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com> * Remove $room-warning-bg-color Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com> * Remove $button-link-bg-color Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com> * Remove $tab-label-icon-bg-color Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com> * Remove $tab-label-bg-color Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com> * Remove $event-redacted-border-color Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com> * Remove $event-redacted-fg-color Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com> * Remove $panel-divider-color Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com> * $search-placeholder-color -> #61708b Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com> * $search-bg-color -> #181b21 Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com> * $header-panel-border-color -> #000000 Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com> * Remove $scrollbar-track-color Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com> * $eventbubble-avatar-outline -> $background Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
This commit is contained in:
Šimon Brandner
GitHub
parent
50ff00084f
commit
71d8946641
14 changed files with 16 additions and 101 deletions
|
|
@ -16,7 +16,7 @@ limitations under the License.
|
|||
|
||||
// make any scrollbar grey and thin
|
||||
html {
|
||||
scrollbar-color: $scrollbar-thumb-color $scrollbar-track-color;
|
||||
scrollbar-color: $scrollbar-thumb-color transparent;
|
||||
}
|
||||
// scrollbar-width is not inherited (but -color is, why?!),
|
||||
// so declare it on every element
|
||||
|
|
@ -27,7 +27,6 @@ html {
|
|||
::-webkit-scrollbar {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
background-color: $scrollbar-track-color;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
|
|
@ -37,11 +36,7 @@ html {
|
|||
|
||||
// make auto-hide scrollbars not transparent again on hover
|
||||
.mx_AutoHideScrollbar:hover {
|
||||
scrollbar-color: $scrollbar-thumb-color $scrollbar-track-color;
|
||||
|
||||
&::-webkit-scrollbar {
|
||||
background-color: $scrollbar-track-color;
|
||||
}
|
||||
scrollbar-color: $scrollbar-thumb-color transparent;
|
||||
|
||||
&::-webkit-scrollbar-thumb {
|
||||
background-color: $scrollbar-thumb-color;
|
||||
|
|
|
|||
|
|
@ -44,7 +44,7 @@ limitations under the License.
|
|||
kbd {
|
||||
padding: 5px;
|
||||
border-radius: 4px;
|
||||
background-color: $reaction-row-button-bg-color;
|
||||
background-color: $header-panel-bg-color;
|
||||
margin-right: 5px;
|
||||
min-width: 20px;
|
||||
text-align: center;
|
||||
|
|
|
|||
|
|
@ -101,7 +101,6 @@ limitations under the License.
|
|||
|
||||
.mx_AccessibleButton_kind_link {
|
||||
color: $accent-color;
|
||||
background-color: $button-link-bg-color;
|
||||
}
|
||||
|
||||
.mx_AccessibleButton_kind_link.mx_AccessibleButton_disabled {
|
||||
|
|
@ -111,7 +110,6 @@ limitations under the License.
|
|||
.mx_AccessibleButton_hasKind.mx_AccessibleButton_kind_link_sm {
|
||||
padding: 5px 12px;
|
||||
color: $accent-color;
|
||||
background-color: $button-link-bg-color;
|
||||
}
|
||||
|
||||
.mx_AccessibleButton_kind_link_sm.mx_AccessibleButton_disabled {
|
||||
|
|
|
|||
|
|
@ -37,10 +37,6 @@ limitations under the License.
|
|||
padding: 0 8px 0 0;
|
||||
}
|
||||
|
||||
.mx_ResizeHandle > div {
|
||||
background: $panel-divider-color;
|
||||
}
|
||||
|
||||
.mx_ResizeHandle.mx_ResizeHandle_horizontal > div {
|
||||
width: 1px;
|
||||
height: 100%;
|
||||
|
|
|
|||
|
|
@ -27,7 +27,6 @@ limitations under the License.
|
|||
flex: 1 1 0;
|
||||
height: 0;
|
||||
border: none;
|
||||
border-bottom: 1px solid $panel-divider-color;
|
||||
}
|
||||
|
||||
.mx_DateSeparator > div {
|
||||
|
|
|
|||
|
|
@ -21,7 +21,7 @@ limitations under the License.
|
|||
padding: 1px 6px;
|
||||
border: 1px solid $reaction-row-button-border-color;
|
||||
border-radius: 10px;
|
||||
background-color: $reaction-row-button-bg-color;
|
||||
background-color: $header-panel-bg-color;
|
||||
cursor: pointer;
|
||||
user-select: none;
|
||||
vertical-align: middle;
|
||||
|
|
@ -32,7 +32,7 @@ limitations under the License.
|
|||
|
||||
&.mx_ReactionsRowButton_selected {
|
||||
background-color: $reaction-row-button-selected-bg-color;
|
||||
border-color: $reaction-row-button-selected-border-color;
|
||||
border-color: $accent-color;
|
||||
}
|
||||
|
||||
&.mx_AccessibleButton_disabled {
|
||||
|
|
|
|||
|
|
@ -219,7 +219,7 @@ limitations under the License.
|
|||
line-height: 1;
|
||||
z-index: 9;
|
||||
img {
|
||||
box-shadow: 0 0 0 3px $eventbubble-avatar-outline;
|
||||
box-shadow: 0 0 0 3px $background;
|
||||
border-radius: 50%;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -73,7 +73,6 @@ limitations under the License.
|
|||
|
||||
.mx_RoomPreviewBar_panel {
|
||||
padding: 8px 8px 8px 20px;
|
||||
border-top: 1px solid $panel-divider-color;
|
||||
|
||||
flex-direction: row;
|
||||
|
||||
|
|
|
|||
|
|
@ -21,12 +21,9 @@ $space-nav: rgba($panel-base, 0.1);
|
|||
// unified palette
|
||||
// try to use these colors when possible
|
||||
$header-panel-bg-color: #20252B;
|
||||
$header-panel-border-color: #000000;
|
||||
$header-panel-text-primary-color: #B9BEC6;
|
||||
$header-panel-text-secondary-color: #c8c8cd;
|
||||
$text-secondary-color: #B9BEC6;
|
||||
$search-bg-color: #181b21;
|
||||
$search-placeholder-color: #61708b;
|
||||
$room-highlight-color: #343a46;
|
||||
|
||||
// typical text (dark-on-white in light skin)
|
||||
|
|
@ -62,8 +59,8 @@ $primary-hairline-color: transparent;
|
|||
|
||||
// used for the border of input text fields
|
||||
$input-border-color: rgba(231, 231, 231, 0.2);
|
||||
$input-darker-bg-color: $search-bg-color;
|
||||
$input-darker-fg-color: $search-placeholder-color;
|
||||
$input-darker-bg-color: #181b21;
|
||||
$input-darker-fg-color: #61708b;
|
||||
$input-lighter-bg-color: #f2f5f8;
|
||||
$input-focused-border-color: #238cf5;
|
||||
|
||||
|
|
@ -71,10 +68,9 @@ $resend-button-divider-color: #b9bec64a; // muted-text with a 4A opacity.
|
|||
|
||||
// scrollbars
|
||||
$scrollbar-thumb-color: rgba(255, 255, 255, 0.2);
|
||||
$scrollbar-track-color: transparent;
|
||||
|
||||
// context menus
|
||||
$menu-border-color: $header-panel-border-color;
|
||||
$menu-border-color: #000000;
|
||||
$menu-bg-color: $header-panel-bg-color;
|
||||
$menu-box-shadow-color: $background;
|
||||
$menu-selected-color: $room-highlight-color;
|
||||
|
|
@ -121,15 +117,9 @@ $roomtile-default-badge-bg-color: #61708b;
|
|||
|
||||
// ********************
|
||||
|
||||
$panel-divider-color: transparent;
|
||||
|
||||
$widget-menu-bar-bg-color: $header-panel-bg-color;
|
||||
$widget-body-bg-color: rgba(141, 151, 165, 0.2);
|
||||
|
||||
// event redaction
|
||||
$event-redacted-fg-color: #606060;
|
||||
$event-redacted-border-color: #000000;
|
||||
|
||||
$event-highlight-bg-color: #25271F;
|
||||
|
||||
// event timestamp
|
||||
|
|
@ -138,8 +128,6 @@ $event-timestamp-color: $text-secondary-color;
|
|||
// Tabbed views
|
||||
$tab-label-fg-color: $primary-content;
|
||||
$tab-label-active-fg-color: $primary-content;
|
||||
$tab-label-bg-color: transparent;
|
||||
$tab-label-icon-bg-color: $primary-content;
|
||||
$tab-label-active-icon-bg-color: $primary-content;
|
||||
|
||||
// Buttons
|
||||
|
|
@ -148,7 +136,6 @@ $button-secondary-bg-color: transparent;
|
|||
$button-danger-fg-color: $primary-content;
|
||||
$button-danger-disabled-fg-color: $primary-content;
|
||||
$button-danger-disabled-bg-color: #f5b6bb; // TODO: Verify color
|
||||
$button-link-bg-color: transparent;
|
||||
|
||||
// Toggle switch
|
||||
$togglesw-off-color: $room-highlight-color;
|
||||
|
|
@ -160,8 +147,6 @@ $progressbar-bg-color: $system;
|
|||
|
||||
$visual-bell-bg-color: #800;
|
||||
|
||||
$room-warning-bg-color: $header-panel-bg-color;
|
||||
|
||||
$authpage-primary-color: $primary-content;
|
||||
|
||||
$dark-panel-bg-color: $header-panel-bg-color;
|
||||
|
|
@ -172,11 +157,9 @@ $message-action-bar-fg-color: $header-panel-text-primary-color;
|
|||
$message-action-bar-border-color: #616b7f;
|
||||
$message-action-bar-hover-border-color: $header-panel-text-primary-color;
|
||||
|
||||
$reaction-row-button-bg-color: $header-panel-bg-color;
|
||||
$reaction-row-button-border-color: #616b7f;
|
||||
$reaction-row-button-hover-border-color: $header-panel-text-primary-color;
|
||||
$reaction-row-button-selected-bg-color: #1f6954;
|
||||
$reaction-row-button-selected-border-color: $accent-color;
|
||||
|
||||
$kbd-border-color: #000000;
|
||||
|
||||
|
|
@ -204,7 +187,6 @@ $codeblock-background-color: #2a3039;
|
|||
$eventbubble-self-bg: #14322E;
|
||||
$eventbubble-others-bg: $event-selected-color;
|
||||
$eventbubble-bg-hover: #1C2026;
|
||||
$eventbubble-avatar-outline: $background;
|
||||
$eventbubble-reply-color: #C1C6CD;
|
||||
|
||||
// ***** Mixins! *****
|
||||
|
|
|
|||
|
|
@ -7,13 +7,10 @@ $bg-color: #181b21;
|
|||
$base-color: #15171b;
|
||||
$base-text-color: #edf3ff;
|
||||
$header-panel-bg-color: #22262e;
|
||||
$header-panel-border-color: #000000;
|
||||
$header-panel-text-primary-color: #a1b2d1;
|
||||
$header-panel-text-secondary-color: #c8c8cd;
|
||||
$text-primary-color: #edf3ff;
|
||||
$text-secondary-color: #a1b2d1;
|
||||
$search-bg-color: #181b21;
|
||||
$search-placeholder-color: #61708b;
|
||||
$room-highlight-color: #343a46;
|
||||
|
||||
// typical text (dark-on-white in light skin)
|
||||
|
|
@ -49,12 +46,12 @@ $selected-color: $room-highlight-color;
|
|||
$event-selected-color: $header-panel-bg-color;
|
||||
|
||||
// used for the hairline dividers in RoomView
|
||||
$primary-hairline-color: $header-panel-border-color;
|
||||
$primary-hairline-color: #000000;
|
||||
|
||||
// used for the border of input text fields
|
||||
$input-border-color: #e7e7e7;
|
||||
$input-darker-bg-color: $search-bg-color;
|
||||
$input-darker-fg-color: $search-placeholder-color;
|
||||
$input-darker-bg-color: #181b21;
|
||||
$input-darker-fg-color: #61708b;
|
||||
$input-lighter-bg-color: #f2f5f8;
|
||||
$input-focused-border-color: #238cf5;
|
||||
|
||||
|
|
@ -62,10 +59,9 @@ $resend-button-divider-color: $muted-fg-color;
|
|||
|
||||
// scrollbars
|
||||
$scrollbar-thumb-color: rgba(255, 255, 255, 0.2);
|
||||
$scrollbar-track-color: transparent;
|
||||
|
||||
// context menus
|
||||
$menu-border-color: $header-panel-border-color;
|
||||
$menu-border-color: #000000;
|
||||
$menu-bg-color: $header-panel-bg-color;
|
||||
$menu-box-shadow-color: $bg-color;
|
||||
$menu-selected-color: $room-highlight-color;
|
||||
|
|
@ -89,7 +85,7 @@ $settings-subsection-fg-color: $text-secondary-color;
|
|||
|
||||
$topleftmenu-color: $text-primary-color;
|
||||
$roomheader-color: $text-primary-color;
|
||||
$roomheader-addroom-bg-color: #3c4556; // $search-placeholder-color at 0.5 opacity
|
||||
$roomheader-addroom-bg-color: #3c4556;
|
||||
$roomheader-addroom-fg-color: $text-primary-color;
|
||||
$groupFilterPanel-button-color: $header-panel-text-primary-color;
|
||||
$groupheader-button-color: $header-panel-text-primary-color;
|
||||
|
|
@ -137,15 +133,9 @@ $roomtile-selected-bg-color: #1A1D23;
|
|||
|
||||
// ********************
|
||||
|
||||
$panel-divider-color: $header-panel-border-color;
|
||||
|
||||
$widget-menu-bar-bg-color: $header-panel-bg-color;
|
||||
$widget-body-bg-color: #1A1D23;
|
||||
|
||||
// event redaction
|
||||
$event-redacted-fg-color: #606060;
|
||||
$event-redacted-border-color: #000000;
|
||||
|
||||
$event-highlight-bg-color: #25271F;
|
||||
|
||||
// event timestamp
|
||||
|
|
@ -154,8 +144,6 @@ $event-timestamp-color: $text-secondary-color;
|
|||
// Tabbed views
|
||||
$tab-label-fg-color: $text-primary-color;
|
||||
$tab-label-active-fg-color: $text-primary-color;
|
||||
$tab-label-bg-color: transparent;
|
||||
$tab-label-icon-bg-color: $text-primary-color;
|
||||
$tab-label-active-icon-bg-color: $text-primary-color;
|
||||
|
||||
// Buttons
|
||||
|
|
@ -164,7 +152,6 @@ $button-secondary-bg-color: transparent;
|
|||
$button-danger-fg-color: #ffffff;
|
||||
$button-danger-disabled-fg-color: #ffffff;
|
||||
$button-danger-disabled-bg-color: #f5b6bb; // TODO: Verify color
|
||||
$button-link-bg-color: transparent;
|
||||
|
||||
// Toggle switch
|
||||
$togglesw-off-color: $room-highlight-color;
|
||||
|
|
@ -173,8 +160,6 @@ $progressbar-bg-color: #21262c;
|
|||
|
||||
$visual-bell-bg-color: #800;
|
||||
|
||||
$room-warning-bg-color: $header-panel-bg-color;
|
||||
|
||||
$dark-panel-bg-color: $header-panel-bg-color;
|
||||
$panel-gradient: rgba(34, 38, 46, 0), rgba(34, 38, 46, 1);
|
||||
|
||||
|
|
@ -183,11 +168,9 @@ $message-action-bar-fg-color: $header-panel-text-primary-color;
|
|||
$message-action-bar-border-color: #616b7f;
|
||||
$message-action-bar-hover-border-color: $header-panel-text-primary-color;
|
||||
|
||||
$reaction-row-button-bg-color: $header-panel-bg-color;
|
||||
$reaction-row-button-border-color: #616b7f;
|
||||
$reaction-row-button-hover-border-color: $header-panel-text-primary-color;
|
||||
$reaction-row-button-selected-bg-color: #1f6954;
|
||||
$reaction-row-button-selected-border-color: $accent-color;
|
||||
|
||||
$kbd-border-color: #000000;
|
||||
|
||||
|
|
@ -211,7 +194,6 @@ $codeblock-background-color: #2a3039;
|
|||
$eventbubble-self-bg: #14322E;
|
||||
$eventbubble-others-bg: $event-selected-color;
|
||||
$eventbubble-bg-hover: #1C2026;
|
||||
$eventbubble-avatar-outline: $bg-color;
|
||||
$eventbubble-reply-color: #C1C6CD;
|
||||
|
||||
// ***** Mixins! *****
|
||||
|
|
|
|||
|
|
@ -95,7 +95,6 @@ $input-underline-color: rgba(151, 151, 151, 0.5);
|
|||
$input-fg-color: rgba(74, 74, 74, 0.9);
|
||||
// scrollbars
|
||||
$scrollbar-thumb-color: rgba(0, 0, 0, 0.2);
|
||||
$scrollbar-track-color: transparent;
|
||||
// context menus
|
||||
$menu-border-color: #e7e7e7;
|
||||
$menu-bg-color: #fff;
|
||||
|
|
@ -199,8 +198,6 @@ $username-variant6-color: #2dc2c5;
|
|||
$username-variant7-color: #5c56f5;
|
||||
$username-variant8-color: #74d12c;
|
||||
|
||||
$panel-divider-color: #dee1f3;
|
||||
|
||||
// ********************
|
||||
|
||||
$widget-menu-bar-bg-color: $secondary-accent-color;
|
||||
|
|
@ -208,7 +205,7 @@ $widget-body-bg-color: #fff;
|
|||
|
||||
// ********************
|
||||
|
||||
// both $event-highlight-bg-color and $room-warning-bg-color share this value,
|
||||
// $event-highlight-bg-color shares this value,
|
||||
// so to not make their order dependent on who depends on who, have a shared value
|
||||
// defined before both
|
||||
$yellow-background: #fff8e3;
|
||||
|
|
@ -218,10 +215,6 @@ $event-notsent-color: #f44;
|
|||
|
||||
$event-highlight-bg-color: $yellow-background;
|
||||
|
||||
// event redaction
|
||||
$event-redacted-fg-color: #e2e2e2;
|
||||
$event-redacted-border-color: #cccccc;
|
||||
|
||||
// event timestamp
|
||||
$event-timestamp-color: #acacac;
|
||||
|
||||
|
|
@ -243,8 +236,6 @@ $lightbox-border-color: #ffffff;
|
|||
// Tabbed views
|
||||
$tab-label-fg-color: #45474a;
|
||||
$tab-label-active-fg-color: #ffffff;
|
||||
$tab-label-bg-color: transparent;
|
||||
$tab-label-icon-bg-color: #454545;
|
||||
$tab-label-active-icon-bg-color: $tab-label-active-fg-color;
|
||||
|
||||
// Buttons
|
||||
|
|
@ -253,7 +244,6 @@ $button-secondary-bg-color: $accent-fg-color;
|
|||
$button-danger-fg-color: #ffffff;
|
||||
$button-danger-disabled-fg-color: #ffffff;
|
||||
$button-danger-disabled-bg-color: #f5b6bb; // TODO: Verify color
|
||||
$button-link-bg-color: transparent;
|
||||
|
||||
$visual-bell-bg-color: #faa;
|
||||
|
||||
|
|
@ -266,8 +256,6 @@ $slider-background-color: #c1c9d6;
|
|||
|
||||
$progressbar-bg-color: rgba(141, 151, 165, 0.2);
|
||||
|
||||
$room-warning-bg-color: $yellow-background;
|
||||
|
||||
$memberstatus-placeholder-color: $muted-fg-color;
|
||||
|
||||
$authpage-bg-color: #2e3649;
|
||||
|
|
@ -285,11 +273,9 @@ $message-action-bar-fg-color: $primary-fg-color;
|
|||
$message-action-bar-border-color: #e9edf1;
|
||||
$message-action-bar-hover-border-color: $focus-bg-color;
|
||||
|
||||
$reaction-row-button-bg-color: $header-panel-bg-color;
|
||||
$reaction-row-button-border-color: #e9edf1;
|
||||
$reaction-row-button-hover-border-color: $focus-bg-color;
|
||||
$reaction-row-button-selected-bg-color: #e9fff9;
|
||||
$reaction-row-button-selected-border-color: $accent-color;
|
||||
|
||||
$kbd-border-color: $reaction-row-button-border-color;
|
||||
|
||||
|
|
@ -315,7 +301,6 @@ $codeblock-background-color: $header-panel-bg-color;
|
|||
$eventbubble-self-bg: #F0FBF8;
|
||||
$eventbubble-others-bg: $system;
|
||||
$eventbubble-bg-hover: #FAFBFD;
|
||||
$eventbubble-avatar-outline: #fff;
|
||||
$eventbubble-reply-color: #C1C6CD;
|
||||
|
||||
// pinned events indicator
|
||||
|
|
|
|||
|
|
@ -39,7 +39,6 @@ $space-nav: rgba($panel-base, 0.1);
|
|||
// --accent-color
|
||||
$accent-color: var(--accent-color);
|
||||
$accent-bg-color: var(--accent-color-15pct);
|
||||
$reaction-row-button-selected-border-color: var(--accent-color);
|
||||
$username-variant3-color: var(--accent-color);
|
||||
$accent-color-50pct: var(--accent-color-50pct); //still needs alpha at .5
|
||||
//
|
||||
|
|
@ -65,7 +64,6 @@ $roomlist-button-bg-color: var(--sidebar-color-15pct);
|
|||
//
|
||||
// --roomlist-background-color
|
||||
$header-panel-bg-color: var(--roomlist-background-color);
|
||||
$reaction-row-button-bg-color: var(--roomlist-background-color);
|
||||
$panel-gradient: var(--roomlist-background-color-0pct), var(--roomlist-background-color);
|
||||
// these were #f2f5f8 instead of #f3f8fd, but close enough
|
||||
$dark-panel-bg-color: var(--roomlist-background-color);
|
||||
|
|
@ -81,7 +79,6 @@ $primary-content: var(--timeline-text-color);
|
|||
$settings-profile-overlay-placeholder-fg-color: var(--timeline-text-color);
|
||||
$roomtopic-color: var(--timeline-text-color-50pct);
|
||||
$tab-label-fg-color: var(--timeline-text-color);
|
||||
$tab-label-icon-bg-color: var(--timeline-text-color); //was #454545
|
||||
// was #212121
|
||||
$topleftmenu-color: var(--timeline-text-color);
|
||||
// was #45474a
|
||||
|
|
@ -98,7 +95,6 @@ $roomtile-default-badge-bg-color: var(--roomlist-text-secondary-color);
|
|||
//
|
||||
// --roomlist-separator-color
|
||||
$input-darker-bg-color: var(--roomlist-separator-color);
|
||||
$panel-divider-color: var(--roomlist-separator-color);// originally #dee1f3, but close enough
|
||||
$primary-hairline-color: var(--roomlist-separator-color);// originally #e5e5e5, but close enough
|
||||
//
|
||||
// --timeline-text-secondary-color
|
||||
|
|
@ -146,5 +142,4 @@ $settings-grey-fg-color: $primary-content;
|
|||
$eventbubble-self-bg: var(--eventbubble-self-bg, $eventbubble-self-bg);
|
||||
$eventbubble-others-bg: var(--eventbubble-others-bg, $eventbubble-others-bg);
|
||||
$eventbubble-bg-hover: var(--eventbubble-bg-hover, $eventbubble-bg-hover);
|
||||
$eventbubble-avatar-outline: var(--eventbubble-avatar-outline, $eventbubble-avatar-outline);
|
||||
$eventbubble-reply-color: var(--eventbubble-reply-color, $eventbubble-reply-color);
|
||||
|
|
|
|||
|
|
@ -32,7 +32,6 @@ $presence-offline: $quinary-content;
|
|||
$pinned-color: $tertiary-content;
|
||||
$button-secondary-bg-color: $accent-fg-color;
|
||||
$message-action-bar-fg-color: $primary-content;
|
||||
$reaction-row-button-selected-border-color: $accent-color;
|
||||
$voice-record-stop-border-color: $quinary-content;
|
||||
$voice-record-icon-color: $tertiary-content;
|
||||
$appearance-tab-border-color: $input-darker-bg-color;
|
||||
|
|
|
|||
|
|
@ -106,7 +106,6 @@ $input-underline-color: rgba(151, 151, 151, 0.5);
|
|||
$input-fg-color: rgba(74, 74, 74, 0.9);
|
||||
// scrollbars
|
||||
$scrollbar-thumb-color: rgba(0, 0, 0, 0.2);
|
||||
$scrollbar-track-color: transparent;
|
||||
// context menus
|
||||
$menu-border-color: #e7e7e7;
|
||||
$menu-bg-color: #fff;
|
||||
|
|
@ -187,8 +186,6 @@ $username-variant6-color: #2dc2c5;
|
|||
$username-variant7-color: #5c56f5;
|
||||
$username-variant8-color: #74d12c;
|
||||
|
||||
$panel-divider-color: transparent;
|
||||
|
||||
// pinned events indicator
|
||||
$pinned-color: $tertiary-content;
|
||||
|
||||
|
|
@ -199,7 +196,7 @@ $widget-body-bg-color: #FFF;
|
|||
|
||||
// ********************
|
||||
|
||||
// both $event-highlight-bg-color and $room-warning-bg-color share this value,
|
||||
// $event-highlight-bg-color shares this value,
|
||||
// so to not make their order dependent on who depends on who, have a shared value
|
||||
// defined before both
|
||||
$yellow-background: #fff8e3;
|
||||
|
|
@ -209,10 +206,6 @@ $event-notsent-color: #f44;
|
|||
|
||||
$event-highlight-bg-color: $yellow-background;
|
||||
|
||||
// event redaction
|
||||
$event-redacted-fg-color: #e2e2e2;
|
||||
$event-redacted-border-color: #cccccc;
|
||||
|
||||
// event timestamp
|
||||
$event-timestamp-color: #acacac;
|
||||
|
||||
|
|
@ -234,8 +227,6 @@ $lightbox-border-color: #ffffff;
|
|||
// Tabbed views
|
||||
$tab-label-fg-color: #45474a;
|
||||
$tab-label-active-fg-color: $background;
|
||||
$tab-label-bg-color: transparent;
|
||||
$tab-label-icon-bg-color: #454545;
|
||||
$tab-label-active-icon-bg-color: $tab-label-active-fg-color;
|
||||
|
||||
// Buttons
|
||||
|
|
@ -244,7 +235,6 @@ $button-secondary-bg-color: $accent-fg-color;
|
|||
$button-danger-fg-color: $background;
|
||||
$button-danger-disabled-fg-color: $background;
|
||||
$button-danger-disabled-bg-color: #f5b6bb; // TODO: Verify color
|
||||
$button-link-bg-color: transparent;
|
||||
|
||||
$visual-bell-bg-color: #faa;
|
||||
|
||||
|
|
@ -257,8 +247,6 @@ $slider-background-color: #c1c9d6;
|
|||
|
||||
$progressbar-bg-color: rgba(141, 151, 165, 0.2);
|
||||
|
||||
$room-warning-bg-color: $yellow-background;
|
||||
|
||||
$memberstatus-placeholder-color: $muted-fg-color;
|
||||
|
||||
$authpage-bg-color: #2e3649;
|
||||
|
|
@ -276,11 +264,9 @@ $message-action-bar-fg-color: $primary-content;
|
|||
$message-action-bar-border-color: #e9edf1;
|
||||
$message-action-bar-hover-border-color: $focus-bg-color;
|
||||
|
||||
$reaction-row-button-bg-color: $header-panel-bg-color;
|
||||
$reaction-row-button-border-color: #e9edf1;
|
||||
$reaction-row-button-hover-border-color: $focus-bg-color;
|
||||
$reaction-row-button-selected-bg-color: #e9fff9;
|
||||
$reaction-row-button-selected-border-color: $accent-color;
|
||||
|
||||
$kbd-border-color: $reaction-row-button-border-color;
|
||||
|
||||
|
|
@ -313,7 +299,6 @@ $codeblock-background-color: $header-panel-bg-color;
|
|||
$eventbubble-self-bg: #F0FBF8;
|
||||
$eventbubble-others-bg: $system;
|
||||
$eventbubble-bg-hover: #FAFBFD;
|
||||
$eventbubble-avatar-outline: $background;
|
||||
$eventbubble-reply-color: $quaternary-content;
|
||||
|
||||
// ***** Mixins! *****
|
||||
|
|
|
|||
Loading…
Reference in a new issue