diff --git a/res/css/structures/_ToastContainer.scss b/res/css/structures/_ToastContainer.scss index 6024df5dc0..55181a8b53 100644 --- a/res/css/structures/_ToastContainer.scss +++ b/res/css/structures/_ToastContainer.scss @@ -122,7 +122,7 @@ limitations under the License. float: right; font-size: $font-12px; line-height: $font-22px; - color: $muted-fg-color; + color: $secondary-content; } } diff --git a/res/css/views/audio_messages/_PlaybackContainer.scss b/res/css/views/audio_messages/_PlaybackContainer.scss index 773fc50fb9..3886e38583 100644 --- a/res/css/views/audio_messages/_PlaybackContainer.scss +++ b/res/css/views/audio_messages/_PlaybackContainer.scss @@ -39,7 +39,7 @@ limitations under the License. &.mx_Waveform_bar_100pct { // Small animation to remove the mechanical feel of progress transition: background-color 250ms ease; - background-color: $message-body-panel-fg-color; + background-color: $secondary-content; } } } diff --git a/res/css/views/dialogs/_InviteDialog.scss b/res/css/views/dialogs/_InviteDialog.scss index 3a2918f9ec..a753115614 100644 --- a/res/css/views/dialogs/_InviteDialog.scss +++ b/res/css/views/dialogs/_InviteDialog.scss @@ -28,7 +28,7 @@ limitations under the License. .mx_InviteDialog_editor { flex: 1; width: 100%; // Needed to make the Field inside grow - background-color: $user-tile-hover-bg-color; + background-color: $header-panel-bg-color; border-radius: 4px; min-height: 25px; padding-left: 8px; @@ -167,7 +167,7 @@ limitations under the License. padding: 5px 10px; &:hover { - background-color: $user-tile-hover-bg-color; + background-color: $header-panel-bg-color; border-radius: 4px; } @@ -395,7 +395,7 @@ limitations under the License. left: -24px; padding-left: 24px; padding-right: 24px; - border-top: 1px solid $message-body-panel-bg-color; + border-top: 1px solid $quinary-content; display: flex; flex-direction: row; diff --git a/res/css/views/dialogs/_SpaceSettingsDialog.scss b/res/css/views/dialogs/_SpaceSettingsDialog.scss index a1fa9d52a8..e26e4f8b49 100644 --- a/res/css/views/dialogs/_SpaceSettingsDialog.scss +++ b/res/css/views/dialogs/_SpaceSettingsDialog.scss @@ -38,7 +38,7 @@ limitations under the License. } & + .mx_SettingsTab_subheading { - border-top: 1px solid $message-body-panel-bg-color; + border-top: 1px solid $quinary-content; margin-top: 0; padding-top: 24px; } diff --git a/res/css/views/messages/_MFileBody.scss b/res/css/views/messages/_MFileBody.scss index d941a8132f..e23696e6a9 100644 --- a/res/css/views/messages/_MFileBody.scss +++ b/res/css/views/messages/_MFileBody.scss @@ -63,7 +63,7 @@ limitations under the License. cursor: pointer; .mx_MFileBody_info_icon { - background-color: $message-body-panel-icon-bg-color; + background-color: $system; border-radius: 20px; display: inline-block; width: 32px; @@ -78,7 +78,7 @@ limitations under the License. mask-position: center; mask-size: cover; mask-image: url('$(res)/img/element-icons/room/composer/attach.svg'); - background-color: $message-body-panel-icon-fg-color; + background-color: $secondary-content; width: 15px; height: 15px; diff --git a/res/css/views/messages/_MediaBody.scss b/res/css/views/messages/_MediaBody.scss index 7f4bfd3fdc..874de05c71 100644 --- a/res/css/views/messages/_MediaBody.scss +++ b/res/css/views/messages/_MediaBody.scss @@ -18,11 +18,11 @@ limitations under the License. // have unique styles). .mx_MediaBody { - background-color: $message-body-panel-bg-color; + background-color: $quinary-content; border-radius: 12px; max-width: 243px; // use max-width instead of width so it fits within right panels - color: $message-body-panel-fg-color; + color: $secondary-content; font-size: $font-14px; line-height: $font-24px; diff --git a/res/css/views/right_panel/_VerificationPanel.scss b/res/css/views/right_panel/_VerificationPanel.scss index 12148b09de..95856a5d69 100644 --- a/res/css/views/right_panel/_VerificationPanel.scss +++ b/res/css/views/right_panel/_VerificationPanel.scss @@ -87,7 +87,7 @@ limitations under the License. } .mx_VerificationPanel_QRPhase_startOption { - background-color: $user-tile-hover-bg-color; + background-color: $header-panel-bg-color; border-radius: 10px; flex: 1; display: flex; diff --git a/res/themes/dark/css/_dark.scss b/res/themes/dark/css/_dark.scss index 0bc61d438d..f012dff0a1 100644 --- a/res/themes/dark/css/_dark.scss +++ b/res/themes/dark/css/_dark.scss @@ -206,23 +206,13 @@ $kbd-border-color: #000000; $tooltip-timeline-bg-color: $groupFilterPanel-bg-color; $tooltip-timeline-fg-color: $primary-content; -$interactive-tooltip-bg-color: $background; -$interactive-tooltip-fg-color: $primary-content; - $breadcrumb-placeholder-bg-color: #272c35; -$user-tile-hover-bg-color: $header-panel-bg-color; - -$message-body-panel-fg-color: $secondary-content; -$message-body-panel-bg-color: $quinary-content; -$message-body-panel-icon-bg-color: $system; -$message-body-panel-icon-fg-color: $secondary-content; - $voice-record-stop-border-color: $quaternary-content; $voice-record-waveform-incomplete-fg-color: $quaternary-content; $voice-record-icon-color: $quaternary-content; -$voice-playback-button-bg-color: $message-body-panel-icon-bg-color; -$voice-playback-button-fg-color: $message-body-panel-icon-fg-color; +$voice-playback-button-bg-color: $system; +$voice-playback-button-fg-color: $secondary-content; // Appearance tab colors $appearance-tab-border-color: $room-highlight-color; diff --git a/res/themes/legacy-dark/css/_legacy-dark.scss b/res/themes/legacy-dark/css/_legacy-dark.scss index d5bc5e6dd7..bed1e9c661 100644 --- a/res/themes/legacy-dark/css/_legacy-dark.scss +++ b/res/themes/legacy-dark/css/_legacy-dark.scss @@ -202,18 +202,8 @@ $kbd-border-color: #000000; $tooltip-timeline-bg-color: $groupFilterPanel-bg-color; $tooltip-timeline-fg-color: #ffffff; -$interactive-tooltip-bg-color: $base-color; -$interactive-tooltip-fg-color: #ffffff; - $breadcrumb-placeholder-bg-color: #272c35; -$user-tile-hover-bg-color: $header-panel-bg-color; - -$message-body-panel-fg-color: $secondary-fg-color; -$message-body-panel-bg-color: #394049; -$message-body-panel-icon-fg-color: $secondary-fg-color; -$message-body-panel-icon-bg-color: #21262C; - // See non-legacy dark for variable information $voice-record-stop-border-color: #6F7882; $voice-record-waveform-incomplete-fg-color: #6F7882; diff --git a/res/themes/legacy-light/css/_legacy-light.scss b/res/themes/legacy-light/css/_legacy-light.scss index 47247e5e23..2ce5b6062c 100644 --- a/res/themes/legacy-light/css/_legacy-light.scss +++ b/res/themes/legacy-light/css/_legacy-light.scss @@ -326,26 +326,16 @@ $kbd-border-color: $reaction-row-button-border-color; $tooltip-timeline-bg-color: $groupFilterPanel-bg-color; $tooltip-timeline-fg-color: #ffffff; -$interactive-tooltip-bg-color: #27303a; -$interactive-tooltip-fg-color: #ffffff; - $breadcrumb-placeholder-bg-color: #e8eef5; -$user-tile-hover-bg-color: $header-panel-bg-color; - -$message-body-panel-fg-color: $secondary-fg-color; -$message-body-panel-bg-color: #E3E8F0; -$message-body-panel-icon-fg-color: $secondary-fg-color; -$message-body-panel-icon-bg-color: $system; - // See non-legacy _light for variable information $voice-record-stop-symbol-color: #ff4b55; $voice-record-live-circle-color: #ff4b55; $voice-record-stop-border-color: #E3E8F0; $voice-record-waveform-incomplete-fg-color: #C1C6CD; $voice-record-icon-color: $tertiary-fg-color; -$voice-playback-button-bg-color: $message-body-panel-icon-bg-color; -$voice-playback-button-fg-color: $message-body-panel-icon-fg-color; +$voice-playback-button-bg-color: $system; +$voice-playback-button-fg-color: $secondary-content; // FontSlider colors $appearance-tab-border-color: $input-darker-bg-color; diff --git a/res/themes/light-custom/css/_custom.scss b/res/themes/light-custom/css/_custom.scss index fe8c869fcb..af302bf252 100644 --- a/res/themes/light-custom/css/_custom.scss +++ b/res/themes/light-custom/css/_custom.scss @@ -67,7 +67,6 @@ $roomheader-bg-color: var(--timeline-background-color); $roomtile-selected-bg-color: var(--roomlist-highlights-color); // // --sidebar-color -$interactive-tooltip-bg-color: var(--sidebar-color); $groupFilterPanel-bg-color: var(--sidebar-color); $tooltip-timeline-bg-color: var(--sidebar-color); $dialog-backdrop-color: var(--sidebar-color-50pct); diff --git a/res/themes/light/css/_light.scss b/res/themes/light/css/_light.scss index 96e5fd7155..26cd1766c1 100644 --- a/res/themes/light/css/_light.scss +++ b/res/themes/light/css/_light.scss @@ -326,18 +326,8 @@ $inverted-bg-color: #27303a; $tooltip-timeline-bg-color: $inverted-bg-color; $tooltip-timeline-fg-color: $background; -$interactive-tooltip-bg-color: #27303a; -$interactive-tooltip-fg-color: $background; - $breadcrumb-placeholder-bg-color: #e8eef5; -$user-tile-hover-bg-color: $header-panel-bg-color; - -$message-body-panel-fg-color: $secondary-content; -$message-body-panel-bg-color: $quinary-content; -$message-body-panel-icon-bg-color: $system; -$message-body-panel-icon-fg-color: $secondary-content; - // These two don't change between themes. They are the $warning-color, but we don't // want custom themes to affect them by accident. $voice-record-stop-symbol-color: #ff4b55; @@ -346,8 +336,8 @@ $voice-record-live-circle-color: #ff4b55; $voice-record-stop-border-color: $quinary-content; $voice-record-waveform-incomplete-fg-color: $quaternary-content; $voice-record-icon-color: $tertiary-content; -$voice-playback-button-bg-color: $message-body-panel-icon-bg-color; -$voice-playback-button-fg-color: $message-body-panel-icon-fg-color; +$voice-playback-button-bg-color: $system; +$voice-playback-button-fg-color: $secondary-content; // FontSlider colors $appearance-tab-border-color: $input-darker-bg-color;