Merge branch 'develop' of github.com:matrix-org/matrix-react-sdk into t3chguy/fix/18088

 Conflicts:
	src/components/structures/LoggedInView.tsx
	src/stores/SpaceStore.tsx
This commit is contained in:
Michael Telatynski
2021-09-06 11:41:09 +01:00
318 changed files with 7386 additions and 4032 deletions
@@ -33,7 +33,7 @@ limitations under the License.
}
.mx_AudioPlayer_mediaName {
color: $primary-fg-color;
color: $primary-content;
font-size: $font-15px;
line-height: $font-15px;
text-overflow: ellipsis;
+5 -5
View File
@@ -27,7 +27,7 @@ limitations under the License.
width: 100%;
height: 1px;
background: $quaternary-fg-color;
background: $quaternary-content;
outline: none; // remove blue selection border
position: relative; // for before+after pseudo elements later on
@@ -42,7 +42,7 @@ limitations under the License.
width: 8px;
height: 8px;
border-radius: 8px;
background-color: $tertiary-fg-color;
background-color: $tertiary-content;
cursor: pointer;
}
@@ -50,7 +50,7 @@ limitations under the License.
width: 8px;
height: 8px;
border-radius: 8px;
background-color: $tertiary-fg-color;
background-color: $tertiary-content;
cursor: pointer;
// Firefox adds a border on the thumb
@@ -63,7 +63,7 @@ limitations under the License.
// in firefox, so it's just wasted CPU/GPU time.
&::before { // ::before to ensure it ends up under the thumb
content: '';
background-color: $tertiary-fg-color;
background-color: $tertiary-content;
// Absolute positioning to ensure it overlaps with the existing bar
position: absolute;
@@ -81,7 +81,7 @@ limitations under the License.
// This is firefox's built-in support for the above, with 100% less hacks.
&::-moz-range-progress {
background-color: $tertiary-fg-color;
background-color: $tertiary-content;
height: 1px;
}
+1 -1
View File
@@ -39,7 +39,7 @@ limitations under the License.
min-width: 80px;
background-color: $accent-color;
color: $primary-bg-color;
color: $background;
cursor: pointer;
@@ -47,7 +47,7 @@ limitations under the License.
mask-position: center;
mask-size: contain;
mask-repeat: no-repeat;
background: $secondary-fg-color;
background: $secondary-content;
mask-image: url('$(res)/img/globe.svg');
}
+5 -5
View File
@@ -29,7 +29,7 @@ limitations under the License.
font-weight: $font-semi-bold;
font-size: $font-18px;
line-height: $font-22px;
color: $primary-fg-color;
color: $primary-content;
margin: 4px 0 14px;
.mx_BetaCard_betaPill {
@@ -40,7 +40,7 @@ limitations under the License.
.mx_BetaCard_caption {
font-size: $font-15px;
line-height: $font-20px;
color: $secondary-fg-color;
color: $secondary-content;
margin-bottom: 20px;
}
@@ -54,7 +54,7 @@ limitations under the License.
.mx_BetaCard_disclaimer {
font-size: $font-12px;
line-height: $font-15px;
color: $secondary-fg-color;
color: $secondary-content;
margin-top: 20px;
}
}
@@ -72,13 +72,13 @@ limitations under the License.
margin: 16px 0 0;
font-size: $font-15px;
line-height: $font-24px;
color: $primary-fg-color;
color: $primary-content;
.mx_SettingsFlag_microcopy {
margin-top: 4px;
font-size: $font-12px;
line-height: $font-15px;
color: $secondary-fg-color;
color: $secondary-content;
}
}
}
@@ -36,7 +36,7 @@ limitations under the License.
//
// Therefore, we just hack in a line and border the thing ourselves
&::before {
border-top: 1px solid $primary-fg-color;
border-top: 1px solid $primary-content;
opacity: 0.1;
content: '';
@@ -63,7 +63,7 @@ limitations under the License.
padding-top: 12px;
padding-bottom: 12px;
text-decoration: none;
color: $primary-fg-color;
color: $primary-content;
font-size: $font-15px;
line-height: $font-24px;
@@ -119,7 +119,7 @@ limitations under the License.
mask-position: center;
mask-size: contain;
mask-repeat: no-repeat;
background: $primary-fg-color;
background: $primary-content;
}
}
@@ -30,7 +30,7 @@ limitations under the License.
mask-position: center;
mask-size: contain;
mask-repeat: no-repeat;
background: $primary-fg-color;
background: $primary-content;
}
}
@@ -27,7 +27,7 @@ input.mx_StatusMessageContextMenu_message {
border-radius: 4px;
border: 1px solid $input-border-color;
padding: 6.5px 11px;
background-color: $primary-bg-color;
background-color: $background;
font-weight: normal;
margin: 0 0 10px;
}
@@ -44,7 +44,7 @@ limitations under the License.
> h3 {
margin: 0;
color: $secondary-fg-color;
color: $secondary-content;
font-size: $font-12px;
font-weight: $font-semi-bold;
line-height: $font-15px;
@@ -66,7 +66,7 @@ limitations under the License.
flex-grow: 1;
font-size: $font-12px;
line-height: $font-15px;
color: $secondary-fg-color;
color: $secondary-content;
.mx_ProgressBar {
height: 8px;
@@ -79,7 +79,7 @@ limitations under the License.
margin-top: 8px;
font-size: $font-15px;
line-height: $font-24px;
color: $primary-fg-color;
color: $primary-content;
}
> * {
@@ -105,7 +105,7 @@ limitations under the License.
margin-top: 4px;
font-size: $font-12px;
line-height: $font-15px;
color: $primary-fg-color;
color: $primary-content;
}
}
@@ -126,7 +126,7 @@ limitations under the License.
&::before {
content: '';
position: absolute;
background-color: $primary-fg-color;
background-color: $primary-content;
mask-repeat: no-repeat;
mask-position: center;
mask-size: contain;
@@ -145,7 +145,7 @@ limitations under the License.
.mx_AddExistingToSpaceDialog {
width: 480px;
color: $primary-fg-color;
color: $primary-content;
display: flex;
flex-direction: column;
flex-wrap: nowrap;
@@ -188,7 +188,7 @@ limitations under the License.
padding-left: 0;
flex: unset;
height: unset;
color: $secondary-fg-color;
color: $secondary-content;
font-size: $font-15px;
line-height: $font-24px;
@@ -221,7 +221,7 @@ limitations under the License.
}
.mx_SubspaceSelector_onlySpace {
color: $secondary-fg-color;
color: $secondary-content;
font-size: $font-15px;
line-height: $font-24px;
}
@@ -65,7 +65,7 @@ limitations under the License.
.mx_CommunityPrototypeInviteDialog_personName {
font-weight: 600;
font-size: $font-14px;
color: $primary-fg-color;
color: $primary-content;
margin-left: 7px;
}
@@ -35,8 +35,8 @@ limitations under the License.
.mx_ConfirmUserActionDialog_reasonField {
font-size: $font-14px;
color: $primary-fg-color;
background-color: $primary-bg-color;
color: $primary-content;
background-color: $background;
border-radius: 3px;
border: solid 1px $input-border-color;
@@ -29,8 +29,8 @@ limitations under the License.
border-radius: 3px;
border: 1px solid $input-border-color;
padding: 9px;
color: $primary-fg-color;
background-color: $primary-bg-color;
color: $primary-content;
background-color: $background;
}
.mx_CreateGroupDialog_input_hasPrefixAndSuffix {
+2 -2
View File
@@ -55,8 +55,8 @@ limitations under the License.
border-radius: 3px;
border: 1px solid $input-border-color;
padding: 9px;
color: $primary-fg-color;
background-color: $primary-bg-color;
color: $primary-content;
background-color: $background;
width: 100%;
}
@@ -23,7 +23,7 @@ limitations under the License.
.mx_CreateSpaceFromCommunityDialog {
width: 480px;
color: $primary-fg-color;
color: $primary-content;
display: flex;
flex-direction: column;
flex-wrap: nowrap;
@@ -73,7 +73,7 @@ limitations under the License.
flex-grow: 1;
font-size: $font-12px;
line-height: $font-15px;
color: $secondary-fg-color;
color: $secondary-content;
.mx_ProgressBar {
height: 8px;
@@ -86,7 +86,7 @@ limitations under the License.
margin-top: 8px;
font-size: $font-15px;
line-height: $font-24px;
color: $primary-fg-color;
color: $primary-content;
}
> * {
@@ -112,7 +112,7 @@ limitations under the License.
margin-top: 4px;
font-size: $font-12px;
line-height: $font-15px;
color: $primary-fg-color;
color: $primary-content;
}
}
@@ -138,7 +138,7 @@ limitations under the License.
&::before {
content: '';
position: absolute;
background-color: $primary-fg-color;
background-color: $primary-content;
mask-repeat: no-repeat;
mask-position: center;
mask-size: contain;
@@ -23,7 +23,7 @@ limitations under the License.
.mx_CreateSubspaceDialog {
width: 480px;
color: $primary-fg-color;
color: $primary-content;
display: flex;
flex-direction: column;
flex-wrap: nowrap;
@@ -57,7 +57,7 @@ limitations under the License.
flex-grow: 1;
font-size: $font-12px;
line-height: $font-15px;
color: $secondary-fg-color;
color: $secondary-content;
> * {
vertical-align: middle;
+1 -1
View File
@@ -33,7 +33,7 @@ limitations under the License.
padding-left: 52px;
> p {
color: $tertiary-fg-color;
color: $tertiary-content;
}
.mx_AccessibleButton_kind_link {
+2 -2
View File
@@ -16,7 +16,7 @@ limitations under the License.
.mx_ForwardDialog {
width: 520px;
color: $primary-fg-color;
color: $primary-content;
display: flex;
flex-direction: column;
flex-wrap: nowrap;
@@ -25,7 +25,7 @@ limitations under the License.
> h3 {
margin: 0 0 6px;
color: $secondary-fg-color;
color: $secondary-content;
font-size: $font-12px;
font-weight: $font-semi-bold;
line-height: $font-15px;
@@ -16,7 +16,7 @@ limitations under the License.
.mx_GenericFeatureFeedbackDialog {
.mx_GenericFeatureFeedbackDialog_subheading {
color: $primary-fg-color;
color: $primary-content;
font-size: $font-14px;
line-height: $font-20px;
margin-bottom: 24px;
+2 -2
View File
@@ -70,11 +70,11 @@ limitations under the License.
}
.mx_HostSignupDialog_text_dark {
color: $primary-fg-color;
color: $primary-content;
}
.mx_HostSignupDialog_text_light {
color: $secondary-fg-color;
color: $secondary-content;
}
.mx_HostSignup_maximize_button {
+8 -8
View File
@@ -56,7 +56,7 @@ limitations under the License.
box-sizing: border-box;
min-width: 40%;
flex: 1 !important;
color: $primary-fg-color !important;
color: $primary-content !important;
}
}
@@ -94,7 +94,7 @@ limitations under the License.
}
> span {
color: $primary-fg-color;
color: $primary-content;
}
.mx_InviteDialog_subname {
@@ -110,7 +110,7 @@ limitations under the License.
font-size: $font-14px;
> span {
color: $primary-fg-color;
color: $primary-content;
font-weight: 600;
}
@@ -220,7 +220,7 @@ limitations under the License.
.mx_InviteDialog_roomTile_name {
font-weight: 600;
font-size: $font-14px;
color: $primary-fg-color;
color: $primary-content;
margin-left: 7px;
}
@@ -352,7 +352,7 @@ limitations under the License.
border-right: 0;
border-radius: 0;
margin-top: 0;
border-color: $quaternary-fg-color;
border-color: $quaternary-content;
input {
font-size: 18px;
@@ -418,7 +418,7 @@ limitations under the License.
> h4 {
font-size: $font-15px;
line-height: $font-24px;
color: $secondary-fg-color;
color: $secondary-content;
font-weight: normal;
}
@@ -432,14 +432,14 @@ limitations under the License.
font-size: $font-15px;
line-height: $font-24px;
font-weight: $font-semi-bold;
color: $primary-fg-color;
color: $primary-content;
}
.mx_InviteDialog_multiInviterError_entry_userId {
margin-left: 6px;
font-size: $font-12px;
line-height: $font-15px;
color: $tertiary-fg-color;
color: $tertiary-content;
}
}
+2 -2
View File
@@ -19,7 +19,7 @@ limitations under the License.
font-weight: normal;
font-family: $font-family;
font-size: $font-14px;
color: $primary-fg-color;
color: $primary-content;
.mx_Dropdown_input {
border: 1px solid $input-border-color;
@@ -44,7 +44,7 @@ limitations under the License.
top: 8px;
mask-repeat: no-repeat;
mask-position: center;
background-color: $secondary-fg-color;
background-color: $secondary-content;
}
}
}
+3 -3
View File
@@ -63,7 +63,7 @@ limitations under the License.
font-size: $font-12px;
line-height: $font-15px;
color: $secondary-fg-color;
color: $secondary-content;
&::before {
content: '';
@@ -72,7 +72,7 @@ limitations under the License.
top: calc(50% - 8px); // vertical centering
height: 16px;
width: 16px;
background-color: $secondary-fg-color;
background-color: $secondary-content;
mask-repeat: no-repeat;
mask-size: contain;
mask-image: url('$(res)/img/element-icons/room/room-summary.svg');
@@ -81,7 +81,7 @@ limitations under the License.
}
> p {
color: $primary-fg-color;
color: $primary-content;
}
}
@@ -23,7 +23,7 @@ limitations under the License.
.mx_ManageRestrictedJoinRuleDialog {
width: 480px;
color: $primary-fg-color;
color: $primary-content;
display: flex;
flex-direction: column;
flex-wrap: nowrap;
@@ -52,7 +52,7 @@ limitations under the License.
> h3 {
margin: 0;
color: $secondary-fg-color;
color: $secondary-content;
font-size: $font-12px;
font-weight: $font-semi-bold;
line-height: $font-15px;
@@ -85,7 +85,7 @@ limitations under the License.
margin-top: 8px;
font-size: $font-12px;
line-height: $font-15px;
color: $tertiary-fg-color;
color: $tertiary-content;
}
.mx_Checkbox {
@@ -113,7 +113,7 @@ limitations under the License.
font-size: $font-12px;
line-height: $font-15px;
color: $secondary-fg-color;
color: $secondary-content;
&::before {
content: '';
@@ -122,7 +122,7 @@ limitations under the License.
top: calc(50% - 8px); // vertical centering
height: 16px;
width: 16px;
background-color: $secondary-fg-color;
background-color: $secondary-content;
mask-repeat: no-repeat;
mask-size: contain;
mask-image: url('$(res)/img/element-icons/room/room-summary.svg');
@@ -37,7 +37,7 @@ limitations under the License.
list-style-type: none;
font-size: $font-14px;
padding: 0;
color: $primary-fg-color;
color: $primary-content;
span.mx_EditHistoryMessage_deletion, span.mx_EditHistoryMessage_insertion {
padding: 0px 2px;
@@ -19,7 +19,7 @@ limitations under the License.
.mx_Dialog_content {
margin-bottom: 24px;
color: $tertiary-fg-color;
color: $tertiary-content;
}
.mx_Dialog_primary {
@@ -72,7 +72,7 @@ limitations under the License.
margin-top: 0px;
margin-bottom: 0px;
font-size: 16pt;
color: $primary-fg-color;
color: $primary-content;
}
> * {
@@ -81,7 +81,7 @@ limitations under the License.
}
.workspace-channel-details {
color: $primary-fg-color;
color: $primary-content;
font-weight: 600;
.channel {
@@ -17,10 +17,10 @@ limitations under the License.
.mx_ServerOfflineDialog {
.mx_ServerOfflineDialog_content {
padding-right: 85px;
color: $primary-fg-color;
color: $primary-content;
hr {
border-color: $primary-fg-color;
border-color: $primary-content;
opacity: 0.1;
border-bottom: none;
}
@@ -22,7 +22,7 @@ limitations under the License.
margin-bottom: 0;
> p {
color: $secondary-fg-color;
color: $secondary-content;
font-size: $font-14px;
margin: 16px 0;
@@ -38,7 +38,7 @@ limitations under the License.
> h4 {
font-size: $font-15px;
font-weight: $font-semi-bold;
color: $secondary-fg-color;
color: $secondary-content;
margin-left: 8px;
}
+1 -1
View File
@@ -19,7 +19,7 @@ limitations under the License.
border: 1px solid $input-border-color;
padding: 9px;
color: $input-fg-color;
background-color: $primary-bg-color;
background-color: $background;
font-size: $font-15px;
width: 100%;
max-width: 280px;
@@ -15,7 +15,7 @@ limitations under the License.
*/
.mx_SpaceSettingsDialog {
color: $primary-fg-color;
color: $primary-content;
.mx_SpaceSettings_errorText {
font-weight: $font-semi-bold;
@@ -50,13 +50,13 @@ limitations under the License.
.mx_RadioButton_content {
font-weight: $font-semi-bold;
line-height: $font-18px;
color: $primary-fg-color;
color: $primary-content;
}
& + span {
font-size: $font-15px;
line-height: $font-18px;
color: $secondary-fg-color;
color: $secondary-content;
margin-left: 26px;
}
}
@@ -44,7 +44,7 @@ limitations under the License.
margin-right: 8px;
position: relative;
top: 5px;
background-color: $primary-fg-color;
background-color: $primary-content;
}
.mx_AccessSecretStorageDialog_resetBadge::before {
@@ -56,7 +56,7 @@ limitations under the License.
margin-right: 8px;
position: relative;
top: 5px;
background-color: $primary-fg-color;
background-color: $primary-content;
}
.mx_CreateSecretStorageDialog_secureBackupTitle::before {
@@ -101,7 +101,7 @@ limitations under the License.
margin-right: 8px;
position: relative;
top: 5px;
background-color: $primary-fg-color;
background-color: $primary-content;
}
.mx_CreateSecretStorageDialog_optionIcon_securePhrase {
@@ -26,7 +26,7 @@ limitations under the License.
&::before {
mask: url("$(res)/img/e2e/lock-warning-filled.svg");
mask-repeat: no-repeat;
background-color: $primary-fg-color;
background-color: $primary-content;
content: "";
position: absolute;
top: -6px;
@@ -34,7 +34,7 @@ limitations under the License.
box-sizing: border-box;
border-radius: 4px;
border: 1px solid $dialog-close-fg-color;
background-color: $primary-bg-color;
background-color: $background;
max-height: calc(100vh - 20px); // allow 10px padding on both top and bottom
overflow-y: auto;
}
@@ -153,7 +153,7 @@ limitations under the License.
mask-position: center;
mask-size: contain;
mask-image: url('$(res)/img/feather-customised/chevron-down-thin.svg');
background-color: $primary-fg-color;
background-color: $primary-content;
}
.mx_NetworkDropdown_handle_server {
+3 -3
View File
@@ -16,7 +16,7 @@ limitations under the License.
.mx_AddressSelector {
position: absolute;
background-color: $primary-bg-color;
background-color: $background;
width: 485px;
max-height: 116px;
overflow-y: auto;
@@ -31,8 +31,8 @@ limitations under the License.
}
.mx_AddressSelector_addressListElement .mx_AddressTile {
background-color: $primary-bg-color;
border: solid 1px $primary-bg-color;
background-color: $background;
border: solid 1px $background;
}
.mx_AddressSelector_addressListElement.mx_AddressSelector_selected {
+1 -1
View File
@@ -20,7 +20,7 @@ limitations under the License.
background-color: rgba(74, 73, 74, 0.1);
border: solid 1px $input-border-color;
line-height: $font-26px;
color: $primary-fg-color;
color: $primary-content;
font-size: $font-14px;
font-weight: normal;
margin-right: 4px;
+3 -3
View File
@@ -16,7 +16,7 @@ limitations under the License.
.mx_Dropdown {
position: relative;
color: $primary-fg-color;
color: $primary-content;
}
.mx_Dropdown_disabled {
@@ -52,7 +52,7 @@ limitations under the License.
padding-right: 9px;
mask: url('$(res)/img/feather-customised/dropdown-arrow.svg');
mask-repeat: no-repeat;
background: $primary-fg-color;
background: $primary-content;
}
.mx_Dropdown_option {
@@ -111,7 +111,7 @@ input.mx_Dropdown_option:focus {
padding: 0px;
border-radius: 4px;
border: 1px solid $input-focused-border-color;
background-color: $primary-bg-color;
background-color: $background;
max-height: 200px;
overflow-y: auto;
}
@@ -0,0 +1,22 @@
/*
Copyright 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.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_EventTilePreview_loader {
&.mx_IRCLayout,
&.mx_GroupLayout {
padding: 9px 0;
}
}
+3 -3
View File
@@ -25,7 +25,7 @@ limitations under the License.
}
.mx_BaseAvatar_image {
border: 1px solid $primary-bg-color;
border: 1px solid $background;
}
.mx_BaseAvatar_initial {
@@ -47,7 +47,7 @@ limitations under the License.
left: 0;
height: inherit;
width: inherit;
background: $tertiary-fg-color;
background: $tertiary-content;
mask-position: center;
mask-size: 20px;
mask-repeat: no-repeat;
@@ -60,6 +60,6 @@ limitations under the License.
margin-left: 12px;
font-size: $font-14px;
line-height: $font-24px;
color: $tertiary-fg-color;
color: $tertiary-content;
}
}
+4 -4
View File
@@ -46,8 +46,8 @@ limitations under the License.
// corners on the field above.
border-radius: 4px;
padding: 8px 9px;
color: $primary-fg-color;
background-color: $primary-bg-color;
color: $primary-content;
background-color: $background;
flex: 1;
min-width: 0;
}
@@ -67,7 +67,7 @@ limitations under the License.
height: 6px;
mask: url('$(res)/img/feather-customised/dropdown-arrow.svg');
mask-repeat: no-repeat;
background-color: $primary-fg-color;
background-color: $primary-content;
z-index: 1;
pointer-events: none;
}
@@ -100,7 +100,7 @@ limitations under the License.
color 0.25s ease-out 0.1s,
top 0.25s ease-out 0.1s,
background-color 0.25s ease-out 0.1s;
color: $primary-fg-color;
color: $primary-content;
background-color: transparent;
font-size: $font-14px;
position: absolute;
+2 -2
View File
@@ -32,12 +32,12 @@ limitations under the License.
justify-content: center;
align-items: center;
cursor: pointer;
color: $secondary-fg-color;
color: $secondary-content;
&::before {
content: "";
margin-right: 8px;
background-color: $secondary-fg-color;
background-color: $secondary-content;
mask-image: url('$(res)/img/feather-customised/eye.svg');
display: inline-block;
width: 18px;
@@ -37,7 +37,7 @@ limitations under the License.
right: -6px;
bottom: -6px;
background-color: $primary-bg-color;
background-color: $background;
border-radius: 50%;
z-index: 1;
@@ -45,7 +45,7 @@ limitations under the License.
height: 100%;
width: 100%;
background-color: $secondary-fg-color;
background-color: $secondary-content;
mask-position: center;
mask-repeat: no-repeat;
mask-image: url('$(res)/img/element-icons/camera.svg');
+1 -1
View File
@@ -43,7 +43,7 @@ a.mx_Pill {
/* More specific to override `.markdown-body a` color */
.mx_EventTile_content .markdown-body a.mx_UserPill,
.mx_UserPill {
color: $primary-fg-color;
color: $primary-content;
background-color: $other-user-pill-bg-color;
}
+1 -1
View File
@@ -35,7 +35,7 @@ limitations under the License.
font-size: $font-14px;
font-weight: $font-semi-bold;
border: 1px solid $input-border-color;
color: $primary-fg-color;
color: $primary-content;
> img {
object-fit: contain;
+1 -1
View File
@@ -74,7 +74,7 @@ limitations under the License.
.mx_ServerPicker_desc {
margin-top: -12px;
color: $tertiary-fg-color;
color: $tertiary-content;
grid-column: 1 / 2;
grid-row: 3;
margin-bottom: 16px;
+1 -1
View File
@@ -37,7 +37,7 @@ limitations under the License.
}
.mx_Spinner_icon {
background-color: $primary-fg-color;
background-color: $primary-content;
mask: url('$(res)/img/spinner.svg');
mask-size: contain;
animation: 1.1s steps(12, end) infinite spin;
+2 -2
View File
@@ -25,7 +25,7 @@ limitations under the License.
.mx_AccessibleButton {
min-width: 70px;
padding: 0; // override from button styles
padding: 0 8px; // override from button styles
margin-left: 16px; // distance from <Field>
}
@@ -50,7 +50,7 @@ limitations under the License.
&::before {
content: '';
border-radius: 20px;
background-color: $tertiary-fg-color;
background-color: $tertiary-content;
opacity: 0.15;
position: absolute;
top: 0;
+1 -1
View File
@@ -84,7 +84,7 @@ limitations under the License.
// These tooltips use an older style with a chevron
.mx_Field_tooltip {
background-color: $menu-bg-color;
color: $primary-fg-color;
color: $primary-content;
border: 1px solid $menu-border-color;
text-align: unset;
+3 -3
View File
@@ -57,7 +57,7 @@ limitations under the License.
}
.mx_EmojiPicker_anchor::before {
background-color: $primary-fg-color;
background-color: $primary-content;
content: '';
display: inline-block;
mask-size: 100%;
@@ -89,7 +89,7 @@ limitations under the License.
margin: 8px;
border-radius: 4px;
border: 1px solid $input-border-color;
background-color: $primary-bg-color;
background-color: $background;
display: flex;
input {
@@ -126,7 +126,7 @@ limitations under the License.
.mx_EmojiPicker_search_icon::after {
mask: url('$(res)/img/emojipicker/search.svg') no-repeat;
mask-size: 100%;
background-color: $primary-fg-color;
background-color: $primary-content;
content: '';
display: inline-block;
width: 100%;
+1 -1
View File
@@ -16,7 +16,7 @@ limitations under the License.
.mx_GroupRoomTile {
position: relative;
color: $primary-fg-color;
color: $primary-content;
cursor: pointer;
display: flex;
align-items: center;
+172 -115
View File
@@ -14,126 +14,23 @@ See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_CallEvent {
.mx_CallEvent_wrapper {
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
width: 100%;
background-color: $dark-panel-bg-color;
border-radius: 8px;
margin: 10px auto;
width: 75%;
box-sizing: border-box;
height: 60px;
&.mx_CallEvent_voice {
.mx_CallEvent_type_icon::before,
.mx_CallEvent_content_button_callBack span::before,
.mx_CallEvent_content_button_answer span::before {
mask-image: url('$(res)/img/element-icons/call/voice-call.svg');
}
}
&.mx_CallEvent_video {
.mx_CallEvent_type_icon::before,
.mx_CallEvent_content_button_callBack span::before,
.mx_CallEvent_content_button_answer span::before {
mask-image: url('$(res)/img/element-icons/call/video-call.svg');
}
}
&.mx_CallEvent_voice.mx_CallEvent_missed .mx_CallEvent_type_icon::before {
mask-image: url('$(res)/img/voip/missed-voice.svg');
}
&.mx_CallEvent_video.mx_CallEvent_missed .mx_CallEvent_type_icon::before {
mask-image: url('$(res)/img/voip/missed-video.svg');
}
.mx_CallEvent_info {
.mx_CallEvent {
position: relative;
display: flex;
flex-direction: row;
align-items: center;
margin-left: 12px;
justify-content: space-between;
.mx_CallEvent_info_basic {
display: flex;
flex-direction: column;
margin-left: 10px; // To match mx_CallEvent
.mx_CallEvent_sender {
font-weight: 600;
font-size: 1.5rem;
line-height: 1.8rem;
margin-bottom: 3px;
}
.mx_CallEvent_type {
font-weight: 400;
color: $secondary-fg-color;
font-size: 1.2rem;
line-height: $font-13px;
display: flex;
align-items: center;
.mx_CallEvent_type_icon {
height: 13px;
width: 13px;
margin-right: 5px;
&::before {
content: '';
position: absolute;
height: 13px;
width: 13px;
background-color: $tertiary-fg-color;
mask-repeat: no-repeat;
mask-size: contain;
}
}
}
}
}
.mx_CallEvent_content {
display: flex;
flex-direction: row;
align-items: center;
color: $secondary-fg-color;
margin-right: 16px;
.mx_CallEvent_content_button {
height: 24px;
padding: 0px 12px;
margin-left: 8px;
span {
padding: 8px 0;
display: flex;
align-items: center;
&::before {
content: '';
display: inline-block;
background-color: $button-fg-color;
mask-position: center;
mask-repeat: no-repeat;
mask-size: 16px;
width: 16px;
height: 16px;
margin-right: 8px;
}
}
}
.mx_CallEvent_content_button_reject span::before {
mask-image: url('$(res)/img/element-icons/call/hangup.svg');
}
.mx_CallEvent_content_tooltip {
margin-right: 5px;
}
background-color: $dark-panel-bg-color;
border-radius: 8px;
width: 65%;
box-sizing: border-box;
height: 60px;
margin: 4px 0;
.mx_CallEvent_iconButton {
display: inline-flex;
@@ -144,7 +41,7 @@ limitations under the License.
height: 16px;
width: 16px;
background-color: $tertiary-fg-color;
background-color: $secondary-content;
mask-repeat: no-repeat;
mask-size: contain;
mask-position: center;
@@ -158,5 +55,165 @@ limitations under the License.
.mx_CallEvent_unSilence::before {
mask-image: url('$(res)/img/voip/un-silence.svg');
}
&.mx_CallEvent_voice {
.mx_CallEvent_type_icon::before,
.mx_CallEvent_content_button_callBack span::before,
.mx_CallEvent_content_button_answer span::before {
mask-image: url('$(res)/img/element-icons/call/voice-call.svg');
}
}
&.mx_CallEvent_video {
.mx_CallEvent_type_icon::before,
.mx_CallEvent_content_button_callBack span::before,
.mx_CallEvent_content_button_answer span::before {
mask-image: url('$(res)/img/element-icons/call/video-call.svg');
}
}
&.mx_CallEvent_voice.mx_CallEvent_missed .mx_CallEvent_type_icon::before {
mask-image: url('$(res)/img/voip/missed-voice.svg');
}
&.mx_CallEvent_video.mx_CallEvent_missed .mx_CallEvent_type_icon::before {
mask-image: url('$(res)/img/voip/missed-video.svg');
}
&.mx_CallEvent_voice.mx_CallEvent_rejected .mx_CallEvent_type_icon::before,
&.mx_CallEvent_voice.mx_CallEvent_noAnswer .mx_CallEvent_type_icon::before {
mask-image: url('$(res)/img/voip/declined-voice.svg');
}
&.mx_CallEvent_video.mx_CallEvent_rejected .mx_CallEvent_type_icon::before,
&.mx_CallEvent_video.mx_CallEvent_noAnswer .mx_CallEvent_type_icon::before {
mask-image: url('$(res)/img/voip/declined-video.svg');
}
.mx_CallEvent_info {
display: flex;
flex-direction: row;
align-items: center;
margin-left: 12px;
min-width: 0;
.mx_CallEvent_info_basic {
display: flex;
flex-direction: column;
margin-left: 10px; // To match mx_CallEvent
min-width: 0;
.mx_CallEvent_sender {
font-weight: 600;
font-size: 1.5rem;
line-height: 1.8rem;
margin-bottom: 3px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.mx_CallEvent_type {
font-weight: 400;
color: $secondary-content;
font-size: 1.2rem;
line-height: $font-13px;
display: flex;
align-items: center;
.mx_CallEvent_type_icon {
height: 13px;
width: 13px;
margin-right: 5px;
&::before {
content: '';
position: absolute;
height: 13px;
width: 13px;
background-color: $secondary-content;
mask-repeat: no-repeat;
mask-size: contain;
}
}
}
}
}
.mx_CallEvent_content {
display: flex;
flex-direction: row;
align-items: center;
color: $secondary-content;
margin-right: 16px;
gap: 8px;
min-width: max-content;
.mx_CallEvent_content_button {
padding: 0px 12px;
span {
padding: 1px 0;
display: flex;
align-items: center;
&::before {
content: '';
display: inline-block;
background-color: $button-fg-color;
mask-position: center;
mask-repeat: no-repeat;
mask-size: 16px;
width: 16px;
height: 16px;
margin-right: 8px;
flex-shrink: 0;
}
}
}
.mx_CallEvent_content_button_reject span::before {
mask-image: url('$(res)/img/element-icons/call/hangup.svg');
}
.mx_CallEvent_content_tooltip {
margin-right: 5px;
}
}
&.mx_CallEvent_narrow {
height: unset;
width: 290px;
flex-direction: column;
align-items: unset;
gap: 16px;
.mx_CallEvent_iconButton {
position: absolute;
margin-right: 0;
top: 12px;
right: 12px;
height: 16px;
width: 16px;
display: flex;
}
.mx_CallEvent_info {
align-items: unset;
margin-top: 12px;
margin-right: 12px;
.mx_CallEvent_sender {
margin-bottom: 8px;
}
}
.mx_CallEvent_content {
margin-left: 54px; // mx_CallEvent margin (12px) + avatar (32px) + mx_CallEvent_info_basic margin (10px)
margin-bottom: 16px;
}
}
}
}
+5 -1
View File
@@ -36,6 +36,10 @@ $timelineImageBorderRadius: 4px;
animation: mx--anim-pulse 1.75s infinite cubic-bezier(.4, 0, .6, 1);
border-radius: $timelineImageBorderRadius;
}
.mx_no-image-placeholder {
background-color: $primary-content;
}
}
.mx_MImageBody_thumbnail_container {
@@ -96,5 +100,5 @@ $timelineImageBorderRadius: 4px;
}
.mx_EventTile:hover .mx_HiddenImagePlaceholder {
background-color: $primary-bg-color;
background-color: $background;
}
@@ -23,7 +23,7 @@ limitations under the License.
height: 32px;
line-height: $font-24px;
border-radius: 8px;
background: $primary-bg-color;
background: $background;
border: 1px solid $input-border-color;
top: -32px;
right: 8px;
@@ -77,11 +77,11 @@ limitations under the License.
mask-size: 18px;
mask-repeat: no-repeat;
mask-position: center;
background-color: $secondary-fg-color;
background-color: $secondary-content;
}
.mx_MessageActionBar_maskButton:hover::after {
background-color: $primary-fg-color;
background-color: $primary-content;
}
.mx_MessageActionBar_reactButton::after {
@@ -92,6 +92,10 @@ limitations under the License.
mask-image: url('$(res)/img/element-icons/room/message-bar/reply.svg');
}
.mx_MessageActionBar_threadButton::after {
mask-image: url('$(res)/img/element-icons/message/thread.svg');
}
.mx_MessageActionBar_editButton::after {
mask-image: url('$(res)/img/element-icons/room/message-bar/edit.svg');
}
+5 -5
View File
@@ -16,7 +16,7 @@ limitations under the License.
.mx_ReactionsRow {
margin: 6px 0;
color: $primary-fg-color;
color: $primary-content;
.mx_ReactionsRow_addReactionButton {
position: relative;
@@ -36,7 +36,7 @@ limitations under the License.
mask-size: 16px;
mask-repeat: no-repeat;
mask-position: center;
background-color: $tertiary-fg-color;
background-color: $tertiary-content;
mask-image: url('$(res)/img/element-icons/room/message-bar/emoji.svg');
}
@@ -46,7 +46,7 @@ limitations under the License.
&:hover, &.mx_ReactionsRow_addReactionButton_active {
&::before {
background-color: $primary-fg-color;
background-color: $primary-content;
}
}
}
@@ -64,10 +64,10 @@ limitations under the License.
vertical-align: middle;
&:link, &:visited {
color: $tertiary-fg-color;
color: $tertiary-content;
}
&:hover {
color: $primary-fg-color;
color: $primary-content;
}
}
+2 -2
View File
@@ -93,7 +93,7 @@ limitations under the License.
}
> h1 {
color: $tertiary-fg-color;
color: $tertiary-content;
font-size: $font-12px;
font-weight: 500;
}
@@ -145,7 +145,7 @@ limitations under the License.
justify-content: space-around;
.mx_AccessibleButton_kind_secondary {
color: $secondary-fg-color;
color: $secondary-content;
background-color: rgba(141, 151, 165, 0.2);
font-weight: $font-semi-bold;
font-size: $font-14px;
@@ -48,7 +48,7 @@ limitations under the License.
height: 32px;
line-height: $font-24px;
border-radius: 8px;
background: $primary-bg-color;
background: $background;
border: 1px solid $input-border-color;
padding: 1px;
width: max-content;
@@ -66,7 +66,7 @@ limitations under the License.
z-index: 1;
&::after {
background-color: $primary-fg-color;
background-color: $primary-content;
}
}
}
@@ -75,7 +75,7 @@ limitations under the License.
font-weight: $font-semi-bold;
font-size: $font-15px;
line-height: $font-24px;
color: $primary-fg-color;
color: $primary-content;
margin-top: 24px;
margin-bottom: 20px;
}
@@ -83,7 +83,7 @@ limitations under the License.
> span {
font-size: $font-12px;
line-height: $font-15px;
color: $secondary-fg-color;
color: $secondary-content;
}
}
}
@@ -27,7 +27,7 @@ limitations under the License.
.mx_RoomSummaryCard_alias {
font-size: $font-13px;
color: $secondary-fg-color;
color: $secondary-content;
}
h2, .mx_RoomSummaryCard_alias {
@@ -115,7 +115,7 @@ limitations under the License.
// as we will be applying it in its children
padding: 0;
height: auto;
color: $tertiary-fg-color;
color: $tertiary-content;
.mx_RoomSummaryCard_icon_app {
padding: 10px 48px 10px 12px; // based on typical mx_RoomSummaryCard_Button padding
@@ -128,7 +128,7 @@ limitations under the License.
}
span {
color: $primary-fg-color;
color: $primary-content;
}
}
@@ -232,6 +232,10 @@ limitations under the License.
mask-image: url('$(res)/img/element-icons/room/files.svg');
}
.mx_RoomSummaryCard_icon_threads::before {
mask-image: url('$(res)/img/element-icons/message/thread.svg');
}
.mx_RoomSummaryCard_icon_share::before {
mask-image: url('$(res)/img/element-icons/room/share.svg');
}
+1 -1
View File
@@ -55,7 +55,7 @@ limitations under the License.
}
.mx_UserInfo_separator {
border-bottom: 1px solid rgba($primary-fg-color, .1);
border-bottom: 1px solid rgba($primary-content, .1);
}
.mx_UserInfo_memberDetailsContainer {
+1 -1
View File
@@ -51,7 +51,7 @@ limitations under the License.
mask-position: center;
mask-size: contain;
mask-image: url('$(res)/img/element-icons/room/ellipsis.svg');
background-color: $secondary-fg-color;
background-color: $secondary-content;
}
}
}
+2 -2
View File
@@ -64,7 +64,7 @@ $MiniAppTileHeight: 200px;
&:hover {
.mx_AppsContainer_resizerHandle::after {
opacity: 0.8;
background: $primary-fg-color;
background: $primary-content;
}
.mx_ResizeHandle_horizontal::before {
@@ -79,7 +79,7 @@ $MiniAppTileHeight: 200px;
content: '';
background-color: $primary-fg-color;
background-color: $primary-content;
opacity: 0.8;
}
}
+12 -10
View File
@@ -4,27 +4,30 @@
z-index: 1001;
width: 100%;
border: 1px solid $primary-hairline-color;
background: $primary-bg-color;
background: $background;
border-bottom: none;
border-radius: 8px 8px 0 0;
max-height: 50vh;
overflow: auto;
max-height: 35vh;
overflow: clip;
display: flex;
flex-direction: column;
box-shadow: 0px -16px 32px $composer-shadow-color;
}
.mx_Autocomplete_ProviderSection {
border-bottom: 1px solid $primary-hairline-color;
width: 100%;
}
/* a "block" completion takes up a whole line */
.mx_Autocomplete_Completion_block {
height: 34px;
min-height: 34px;
display: flex;
padding: 0 12px;
user-select: none;
cursor: pointer;
align-items: center;
color: $primary-fg-color;
color: $primary-content;
}
.mx_Autocomplete_Completion_block * {
@@ -40,7 +43,7 @@
user-select: none;
cursor: pointer;
align-items: center;
color: $primary-fg-color;
color: $primary-content;
}
.mx_Autocomplete_Completion_pill > * {
@@ -59,8 +62,8 @@
.mx_Autocomplete_Completion_container_pill {
margin: 12px;
display: flex;
flex-flow: wrap;
height: 100%;
overflow-y: scroll;
}
.mx_Autocomplete_Completion_container_truncate {
@@ -68,7 +71,6 @@
.mx_Autocomplete_Completion_subtitle,
.mx_Autocomplete_Completion_description {
/* Ellipsis for long names/subtitles/descriptions */
max-width: 150px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
@@ -83,7 +85,7 @@
.mx_Autocomplete_provider_name {
margin: 12px;
color: $primary-fg-color;
color: $primary-content;
font-weight: 400;
opacity: 0.4;
}
@@ -31,7 +31,7 @@ limitations under the License.
@keyframes visualbell {
from { background-color: $visual-bell-bg-color; }
to { background-color: $primary-bg-color; }
to { background-color: $background; }
}
&.mx_BasicMessageComposer_input_error {
@@ -28,7 +28,7 @@ limitations under the License.
.mx_BasicMessageComposer_input {
border-radius: 4px;
border: solid 1px $primary-hairline-color;
background-color: $primary-bg-color;
background-color: $background;
max-height: 200px;
padding: 3px 6px;
+3 -3
View File
@@ -18,7 +18,7 @@ limitations under the License.
.mx_EntityTile {
display: flex;
align-items: center;
color: $primary-fg-color;
color: $primary-content;
cursor: pointer;
.mx_E2EIcon {
@@ -86,12 +86,12 @@ limitations under the License.
.mx_EntityTile_ellipsis .mx_EntityTile_name {
font-style: italic;
color: $primary-fg-color;
color: $primary-content;
}
.mx_EntityTile_invitePlaceholder .mx_EntityTile_name {
font-style: italic;
color: $primary-fg-color;
color: $primary-content;
}
.mx_EntityTile_unavailable .mx_EntityTile_avatar,
+11 -7
View File
@@ -33,6 +33,14 @@ limitations under the License.
margin-top: 2px;
}
&.mx_EventTile_highlight {
&::before {
background-color: $event-highlight-bg-color;
}
color: $event-highlight-fg-color;
}
/* For replies */
.mx_EventTile {
padding-top: 0;
@@ -105,6 +113,8 @@ limitations under the License.
.mx_ReplyTile .mx_SenderProfile {
display: block;
top: unset;
left: unset;
}
.mx_ReactionsRow {
@@ -188,8 +198,6 @@ limitations under the License.
}
.mx_ReplyThread {
margin: 0 calc(-1 * var(--gutterSize));
.mx_EventTile_reply {
max-width: 90%;
padding: 0;
@@ -223,11 +231,6 @@ limitations under the License.
margin-left: -9px;
}
.mx_ReplyThread {
border-left-width: 2px;
border-left-color: $eventbubble-reply-color;
}
/* Special layout scenario for "Unable To Decrypt (UTD)" events */
&.mx_EventTile_bad > .mx_EventTile_line {
display: grid;
@@ -264,6 +267,7 @@ limitations under the License.
}
.mx_EventTile.mx_EventTile_bubbleContainer[data-layout=bubble],
.mx_EventTile.mx_EventTile_leftAlignedBubble[data-layout=bubble],
.mx_EventTile.mx_EventTile_info[data-layout=bubble],
.mx_EventListSummary[data-layout=bubble][data-expanded=false] {
--backgroundColor: transparent;
+65 -5
View File
@@ -55,7 +55,7 @@ $hover-select-border: 4px;
}
.mx_SenderProfile {
color: $primary-fg-color;
color: $primary-content;
font-size: $font-14px;
display: inline-block; /* anti-zalgo, with overflow hidden */
overflow: hidden;
@@ -161,7 +161,7 @@ $hover-select-border: 4px;
// up with the other read receipts
&::before {
background-color: $tertiary-fg-color;
background-color: $tertiary-content;
mask-repeat: no-repeat;
mask-position: center;
mask-size: 14px;
@@ -480,7 +480,7 @@ $hover-select-border: 4px;
}
pre code > * {
display: inline-block;
display: inline;
}
pre {
@@ -514,7 +514,7 @@ $hover-select-border: 4px;
.mx_EventTile:hover .mx_EventTile_body pre,
.mx_EventTile.focus-visible:focus-within .mx_EventTile_body pre {
border: 1px solid #e5e5e5; // deliberate constant as we're behind an invert filter
border: 1px solid $tertiary-content;
}
.mx_EventTile_pre_container {
@@ -618,7 +618,7 @@ $hover-select-border: 4px;
}
.mx_EventTile_keyRequestInfo_text a {
color: $primary-fg-color;
color: $primary-content;
text-decoration: underline;
cursor: pointer;
}
@@ -643,6 +643,7 @@ $hover-select-border: 4px;
// Remove some of the default tile padding so that the error is centered
margin-right: 0;
.mx_EventTile_line {
padding-left: 0;
margin-right: 0;
@@ -674,3 +675,62 @@ $hover-select-border: 4px;
margin-right: 0;
}
}
.mx_ThreadInfo:hover {
cursor: pointer;
}
.mx_ThreadView {
display: flex;
flex-direction: column;
.mx_ScrollPanel {
margin-top: 20px;
.mx_RoomView_MessageList {
padding: 0;
}
}
.mx_EventTile_senderDetails {
display: flex;
align-items: center;
gap: 6px;
margin-bottom: 6px;
a {
flex: 1;
min-width: none;
max-width: 100%;
display: flex;
align-items: center;
.mx_SenderProfile {
flex: 1;
}
}
}
.mx_ThreadView_List {
flex: 1;
overflow: scroll;
}
.mx_EventTile_roomName {
display: none;
}
.mx_EventTile_line {
padding-left: 0 !important;
order: 10 !important;
}
.mx_EventTile {
width: 100%;
display: flex;
flex-direction: column;
margin-top: 0;
padding-bottom: 5px;
margin-bottom: 5px;
}
}
+1 -1
View File
@@ -56,7 +56,7 @@ limitations under the License.
height: 38px;
border-radius: 19px;
box-sizing: border-box;
background: $primary-bg-color;
background: $background;
border: 1.3px solid $muted-fg-color;
cursor: pointer;
}
+1 -1
View File
@@ -111,7 +111,7 @@ limitations under the License.
.mx_MemberInfo_field {
cursor: pointer;
font-size: $font-15px;
color: $primary-fg-color;
color: $primary-content;
margin-left: 8px;
line-height: $font-23px;
}
+19 -3
View File
@@ -130,7 +130,7 @@ limitations under the License.
@keyframes visualbell {
from { background-color: $visual-bell-bg-color; }
to { background-color: $primary-bg-color; }
to { background-color: $background; }
}
.mx_MessageComposer_input_error {
@@ -160,8 +160,8 @@ limitations under the License.
resize: none;
outline: none;
box-shadow: none;
color: $primary-fg-color;
background-color: $primary-bg-color;
color: $primary-content;
background-color: $background;
font-size: $font-14px;
max-height: 120px;
overflow: auto;
@@ -340,3 +340,19 @@ limitations under the License.
height: 50px;
}
}
/**
* Unstable compact mode
*/
.mx_MessageComposer.mx_MessageComposer--compact {
margin-right: 0;
.mx_MessageComposer_wrapper {
padding: 0;
}
.mx_MessageComposer_button:last-child {
margin-right: 0;
}
}
+1 -1
View File
@@ -67,6 +67,6 @@ limitations under the License.
> p {
margin: 0;
font-size: $font-15px;
color: $secondary-fg-color;
color: $secondary-content;
}
}
+1 -1
View File
@@ -42,7 +42,7 @@ limitations under the License.
// These are the 3 background types
&.mx_NotificationBadge_dot {
background-color: $primary-fg-color; // increased visibility
background-color: $primary-content; // increased visibility
width: 6px;
height: 6px;
+2 -2
View File
@@ -67,7 +67,7 @@ limitations under the License.
//left: 0;
height: inherit;
width: inherit;
background: $secondary-fg-color;
background: $secondary-content;
mask-position: center;
mask-size: 8px;
mask-repeat: no-repeat;
@@ -87,7 +87,7 @@ limitations under the License.
.mx_PinnedEventTile_timestamp {
font-size: inherit;
line-height: inherit;
color: $secondary-fg-color;
color: $secondary-content;
}
.mx_AccessibleButton_kind_link {
+2 -2
View File
@@ -16,7 +16,7 @@ limitations under the License.
.mx_ReplyPreview {
border: 1px solid $primary-hairline-color;
background: $primary-bg-color;
background: $background;
border-bottom: none;
border-radius: 8px 8px 0 0;
max-height: 50vh;
@@ -28,7 +28,7 @@ limitations under the License.
.mx_ReplyPreview_header {
margin: 8px;
color: $primary-fg-color;
color: $primary-content;
font-weight: 400;
opacity: 0.4;
}
+1 -1
View File
@@ -42,7 +42,7 @@ limitations under the License.
display: flex;
flex-direction: column;
text-decoration: none;
color: $primary-fg-color;
color: $primary-content;
}
.mx_RedactedBody {
+2 -2
View File
@@ -17,7 +17,7 @@ limitations under the License.
.mx_RoomHeader {
flex: 0 0 50px;
border-bottom: 1px solid $primary-hairline-color;
background-color: $roomheader-bg-color;
background-color: $background;
.mx_RoomHeader_e2eIcon {
height: 12px;
@@ -74,7 +74,7 @@ limitations under the License.
.mx_RoomHeader_buttons {
display: flex;
background-color: $primary-bg-color;
background-color: $background;
}
.mx_RoomHeader_info {
+3 -3
View File
@@ -43,11 +43,11 @@ limitations under the License.
div:first-child {
font-weight: $font-semi-bold;
line-height: $font-18px;
color: $primary-fg-color;
color: $primary-content;
}
.mx_AccessibleButton {
color: $primary-fg-color;
color: $primary-content;
position: relative;
padding: 8px 8px 8px 32px;
font-size: inherit;
@@ -64,7 +64,7 @@ limitations under the License.
position: absolute;
top: 8px;
left: 8px;
background: $secondary-fg-color;
background: $secondary-content;
mask-position: center;
mask-size: contain;
mask-repeat: no-repeat;
+1 -1
View File
@@ -233,7 +233,7 @@ limitations under the License.
&:hover, &.mx_RoomSublist_hasMenuOpen {
.mx_RoomSublist_resizerHandle {
opacity: 0.8;
background-color: $primary-fg-color;
background-color: $primary-content;
}
}
}
+1 -1
View File
@@ -124,7 +124,7 @@ limitations under the License.
mask-position: center;
mask-size: contain;
mask-repeat: no-repeat;
background: $primary-fg-color;
background: $primary-content;
}
}
+1 -1
View File
@@ -47,7 +47,7 @@ limitations under the License.
padding: 5px;
font-size: $font-15px;
cursor: pointer;
color: $primary-fg-color;
color: $primary-content;
border-bottom: 2px solid $accent-color;
font-weight: 600;
}
@@ -41,7 +41,7 @@ limitations under the License.
height: 38px;
border-radius: 19px;
box-sizing: border-box;
background: $primary-bg-color;
background: $background;
border: 1.3px solid $muted-fg-color;
cursor: pointer;
}
@@ -62,7 +62,7 @@ limitations under the License.
display: block;
width: 18px;
height: 18px;
background: $primary-bg-color;
background: $background;
border: 1.3px solid $muted-fg-color;
border-radius: 10px;
margin: 5px auto;
@@ -48,7 +48,7 @@ limitations under the License.
.mx_VoiceRecordComposerTile_uploadingState {
margin-right: 10px;
color: $secondary-fg-color;
color: $secondary-content;
}
.mx_VoiceRecordComposerTile_failedState {
+2 -2
View File
@@ -36,7 +36,7 @@ limitations under the License.
}
.mx_WhoIsTypingTile_avatars .mx_BaseAvatar {
border: 1px solid $primary-bg-color;
border: 1px solid $background;
border-radius: 40px;
}
@@ -45,7 +45,7 @@ limitations under the License.
display: inline-block;
color: #acacac;
background-color: #ddd;
border: 1px solid $primary-bg-color;
border: 1px solid $background;
border-radius: 40px;
width: 24px;
height: 24px;
+1 -1
View File
@@ -21,7 +21,7 @@ limitations under the License.
flex-direction: row;
gap: 24px;
color: $primary-fg-color;
color: $primary-content;
> .mx_LayoutSwitcher_RadioButton {
flex-grow: 0;
+2 -2
View File
@@ -15,7 +15,7 @@ limitations under the License.
*/
.mx_UserNotifSettings {
color: $primary-fg-color; // override from default settings page styles
color: $primary-content; // override from default settings page styles
.mx_UserNotifSettings_pushRulesTable {
width: calc(100% + 12px); // +12px to line up center of 'Noisy' column with toggle switches
@@ -34,7 +34,7 @@ limitations under the License.
}
tr > th:nth-child(n + 2) {
color: $secondary-fg-color;
color: $secondary-content;
font-size: $font-12px;
vertical-align: middle;
width: 66px;
@@ -25,7 +25,7 @@ limitations under the License.
.mx_SettingsTab_heading {
font-size: $font-20px;
font-weight: 600;
color: $primary-fg-color;
color: $primary-content;
margin-bottom: 10px;
}
@@ -37,7 +37,7 @@ limitations under the License.
font-size: $font-16px;
display: block;
font-weight: 600;
color: $primary-fg-color;
color: $primary-content;
margin-bottom: 10px;
margin-top: 12px;
}
@@ -72,7 +72,7 @@ limitations under the License.
vertical-align: middle;
display: inline-block;
font-size: $font-14px;
color: $primary-fg-color;
color: $primary-content;
max-width: calc(100% - $font-48px); // Force word wrap instead of colliding with the switch
box-sizing: border-box;
padding-right: 10px;
@@ -82,7 +82,7 @@ limitations under the License.
margin-top: 4px;
font-size: $font-12px;
line-height: $font-15px;
color: $secondary-fg-color;
color: $secondary-content;
}
.mx_SettingsTab_section .mx_SettingsFlag .mx_ToggleSwitch {
@@ -22,7 +22,7 @@ limitations under the License.
.mx_SecurityRoomSettingsTab_spacesWithAccess {
> h4 {
color: $secondary-fg-color;
color: $secondary-content;
font-weight: $font-semi-bold;
font-size: $font-12px;
line-height: $font-15px;
@@ -33,7 +33,7 @@ limitations under the License.
font-weight: 500;
font-size: $font-14px;
line-height: 32px; // matches height of avatar for v-align
color: $secondary-fg-color;
color: $secondary-content;
display: inline-block;
img.mx_RoomAvatar_isSpaceRoom,
@@ -89,7 +89,7 @@ limitations under the License.
font-weight: $font-semi-bold;
font-size: $font-15px;
line-height: $font-24px;
color: $primary-fg-color;
color: $primary-content;
display: block;
}
}
@@ -100,7 +100,7 @@ limitations under the License.
margin-bottom: 16px;
font-size: $font-15px;
line-height: $font-24px;
color: $secondary-fg-color;
color: $secondary-content;
& + .mx_RadioButton {
border-top: 1px solid $menu-border-color;
@@ -24,7 +24,7 @@ limitations under the License.
}
.mx_AppearanceUserSettingsTab_fontScaling {
color: $primary-fg-color;
color: $primary-content;
}
.mx_AppearanceUserSettingsTab_fontSlider {
@@ -81,7 +81,7 @@ limitations under the License.
.mx_AppearanceUserSettingsTab_themeSection {
$radio-bg-color: $input-darker-bg-color;
color: $primary-fg-color;
color: $primary-content;
> .mx_ThemeSelectors {
display: flex;
@@ -156,7 +156,7 @@ limitations under the License.
}
.mx_AppearanceUserSettingsTab_Advanced {
color: $primary-fg-color;
color: $primary-content;
> * {
margin-bottom: 16px;
@@ -36,6 +36,7 @@ limitations under the License.
margin-top: 10px;
padding: 10px;
width: max-content;
max-width: 100%;
.mx_HelpUserSettingsTab_copyButton {
flex-shrink: 0;
@@ -41,7 +41,7 @@ limitations under the License.
font-weight: $font-semi-bold;
font-size: $font-15px;
line-height: $font-18px;
color: $primary-fg-color;
color: $primary-content;
margin: 16px 0;
.mx_BaseAvatar {
@@ -27,7 +27,7 @@ limitations under the License.
position: relative;
height: 80px;
width: 80px;
background-color: $tertiary-fg-color;
background-color: $tertiary-content;
border-radius: 16px;
}
+4 -4
View File
@@ -28,7 +28,7 @@ $spacePanelWidth: 71px;
padding: 24px;
width: 480px;
box-sizing: border-box;
background-color: $primary-bg-color;
background-color: $background;
position: relative;
> div {
@@ -40,7 +40,7 @@ $spacePanelWidth: 71px;
> p {
font-size: $font-15px;
color: $secondary-fg-color;
color: $secondary-content;
}
.mx_SpaceFeedbackPrompt {
@@ -76,7 +76,7 @@ $spacePanelWidth: 71px;
width: 28px;
top: 0;
left: 0;
background-color: $tertiary-fg-color;
background-color: $tertiary-content;
transform: rotate(90deg);
mask-repeat: no-repeat;
mask-position: 2px 3px;
@@ -108,7 +108,7 @@ $spacePanelWidth: 71px;
line-height: $font-24px;
> span {
color: $secondary-fg-color;
color: $secondary-content;
position: relative;
font-size: inherit;
line-height: inherit;
+10 -3
View File
@@ -30,13 +30,20 @@ limitations under the License.
font-size: $font-15px;
line-height: $font-18px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
margin-top: 2px;
margin-right: 6px;
max-width: 200px;
}
.mx_CallEvent_type {
font-size: $font-12px;
line-height: $font-15px;
color: $tertiary-fg-color;
color: $tertiary-content;
margin-top: 4px;
margin-bottom: 6px;
@@ -55,7 +62,7 @@ limitations under the License.
position: absolute;
height: inherit;
width: inherit;
background-color: $tertiary-fg-color;
background-color: $tertiary-content;
mask-repeat: no-repeat;
mask-size: contain;
}
@@ -132,7 +139,7 @@ limitations under the License.
height: inherit;
width: inherit;
background-color: $tertiary-fg-color;
background-color: $tertiary-content;
mask-repeat: no-repeat;
mask-size: contain;
mask-position: center;
-13
View File
@@ -26,19 +26,6 @@ limitations under the License.
// different level.
pointer-events: none;
.mx_CallPreview {
pointer-events: initial; // restore pointer events so the user can leave/interact
.mx_VideoFeed_remote.mx_VideoFeed_voice {
min-height: 150px;
}
.mx_VideoFeed_local {
border-radius: 8px;
overflow: hidden;
}
}
.mx_AppTile_persistedWrapper div {
min-width: 350px;
}
+11
View File
@@ -18,4 +18,15 @@ limitations under the License.
position: fixed;
left: 0;
top: 0;
pointer-events: initial; // restore pointer events so the user can leave/interact
.mx_VideoFeed_remote.mx_VideoFeed_voice {
min-height: 150px;
}
.mx_VideoFeed_local {
border-radius: 8px;
overflow: hidden;
}
}
+3 -2
View File
@@ -39,10 +39,11 @@ limitations under the License.
.mx_CallView_pip {
width: 320px;
padding-bottom: 8px;
background-color: $toast-bg-color;
background-color: $system;
box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.20);
border-radius: 8px;
.mx_CallView_video_hold,
.mx_CallView_voice {
height: 180px;
}
@@ -73,9 +74,9 @@ limitations under the License.
> .mx_VideoFeed {
width: 100%;
height: 100%;
border-width: 0 !important; // Override mx_VideoFeed_speaking
&.mx_VideoFeed_voice {
background-color: $inverted-bg-color;
display: flex;
justify-content: center;
align-items: center;
+1 -1
View File
@@ -39,7 +39,7 @@ limitations under the License.
width: 100%;
max-width: 64px;
background-color: $primary-fg-color;
background-color: $primary-content;
}
}
}
+3 -3
View File
@@ -53,7 +53,7 @@ limitations under the License.
height: 20px;
width: 20px;
vertical-align: middle;
background-color: $secondary-fg-color;
background-color: $secondary-content;
mask-repeat: no-repeat;
mask-size: contain;
mask-position: center;
@@ -90,7 +90,7 @@ limitations under the License.
.mx_CallViewHeader_callTypeSmall {
font-size: 12px;
color: $secondary-fg-color;
color: $secondary-content;
line-height: initial;
height: 15px;
overflow: hidden;
@@ -113,7 +113,7 @@ limitations under the License.
height: 16px;
width: 16px;
background-color: $secondary-fg-color;
background-color: $secondary-content;
mask-repeat: no-repeat;
mask-size: contain;
mask-position: center;
+1 -2
View File
@@ -33,10 +33,9 @@ limitations under the License.
> .mx_VideoFeed {
width: 100%;
border-radius: 4px;
&.mx_VideoFeed_voice {
border-radius: 4px;
display: flex;
align-items: center;
justify-content: center;
+1 -1
View File
@@ -33,7 +33,7 @@ limitations under the License.
width: 40px;
height: 40px;
background-color: $dialpad-button-bg-color;
background-color: $quinary-content;
border-radius: 40px;
font-size: 18px;
font-weight: 600;
+1 -1
View File
@@ -30,7 +30,7 @@ limitations under the License.
margin-right: 20px;
/* a separator between the input line and the dial buttons */
border-bottom: 1px solid $quaternary-fg-color;
border-bottom: 1px solid $quaternary-content;
transition: border-bottom 0.25s;
}

Some files were not shown because too many files have changed in this diff Show More