sorb/ThreadNet-Web
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases 4 Wiki Activity

Merge branch 'develop' into t3chguy/spaces4.9

Browse Source
This commit is contained in:
Michael Telatynski
2021-03-16 11:14:38 +00:00
committed by GitHub
parent 11cd791c76 4ae6c2f808
commit 688407abe6
403 changed files with 4997 additions and 1886 deletions
Download Patch File Download Diff File Expand all files Collapse all files
res/css/_common.scss
+7 -48
View File
@@ -489,54 +489,6 @@ input[type=text]:focus, input[type=password]:focus, textarea:focus {
margin-top: 69px;
}
.mx_Beta {
color: red;
margin-right: 10px;
position: relative;
top: -3px;
background-color: white;
padding: 0 4px;
border-radius: 3px;
border: 1px solid darkred;
cursor: help;
transition-duration: 200ms;
font-size: smaller;
filter: opacity(0.5);
}
.mx_Beta:hover {
color: white;
border: 1px solid gray;
background-color: darkred;
}
.mx_TintableSvgButton {
position: relative;
display: flex;
flex-direction: row;
justify-content: center;
align-content: center;
}
.mx_TintableSvgButton object {
margin: 0;
padding: 0;
width: 100%;
height: 100%;
max-width: 100%;
max-height: 100%;
}
.mx_TintableSvgButton span {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
opacity: 0;
cursor: pointer;
}
// username colors
// used by SenderProfile & RoomPreviewBar
.mx_Username_color1 {
@@ -606,6 +558,13 @@ input[type=text]:focus, input[type=password]:focus, textarea:focus {
}
}
@define-mixin ProgressBarBgColour $colour {
background-color: $colour;
&::-webkit-progress-bar {
background-color: $colour;
}
}
@define-mixin ProgressBarBorderRadius $radius {
border-radius: $radius;
&::-moz-progress-bar {
res/css/structures/_SpaceRoomDirectory.scss
+3 -6
View File
@@ -203,8 +203,9 @@ limitations under the License.
.mx_SpaceRoomDirectory_actions {
width: 180px;
text-align: right;
height: min-content;
margin: auto 0 auto 28px;
margin-left: 28px;
display: inline-flex;
align-items: center;
.mx_AccessibleButton {
vertical-align: middle;
@@ -223,9 +224,5 @@ limitations under the License.
line-height: $font-15px;
color: $secondary-fg-color;
}
.mx_Checkbox {
display: inline-block;
}
}
}
res/css/structures/_SpaceRoomView.scss
+111 -10
View File
@@ -20,6 +20,8 @@ $SpaceRoomViewInnerWidth: 428px;
.mx_MainSplit > div:first-child {
padding: 80px 60px;
flex-grow: 1;
max-height: 100%;
overflow-y: auto;
h1 {
margin: 0;
@@ -69,9 +71,116 @@ $SpaceRoomViewInnerWidth: 428px;
}
}
.mx_SpaceRoomView_landing {
overflow-y: auto;
.mx_SpaceRoomView_preview {
padding: 32px 24px !important; // override default padding from above
margin: auto;
max-width: 480px;
box-sizing: border-box;
box-shadow: 2px 15px 30px $dialog-shadow-color;
border: 1px solid $input-border-color;
border-radius: 8px;
.mx_SpaceRoomView_preview_inviter {
display: flex;
align-items: center;
margin-bottom: 20px;
font-size: $font-15px;
> div {
margin-left: 8px;
.mx_SpaceRoomView_preview_inviter_name {
line-height: $font-18px;
}
.mx_SpaceRoomView_preview_inviter_mxid {
line-height: $font-24px;
color: $secondary-fg-color;
}
}
}
> .mx_BaseAvatar_image,
> .mx_BaseAvatar > .mx_BaseAvatar_image {
border-radius: 12px;
}
h1.mx_SpaceRoomView_preview_name {
margin: 20px 0 !important; // override default margin from above
}
.mx_SpaceRoomView_preview_info {
color: $tertiary-fg-color;
font-size: $font-15px;
line-height: $font-24px;
margin: 20px 0;
.mx_SpaceRoomView_preview_info_public,
.mx_SpaceRoomView_preview_info_private {
padding-left: 20px;
position: relative;
&::before {
position: absolute;
content: "";
width: 20px;
height: 20px;
top: 0;
left: -2px;
mask-position: center;
mask-repeat: no-repeat;
background-color: $tertiary-fg-color;
}
}
.mx_SpaceRoomView_preview_info_public::before {
mask-size: 12px;
mask-image: url("$(res)/img/globe.svg");
}
.mx_SpaceRoomView_preview_info_private::before {
mask-size: 14px;
mask-image: url("$(res)/img/element-icons/lock.svg");
}
.mx_AccessibleButton_kind_link {
color: inherit;
position: relative;
padding-left: 16px;
&::before {
content: "·"; // visual separator
position: absolute;
left: 6px;
}
}
}
.mx_SpaceRoomView_preview_topic {
font-size: $font-14px;
line-height: $font-22px;
color: $secondary-fg-color;
margin: 20px 0;
max-height: 160px;
overflow-y: auto;
}
.mx_SpaceRoomView_preview_joinButtons {
margin-top: 20px;
.mx_AccessibleButton {
width: 200px;
box-sizing: border-box;
padding: 14px 0;
& + .mx_AccessibleButton {
margin-left: 20px;
}
}
}
}
.mx_SpaceRoomView_landing {
> .mx_BaseAvatar_image,
> .mx_BaseAvatar > .mx_BaseAvatar_image {
border-radius: 12px;
@@ -128,14 +237,6 @@ $SpaceRoomViewInnerWidth: 428px;
font-size: $font-15px;
}
.mx_SpaceRoomView_landing_joinButtons {
margin-top: 24px;
.mx_FormButton {
padding: 8px 22px;
}
}
.mx_SpaceRoomView_landing_adminButtons {
margin-top: 32px;
res/css/structures/_UploadBar.scss
+35 -37
View File
@@ -1,5 +1,5 @@
/*
Copyright 2015, 2016 OpenMarket Ltd
Copyright 2015, 2016, 2021 The Matrix.org Foundation C.I.C.
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
@@ -15,47 +15,45 @@ limitations under the License.
*/
.mx_UploadBar {
padding-left: 65px; // line up with the shield area in the composer
position: relative;
.mx_ProgressBar {
width: calc(100% - 40px); // cheating at a right margin
}
}
.mx_UploadBar_uploadProgressOuter {
height: 5px;
margin-left: 63px;
margin-top: -1px;
padding-bottom: 5px;
}
.mx_UploadBar_uploadProgressInner {
background-color: $accent-color;
height: 5px;
}
.mx_UploadBar_uploadFilename {
.mx_UploadBar_filename {
margin-top: 5px;
margin-left: 65px;
opacity: 0.5;
color: $primary-fg-color;
}
.mx_UploadBar_uploadIcon {
float: left;
margin-top: 5px;
margin-left: 14px;
}
.mx_UploadBar_uploadCancel {
float: right;
margin-top: 5px;
margin-right: 10px;
color: $muted-fg-color;
position: relative;
opacity: 0.6;
cursor: pointer;
z-index: 1;
padding-left: 22px; // 18px for icon, 4px for padding
font-size: $font-15px;
vertical-align: middle;
&::before {
content: "";
height: 18px;
width: 18px;
position: absolute;
top: 0;
left: 0;
mask-repeat: no-repeat;
mask-position: center;
background-color: $muted-fg-color;
mask-image: url('$(res)/img/element-icons/upload.svg');
}
}
.mx_UploadBar_uploadBytes {
float: right;
margin-top: 5px;
margin-right: 30px;
color: $accent-color;
.mx_UploadBar_cancel {
position: absolute;
top: 0;
right: 0;
height: 16px;
width: 16px;
margin-right: 16px; // align over rightmost button in composer
mask-repeat: no-repeat;
mask-position: center;
background-color: $muted-fg-color;
mask-image: url('$(res)/img/icons-close.svg');
}
res/css/structures/_ViewSource.scss
+14 -1
View File
@@ -22,9 +22,18 @@ limitations under the License.
float: right;
}
.mx_ViewSource_label_bottom {
.mx_ViewSource_separator {
clear: both;
border-bottom: 1px solid #e5e5e5;
padding-top: 0.7em;
padding-bottom: 0.7em;
}
.mx_ViewSource_heading {
font-size: $font-17px;
font-weight: 400;
color: $primary-fg-color;
margin-top: 0.7em;
}
.mx_ViewSource pre {
@@ -34,3 +43,7 @@ limitations under the License.
word-wrap: break-word;
white-space: pre-wrap;
}
.mx_ViewSource_details {
margin-top: 0.8em;
}
res/css/structures/auth/_CompleteSecurity.scss
-44
View File
@@ -26,50 +26,6 @@ limitations under the License.
position: relative;
}
.mx_CompleteSecurity_clients {
width: max-content;
margin: 36px auto 0;
.mx_CompleteSecurity_clients_desktop, .mx_CompleteSecurity_clients_mobile {
position: relative;
width: 160px;
text-align: center;
padding-top: 64px;
display: inline-block;
&::before {
content: '';
position: absolute;
height: 48px;
width: 48px;
left: 56px;
top: 0;
background-color: $muted-fg-color;
mask-repeat: no-repeat;
mask-size: contain;
}
}
.mx_CompleteSecurity_clients_desktop {
margin-right: 56px;
}
.mx_CompleteSecurity_clients_desktop::before {
mask-image: url('$(res)/img/feather-customised/monitor.svg');
}
.mx_CompleteSecurity_clients_mobile::before {
mask-image: url('$(res)/img/feather-customised/smartphone.svg');
}
p {
margin-top: 16px;
font-size: $font-12px;
color: $muted-fg-color;
text-align: center;
}
}
.mx_CompleteSecurity_heroIcon {
width: 128px;
height: 128px;
res/css/views/avatars/_DecoratedRoomAvatar.scss
+1 -2
View File
@@ -14,8 +14,7 @@ See the License for the specific language governing permissions and
limitations under the License.
*/
// XXX: We shouldn't be using TemporaryTile anywhere - delete it.
.mx_DecoratedRoomAvatar, .mx_TemporaryTile {
.mx_DecoratedRoomAvatar, .mx_ExtraTile {
position: relative;
&.mx_DecoratedRoomAvatar_cutout .mx_BaseAvatar {
res/css/views/elements/_AccessibleButton.scss
+3 -1
View File
@@ -26,7 +26,9 @@ limitations under the License.
padding: 7px 18px;
text-align: center;
border-radius: 8px;
display: inline-block;
display: inline-flex;
align-items: center;
justify-content: center;
font-size: $font-14px;
}
res/css/views/elements/_FormButton.scss
+6
View File
@@ -33,4 +33,10 @@ limitations under the License.
color: $notice-primary-color;
background-color: $notice-primary-bg-color;
}
&.mx_AccessibleButton_kind_secondary {
color: $secondary-fg-color;
border: 1px solid $secondary-fg-color;
background-color: unset;
}
}
res/css/views/elements/_ProgressBar.scss
+6 -6
View File
@@ -1,5 +1,5 @@
/*
Copyright 2020 The Matrix.org Foundation C.I.C.
Copyright 2020, 2021 The Matrix.org Foundation C.I.C.
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
@@ -15,15 +15,15 @@ limitations under the License.
*/
progress.mx_ProgressBar {
height: 4px;
height: 6px;
width: 60px;
border-radius: 10px;
overflow: hidden;
appearance: none;
border: 0;
border: none;
@mixin ProgressBarBorderRadius "10px";
@mixin ProgressBarColour $accent-color;
@mixin ProgressBarBorderRadius "6px";
@mixin ProgressBarColour $progressbar-fg-color;
@mixin ProgressBarBgColour $progressbar-bg-color;
::-webkit-progress-value {
transition: width 1s;
}
res/css/views/messages/_MFileBody.scss
+57 -1
View File
@@ -1,5 +1,5 @@
/*
Copyright 2015, 2016 OpenMarket Ltd
Copyright 2015, 2016, 2021 The Matrix.org Foundation C.I.C.
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
@@ -16,6 +16,19 @@ limitations under the License.
.mx_MFileBody_download {
color: $accent-color;
.mx_MFileBody_download_icon {
// 12px instead of 14px to better match surrounding font size
width: 12px;
height: 12px;
mask-size: 12px;
mask-position: center;
mask-repeat: no-repeat;
mask-image: url("$(res)/img/download.svg");
background-color: $accent-color;
display: inline-block;
}
}
.mx_MFileBody_download a {
@@ -45,3 +58,46 @@ limitations under the License.
* big the content of the iframe is. */
height: 1.5em;
}
.mx_MFileBody_info {
background-color: $message-body-panel-bg-color;
border-radius: 4px;
width: 270px;
padding: 8px;
color: $message-body-panel-fg-color;
.mx_MFileBody_info_icon {
background-color: $message-body-panel-icon-bg-color;
border-radius: 20px;
display: inline-block;
width: 32px;
height: 32px;
position: relative;
vertical-align: middle;
margin-right: 12px;
&::before {
content: '';
mask-repeat: no-repeat;
mask-position: center;
mask-size: cover;
mask-image: url('$(res)/img/element-icons/room/composer/attach.svg');
background-color: $message-body-panel-fg-color;
width: 13px;
height: 15px;
position: absolute;
top: 8px;
left: 9px;
}
}
.mx_MFileBody_info_filename {
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
display: inline-block;
width: calc(100% - 32px - 12px); // 32px icon, 12px margin on the icon
vertical-align: middle;
}
}
res/css/views/right_panel/_EncryptionInfo.scss
+6 -8
View File
@@ -14,13 +14,11 @@ See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_UserInfo {
.mx_EncryptionInfo_spinner {
.mx_Spinner {
margin-top: 25px;
margin-bottom: 15px;
}
text-align: center;
.mx_EncryptionInfo_spinner {
.mx_Spinner {
margin-top: 25px;
margin-bottom: 15px;
}
text-align: center;
}
res/css/views/rooms/_AppsDrawer.scss
-5
View File
@@ -370,11 +370,6 @@ $MinWidth: 240px;
display: none;
}
/* Avoid apptile iframes capturing mouse event focus when resizing */
.mx_AppsDrawer_resizing iframe {
pointer-events: none;
}
.mx_AppsDrawer_resizing .mx_AppTile_persistedWrapper {
z-index: 1;
}
res/css/views/rooms/_EventTile.scss
+26 -13
View File
@@ -213,23 +213,36 @@ $left-gutter: 64px;
color: $accent-fg-color;
}
.mx_EventTile_encrypting {
color: $event-encrypting-color !important;
}
.mx_EventTile_sending {
color: $event-sending-color;
}
.mx_EventTile_sending .mx_UserPill,
.mx_EventTile_sending .mx_RoomPill {
opacity: 0.5;
}
.mx_EventTile_notSent {
color: $event-notsent-color;
}
.mx_EventTile_receiptSent,
.mx_EventTile_receiptSending {
// We don't use `position: relative` on the element because then it won't line
// up with the other read receipts
&::before {
background-color: $tertiary-fg-color;
mask-repeat: no-repeat;
mask-position: center;
mask-size: 14px;
width: 14px;
height: 14px;
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
}
}
.mx_EventTile_receiptSent::before {
mask-image: url('$(res)/img/element-icons/circle-sent.svg');
}
.mx_EventTile_receiptSending::before {
mask-image: url('$(res)/img/element-icons/circle-sending.svg');
}
.mx_EventTile_contextual {
opacity: 0.4;
}
res/css/views/rooms/_GroupLayout.scss
+1 -1
View File
@@ -21,7 +21,7 @@ $left-gutter: 64px;
.mx_EventTile {
> .mx_SenderProfile {
line-height: $font-20px;
padding-left: $left-gutter;
margin-left: $left-gutter;
}
> .mx_EventTile_line {
res/css/views/rooms/_IRCLayout.scss
+2 -4
View File
@@ -181,8 +181,7 @@ $irc-line-height: $font-18px;
> span {
display: flex;
> .mx_SenderProfile_name,
> .mx_SenderProfile_aux {
> .mx_SenderProfile_name {
overflow: hidden;
text-overflow: ellipsis;
min-width: var(--name-width);
@@ -212,8 +211,7 @@ $irc-line-height: $font-18px;
background: transparent;
> span {
> .mx_SenderProfile_name,
> .mx_SenderProfile_aux {
> .mx_SenderProfile_name {
min-width: inherit;
}
}
res/img/element-icons/circle-sending.svg
+3
View File
@@ -0,0 +1,3 @@
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="8" cy="8" r="7.5" stroke="#8D99A5"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 152 B

res/img/element-icons/circle-sent.svg
+4
View File
@@ -0,0 +1,4 @@
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M8 15C11.866 15 15 11.866 15 8C15 4.13401 11.866 1 8 1C4.13401 1 1 4.13401 1 8C1 11.866 4.13401 15 8 15ZM8 16C12.4183 16 16 12.4183 16 8C16 3.58172 12.4183 0 8 0C3.58172 0 0 3.58172 0 8C0 12.4183 3.58172 16 8 16Z" fill="#8D99A5"/>
<path d="M11.8697 4.95309C11.6784 4.7576 11.3597 4.74731 11.1578 4.93251L6.62066 9.04804L4.95244 7.91627C4.7293 7.77223 4.42116 7.77223 4.20865 7.95742C3.95363 8.1632 3.93238 8.5336 4.14489 8.78053L6.06813 10.9206C6.1 10.9515 6.13188 10.9926 6.17438 11.0132C6.53565 11.3013 7.07756 11.2498 7.37508 10.9L7.40695 10.8589L11.891 5.60128C12.0397 5.41608 12.0397 5.13828 11.8697 4.95309Z" fill="#8D99A5"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 784 B

res/img/element-icons/upload.svg
+4
View File
@@ -0,0 +1,4 @@
<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M8.99902 14L8.99902 4" stroke="black" stroke-width="1.5" stroke-linecap="round"/>
<path d="M12.5352 7.52441L8.99944 4.00012L5.46373 7.52441" stroke="black" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 336 B

res/img/feather-customised/monitor.svg
-5
View File
@@ -1,5 +0,0 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M2 5C2 3.89543 2.89543 3 4 3H20C21.1046 3 22 3.89543 22 5V15C22 16.1046 21.1046 17 20 17H4C2.89543 17 2 16.1046 2 15V5Z" stroke="#2E2F32" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M8 21H16" stroke="#2E2F32" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M12 17V21" stroke="#2E2F32" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
Side by Side

Before

Width:  |  Height:  |  Size: 510 B

res/img/feather-customised/smartphone.svg
-4
View File
@@ -1,4 +0,0 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M5 4C5 2.89543 5.89543 2 7 2H17C18.1046 2 19 2.89543 19 4V20C19 21.1046 18.1046 22 17 22H7C5.89543 22 5 21.1046 5 20V4Z" stroke="#2E2F32" stroke-linecap="round" stroke-linejoin="round"/>
<circle cx="12" cy="18" r="1" fill="#2E2F32"/>
</svg>
Side by Side

Before

Width:  |  Height:  |  Size: 386 B

res/themes/dark/css/_dark.scss
+7 -3
View File
@@ -138,9 +138,6 @@ $panel-divider-color: transparent;
$widget-menu-bar-bg-color: $header-panel-bg-color;
$widget-body-bg-color: rgba(141, 151, 165, 0.2);
// event tile lifecycle
$event-sending-color: $text-secondary-color;
// event redaction
$event-redacted-fg-color: #606060;
$event-redacted-border-color: #000000;
@@ -173,6 +170,9 @@ $button-link-bg-color: transparent;
// Toggle switch
$togglesw-off-color: $room-highlight-color;
$progressbar-fg-color: $accent-color;
$progressbar-bg-color: #21262c;
$visual-bell-bg-color: #800;
$room-warning-bg-color: $header-panel-bg-color;
@@ -203,6 +203,10 @@ $breadcrumb-placeholder-bg-color: #272c35;
$user-tile-hover-bg-color: $header-panel-bg-color;
$message-body-panel-bg-color: #21262c82;
$message-body-panel-icon-bg-color: #8e99a4;
$message-body-panel-fg-color: $primary-fg-color;
// Appearance tab colors
$appearance-tab-border-color: $room-highlight-color;
res/themes/legacy-dark/css/_legacy-dark.scss
+7 -3
View File
@@ -133,9 +133,6 @@ $panel-divider-color: $header-panel-border-color;
$widget-menu-bar-bg-color: $header-panel-bg-color;
$widget-body-bg-color: #1A1D23;
// event tile lifecycle
$event-sending-color: $text-secondary-color;
// event redaction
$event-redacted-fg-color: #606060;
$event-redacted-border-color: #000000;
@@ -168,6 +165,9 @@ $button-link-bg-color: transparent;
// Toggle switch
$togglesw-off-color: $room-highlight-color;
$progressbar-fg-color: $accent-color;
$progressbar-bg-color: #21262c;
$visual-bell-bg-color: #800;
$room-warning-bg-color: $header-panel-bg-color;
@@ -198,6 +198,10 @@ $breadcrumb-placeholder-bg-color: #272c35;
$user-tile-hover-bg-color: $header-panel-bg-color;
$message-body-panel-bg-color: #21262c82;
$message-body-panel-icon-bg-color: #8e99a4;
$message-body-panel-fg-color: $primary-fg-color;
// Appearance tab colors
$appearance-tab-border-color: $room-highlight-color;
res/themes/legacy-light/css/_legacy-light.scss
+6 -3
View File
@@ -223,8 +223,6 @@ $widget-body-bg-color: #fff;
$yellow-background: #fff8e3;
// event tile lifecycle
$event-encrypting-color: #abddbc;
$event-sending-color: #ddd;
$event-notsent-color: #f44;
$event-highlight-fg-color: $warning-color;
@@ -282,7 +280,8 @@ $togglesw-ball-color: #fff;
$slider-selection-color: $accent-color;
$slider-background-color: #c1c9d6;
$progressbar-color: #000;
$progressbar-fg-color: $accent-color;
$progressbar-bg-color: rgba(141, 151, 165, 0.2);
$room-warning-bg-color: $yellow-background;
@@ -322,6 +321,10 @@ $breadcrumb-placeholder-bg-color: #e8eef5;
$user-tile-hover-bg-color: $header-panel-bg-color;
$message-body-panel-bg-color: #e3e8f082;
$message-body-panel-icon-bg-color: #ffffff;
$message-body-panel-fg-color: $muted-fg-color;
// FontSlider colors
$appearance-tab-border-color: $input-darker-bg-color;
res/themes/light/css/_light.scss
+6 -3
View File
@@ -220,8 +220,6 @@ $widget-body-bg-color: #FFF;
$yellow-background: #fff8e3;
// event tile lifecycle
$event-encrypting-color: #abddbc;
$event-sending-color: #ddd;
$event-notsent-color: #f44;
$event-highlight-fg-color: $warning-color;
@@ -279,7 +277,8 @@ $togglesw-ball-color: #fff;
$slider-selection-color: $accent-color;
$slider-background-color: #c1c9d6;
$progressbar-color: #000;
$progressbar-fg-color: $accent-color;
$progressbar-bg-color: rgba(141, 151, 165, 0.2);
$room-warning-bg-color: $yellow-background;
@@ -320,6 +319,10 @@ $breadcrumb-placeholder-bg-color: #e8eef5;
$user-tile-hover-bg-color: $header-panel-bg-color;
$message-body-panel-bg-color: #e3e8f082;
$message-body-panel-icon-bg-color: #ffffff;
$message-body-panel-fg-color: $muted-fg-color;
// FontSlider colors
$appearance-tab-border-color: $input-darker-bg-color;