Merge remote-tracking branch 'upstream/develop' into compact-reply-rendering
This commit is contained in:
Tulir Asokan
commit
26a4a23a33
387 changed files with 13248 additions and 5078 deletions
|
|
@ -17,7 +17,7 @@ limitations under the License.
|
|||
|
||||
.mx_AuthBody {
|
||||
width: 500px;
|
||||
font-size: 12px;
|
||||
font-size: $font-12px;
|
||||
color: $authpage-secondary-color;
|
||||
background-color: $authpage-body-bg-color;
|
||||
border-radius: 0 4px 4px 0;
|
||||
|
|
@ -25,14 +25,14 @@ limitations under the License.
|
|||
box-sizing: border-box;
|
||||
|
||||
h2 {
|
||||
font-size: 24px;
|
||||
font-size: $font-24px;
|
||||
font-weight: 600;
|
||||
margin-top: 8px;
|
||||
color: $authpage-primary-color;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: 14px;
|
||||
font-size: $font-14px;
|
||||
font-weight: 600;
|
||||
color: $authpage-primary-color;
|
||||
}
|
||||
|
|
@ -98,7 +98,7 @@ limitations under the License.
|
|||
|
||||
.mx_AuthBody_editServerDetails {
|
||||
padding-left: 1em;
|
||||
font-size: 12px;
|
||||
font-size: $font-12px;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -43,7 +43,7 @@ limitations under the License.
|
|||
|
||||
cursor: pointer;
|
||||
|
||||
font-size: 15px;
|
||||
font-size: $font-15px;
|
||||
padding: 0 11px;
|
||||
word-break: break-word;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -17,7 +17,7 @@ limitations under the License.
|
|||
.mx_AuthFooter {
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
font-size: 14px;
|
||||
font-size: $font-14px;
|
||||
opacity: 0.72;
|
||||
padding: 20px 0;
|
||||
background: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.8));
|
||||
|
|
|
|||
|
|
@ -24,13 +24,13 @@ limitations under the License.
|
|||
box-sizing: border-box;
|
||||
|
||||
h2 {
|
||||
font-size: 24px;
|
||||
font-size: $font-24px;
|
||||
font-weight: 600;
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: 14px;
|
||||
font-size: $font-14px;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -60,3 +60,14 @@ limitations under the License.
|
|||
.mx_InteractiveAuthEntryComponents_passwordSection {
|
||||
width: 300px;
|
||||
}
|
||||
|
||||
.mx_InteractiveAuthEntryComponents_sso_buttons {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: flex-end;
|
||||
margin-top: 20px;
|
||||
|
||||
.mx_AccessibleButton {
|
||||
margin-left: 5px;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -20,7 +20,7 @@ limitations under the License.
|
|||
|
||||
.mx_AuthBody_language .mx_Dropdown_input {
|
||||
border: none;
|
||||
font-size: 14px;
|
||||
font-size: $font-14px;
|
||||
font-weight: 600;
|
||||
color: $authpage-lang-color;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -65,5 +65,5 @@ limitations under the License.
|
|||
}
|
||||
|
||||
.mx_ServerTypeSelector_description {
|
||||
font-size: 10px;
|
||||
font-size: $font-10px;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -38,7 +38,7 @@ limitations under the License.
|
|||
white-space: nowrap;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
line-height: 16px;
|
||||
line-height: $font-16px;
|
||||
}
|
||||
|
||||
.mx_RoomTileContextMenu_tag_field.mx_RoomTileContextMenu_tag_fieldSet {
|
||||
|
|
|
|||
|
|
@ -44,7 +44,7 @@ input.mx_StatusMessageContextMenu_message {
|
|||
.mx_StatusMessageContextMenu_clear {
|
||||
@mixin mx_DialogButton;
|
||||
align-self: start;
|
||||
font-size: 12px;
|
||||
font-size: $font-12px;
|
||||
padding: 6px 1em;
|
||||
border: 1px solid transparent;
|
||||
margin-right: 10px;
|
||||
|
|
|
|||
|
|
@ -22,7 +22,7 @@ limitations under the License.
|
|||
white-space: nowrap;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
line-height: 16px;
|
||||
line-height: $font-16px;
|
||||
}
|
||||
|
||||
.mx_TagTileContextMenu_item object {
|
||||
|
|
|
|||
|
|
@ -19,12 +19,12 @@ limitations under the License.
|
|||
border-radius: 4px;
|
||||
|
||||
.mx_TopLeftMenu_greyedText {
|
||||
font-size: 12px;
|
||||
font-size: $font-12px;
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
.mx_TopLeftMenu_upgradeLink {
|
||||
font-size: 12px;
|
||||
font-size: $font-12px;
|
||||
|
||||
img {
|
||||
margin-left: 5px;
|
||||
|
|
|
|||
|
|
@ -28,7 +28,7 @@ limitations under the License.
|
|||
.mx_AddressPickerDialog_input,
|
||||
.mx_AddressPickerDialog_input:focus {
|
||||
height: 26px;
|
||||
font-size: 14px;
|
||||
font-size: $font-14px;
|
||||
font-family: $font-family;
|
||||
padding-left: 12px;
|
||||
padding-right: 12px;
|
||||
|
|
@ -50,7 +50,7 @@ limitations under the License.
|
|||
.mx_AddressPickerDialog_inputContainer {
|
||||
border-radius: 3px;
|
||||
border: solid 1px $input-border-color;
|
||||
line-height: 36px;
|
||||
line-height: $font-36px;
|
||||
padding-left: 4px;
|
||||
padding-right: 4px;
|
||||
padding-top: 1px;
|
||||
|
|
|
|||
|
|
@ -26,22 +26,22 @@ limitations under the License.
|
|||
}
|
||||
|
||||
.mx_ConfirmUserActionDialog_name {
|
||||
font-size: 18px;
|
||||
font-size: $font-18px;
|
||||
}
|
||||
|
||||
.mx_ConfirmUserActionDialog_userId {
|
||||
font-size: 13px;
|
||||
font-size: $font-13px;
|
||||
}
|
||||
|
||||
.mx_ConfirmUserActionDialog_reasonField {
|
||||
font-family: $font-family;
|
||||
font-size: 14px;
|
||||
font-size: $font-14px;
|
||||
color: $primary-fg-color;
|
||||
background-color: $primary-bg-color;
|
||||
|
||||
border-radius: 3px;
|
||||
border: solid 1px $input-border-color;
|
||||
line-height: 36px;
|
||||
line-height: $font-36px;
|
||||
padding-left: 16px;
|
||||
padding-right: 16px;
|
||||
padding-top: 1px;
|
||||
|
|
|
|||
|
|
@ -25,7 +25,7 @@ limitations under the License.
|
|||
}
|
||||
|
||||
.mx_CreateGroupDialog_input {
|
||||
font-size: 15px;
|
||||
font-size: $font-15px;
|
||||
border-radius: 3px;
|
||||
border: 1px solid $input-border-color;
|
||||
padding: 9px;
|
||||
|
|
@ -44,7 +44,7 @@ limitations under the License.
|
|||
.mx_CreateGroupDialog_prefix,
|
||||
.mx_CreateGroupDialog_suffix {
|
||||
padding: 0px 5px;
|
||||
line-height: 37px;
|
||||
line-height: $font-37px;
|
||||
background-color: $input-darker-bg-color;
|
||||
border: 1px solid $input-border-color;
|
||||
text-align: center;
|
||||
|
|
|
|||
|
|
@ -15,6 +15,8 @@ limitations under the License.
|
|||
*/
|
||||
|
||||
.mx_CreateRoomDialog_details {
|
||||
margin-top: 15px;
|
||||
|
||||
.mx_CreateRoomDialog_details_summary {
|
||||
outline: none;
|
||||
list-style: none;
|
||||
|
|
@ -49,7 +51,7 @@ limitations under the License.
|
|||
}
|
||||
|
||||
.mx_CreateRoomDialog_input {
|
||||
font-size: 15px;
|
||||
font-size: $font-15px;
|
||||
border-radius: 3px;
|
||||
border: 1px solid $input-border-color;
|
||||
padding: 9px;
|
||||
|
|
@ -71,11 +73,19 @@ limitations under the License.
|
|||
}
|
||||
|
||||
.mx_CreateRoomDialog {
|
||||
|
||||
&.mx_Dialog_fixedWidth {
|
||||
width: 450px;
|
||||
}
|
||||
|
||||
.mx_Dialog_content {
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
|
||||
p,
|
||||
.mx_Field_input label {
|
||||
color: $muted-fg-color;
|
||||
}
|
||||
|
||||
.mx_SettingsFlag {
|
||||
display: flex;
|
||||
}
|
||||
|
|
@ -90,5 +100,18 @@ limitations under the License.
|
|||
flex: 0 0 auto;
|
||||
margin-left: 30px;
|
||||
}
|
||||
|
||||
.mx_CreateRoomDialog_topic {
|
||||
margin-bottom: 36px;
|
||||
}
|
||||
|
||||
.mx_Dialog_content > .mx_SettingsFlag {
|
||||
margin-top: 24px;
|
||||
}
|
||||
|
||||
p {
|
||||
margin: 0 85px 0 0;
|
||||
font-size: $font-12px;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -68,11 +68,11 @@ limitations under the License.
|
|||
width: 240px;
|
||||
color: $input-fg-color;
|
||||
font-family: $font-family;
|
||||
font-size: 16px;
|
||||
font-size: $font-16px;
|
||||
}
|
||||
|
||||
.mx_DevTools_textarea {
|
||||
font-size: 12px;
|
||||
font-size: $font-12px;
|
||||
max-width: 684px;
|
||||
min-height: 250px;
|
||||
padding: 10px;
|
||||
|
|
|
|||
|
|
@ -40,8 +40,8 @@ limitations under the License.
|
|||
textarea,
|
||||
textarea:focus {
|
||||
height: 34px;
|
||||
line-height: 34px;
|
||||
font-size: 14px;
|
||||
line-height: $font-34px;
|
||||
font-size: $font-14px;
|
||||
padding-left: 12px;
|
||||
margin: 0 !important;
|
||||
border: 0 !important;
|
||||
|
|
@ -65,7 +65,7 @@ limitations under the License.
|
|||
min-width: 48px;
|
||||
margin-left: 10px;
|
||||
height: 25px;
|
||||
line-height: 25px;
|
||||
line-height: $font-25px;
|
||||
}
|
||||
|
||||
.mx_InviteDialog_buttonAndSpinner {
|
||||
|
|
@ -84,7 +84,7 @@ limitations under the License.
|
|||
padding-bottom: 10px;
|
||||
|
||||
h3 {
|
||||
font-size: 12px;
|
||||
font-size: $font-12px;
|
||||
color: $muted-fg-color;
|
||||
font-weight: bold;
|
||||
text-transform: uppercase;
|
||||
|
|
@ -143,23 +143,23 @@ limitations under the License.
|
|||
|
||||
.mx_InviteDialog_roomTile_name {
|
||||
font-weight: 600;
|
||||
font-size: 14px;
|
||||
font-size: $font-14px;
|
||||
color: $primary-fg-color;
|
||||
margin-left: 7px;
|
||||
}
|
||||
|
||||
.mx_InviteDialog_roomTile_userId {
|
||||
font-size: 12px;
|
||||
font-size: $font-12px;
|
||||
color: $muted-fg-color;
|
||||
margin-left: 7px;
|
||||
}
|
||||
|
||||
.mx_InviteDialog_roomTile_time {
|
||||
text-align: right;
|
||||
font-size: 12px;
|
||||
font-size: $font-12px;
|
||||
color: $muted-fg-color;
|
||||
float: right;
|
||||
line-height: 36px; // Height of the avatar to keep the time vertically aligned
|
||||
line-height: $font-36px; // Height of the avatar to keep the time vertically aligned
|
||||
}
|
||||
|
||||
.mx_InviteDialog_roomTile_highlight {
|
||||
|
|
@ -176,7 +176,7 @@ limitations under the License.
|
|||
border-radius: 12px;
|
||||
display: inline-block;
|
||||
height: 24px;
|
||||
line-height: 24px;
|
||||
line-height: $font-24px;
|
||||
padding-left: 8px;
|
||||
padding-right: 8px;
|
||||
color: #ffffff; // this is fine without a var because it's for both themes
|
||||
|
|
|
|||
65
res/css/views/dialogs/_KeyboardShortcutsDialog.scss
Normal file
65
res/css/views/dialogs/_KeyboardShortcutsDialog.scss
Normal file
|
|
@ -0,0 +1,65 @@
|
|||
/*
|
||||
Copyright 2020 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_KeyboardShortcutsDialog {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
-webkit-box-orient: vertical;
|
||||
-webkit-box-direction: normal;
|
||||
flex-direction: column;
|
||||
margin-bottom: -50px;
|
||||
max-height: 1100px; // XXX: this may need adjusting when adding new shortcuts
|
||||
|
||||
.mx_KeyboardShortcutsDialog_category {
|
||||
width: 33.3333%; // 3 columns
|
||||
margin: 0 0 40px;
|
||||
|
||||
& > div {
|
||||
padding-left: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
h3 {
|
||||
margin: 0 0 10px;
|
||||
}
|
||||
|
||||
h5 {
|
||||
margin: 15px 0 5px;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
kbd {
|
||||
padding: 5px;
|
||||
border-radius: 4px;
|
||||
background-color: $reaction-row-button-bg-color;
|
||||
margin-right: 5px;
|
||||
min-width: 20px;
|
||||
text-align: center;
|
||||
display: inline-block;
|
||||
border: 1px solid $kbd-border-color;
|
||||
box-shadow: 0 2px $kbd-border-color;
|
||||
margin-bottom: 4px;
|
||||
text-transform: capitalize;
|
||||
|
||||
& + kbd {
|
||||
margin-left: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
.mx_KeyboardShortcutsDialog_inline div {
|
||||
display: inline;
|
||||
}
|
||||
}
|
||||
|
|
@ -35,7 +35,7 @@ limitations under the License.
|
|||
|
||||
.mx_MessageEditHistoryDialog_edits {
|
||||
list-style-type: none;
|
||||
font-size: 14px;
|
||||
font-size: $font-14px;
|
||||
padding: 0;
|
||||
color: $primary-fg-color;
|
||||
|
||||
|
|
@ -60,7 +60,7 @@ limitations under the License.
|
|||
}
|
||||
|
||||
.mx_MessageActionBar .mx_AccessibleButton {
|
||||
font-size: 10px;
|
||||
font-size: $font-10px;
|
||||
padding: 0 8px;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -32,6 +32,6 @@ limitations under the License.
|
|||
}
|
||||
|
||||
.mx_NewSessionReviewDialog_deviceID {
|
||||
font-size: 12px;
|
||||
font-size: $font-12px;
|
||||
color: $notice-secondary-color;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -29,6 +29,10 @@ limitations under the License.
|
|||
mask-image: url('$(res)/img/feather-customised/users-sm.svg');
|
||||
}
|
||||
|
||||
.mx_RoomSettingsDialog_notificationsIcon::before {
|
||||
mask-image: url('$(res)/img/feather-customised/notifications.svg');
|
||||
}
|
||||
|
||||
.mx_RoomSettingsDialog_bridgesIcon::before {
|
||||
// This icon is pants, please improve :)
|
||||
mask-image: url('$(res)/img/feather-customised/bridge.svg');
|
||||
|
|
|
|||
|
|
@ -20,7 +20,7 @@ limitations under the License.
|
|||
padding: 9px;
|
||||
color: $input-fg-color;
|
||||
background-color: $primary-bg-color;
|
||||
font-size: 15px;
|
||||
font-size: $font-15px;
|
||||
width: 100%;
|
||||
max-width: 280px;
|
||||
margin-bottom: 10px;
|
||||
|
|
|
|||
|
|
@ -29,7 +29,7 @@ limitations under the License.
|
|||
padding: 9px;
|
||||
color: $primary-fg-color;
|
||||
background-color: $primary-bg-color;
|
||||
font-size: 15px;
|
||||
font-size: $font-15px;
|
||||
width: 100%;
|
||||
max-width: 280px;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -20,7 +20,7 @@ limitations under the License.
|
|||
padding: 9px;
|
||||
color: $primary-fg-color;
|
||||
background-color: $primary-bg-color;
|
||||
font-size: 15px;
|
||||
font-size: $font-15px;
|
||||
max-width: 280px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -31,7 +31,7 @@ limitations under the License.
|
|||
}
|
||||
|
||||
.mx_TermsDialog_termsTable {
|
||||
font-size: 12px;
|
||||
font-size: $font-12px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -14,14 +14,6 @@ See the License for the specific language governing permissions and
|
|||
limitations under the License.
|
||||
*/
|
||||
|
||||
// CSS voodoo to support a gemini-scrollbar for the contents of the dialog
|
||||
.mx_Dialog_unknownDevice .mx_Dialog {
|
||||
// ideally we'd shrink the height to fit when needed, but in practice this
|
||||
// is a pain in the ass. plus might as well make the dialog big given how
|
||||
// important it is.
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.mx_UnknownDeviceDialog {
|
||||
height: 100%;
|
||||
display: flex;
|
||||
|
|
@ -35,7 +27,7 @@ limitations under the License.
|
|||
// userid
|
||||
.mx_UnknownDeviceDialog p {
|
||||
font-weight: bold;
|
||||
font-size: 16px;
|
||||
font-size: $font-16px;
|
||||
}
|
||||
|
||||
.mx_UnknownDeviceDialog .mx_DeviceVerifyButtons {
|
||||
|
|
@ -44,6 +36,7 @@ limitations under the License.
|
|||
|
||||
.mx_UnknownDeviceDialog .mx_Dialog_content {
|
||||
margin-bottom: 24px;
|
||||
overflow-y: scroll;
|
||||
}
|
||||
|
||||
.mx_UnknownDeviceDialog_deviceList > li {
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
/*
|
||||
Copyright 2015, 2016 OpenMarket Ltd
|
||||
Copyright 2020 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,70 +15,149 @@ limitations under the License.
|
|||
*/
|
||||
|
||||
.mx_NetworkDropdown {
|
||||
height: 32px;
|
||||
position: relative;
|
||||
}
|
||||
width: max-content;
|
||||
padding-right: 32px;
|
||||
margin-left: auto;
|
||||
margin-right: 9px;
|
||||
margin-top: 12px;
|
||||
|
||||
.mx_NetworkDropdown_input {
|
||||
position: relative;
|
||||
border-radius: 3px;
|
||||
border: 1px solid $strong-input-border-color;
|
||||
font-weight: 300;
|
||||
font-size: 13px;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.mx_NetworkDropdown_arrow {
|
||||
border-color: $primary-fg-color transparent transparent;
|
||||
border-style: solid;
|
||||
border-width: 5px 5px 0;
|
||||
display: block;
|
||||
height: 0;
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
top: 16px;
|
||||
width: 0;
|
||||
}
|
||||
|
||||
.mx_NetworkDropdown_networkoption {
|
||||
height: 37px;
|
||||
line-height: 37px;
|
||||
padding-left: 8px;
|
||||
padding-right: 8px;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.mx_NetworkDropdown_networkoption img {
|
||||
margin: 5px;
|
||||
width: 25px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
input.mx_NetworkDropdown_networkoption, input.mx_NetworkDropdown_networkoption:focus {
|
||||
border: 0;
|
||||
padding-top: 0;
|
||||
padding-bottom: 0;
|
||||
.mx_AccessibleButton {
|
||||
width: max-content;
|
||||
}
|
||||
}
|
||||
|
||||
.mx_NetworkDropdown_menu {
|
||||
position: absolute;
|
||||
left: -1px;
|
||||
right: -1px;
|
||||
top: 100%;
|
||||
z-index: 2;
|
||||
min-width: 204px;
|
||||
margin: 0;
|
||||
padding: 0px;
|
||||
border-radius: 3px;
|
||||
border: 1px solid $accent-color;
|
||||
box-sizing: border-box;
|
||||
border-radius: 4px;
|
||||
border: 1px solid $dialog-close-fg-color;
|
||||
background-color: $primary-bg-color;
|
||||
}
|
||||
|
||||
.mx_NetworkDropdown_menu .mx_NetworkDropdown_networkoption:hover {
|
||||
background-color: $focus-bg-color;
|
||||
}
|
||||
|
||||
.mx_NetworkDropdown_menu_network {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.mx_NetworkDropdown_server {
|
||||
padding: 12px 0;
|
||||
border-bottom: 1px solid $input-darker-fg-color;
|
||||
|
||||
.mx_NetworkDropdown_server_title {
|
||||
padding: 0 10px;
|
||||
font-size: $font-15px;
|
||||
font-weight: 600;
|
||||
line-height: $font-20px;
|
||||
margin-bottom: 4px;
|
||||
|
||||
// remove server button
|
||||
.mx_AccessibleButton {
|
||||
position: absolute;
|
||||
display: inline;
|
||||
right: 12px;
|
||||
height: 16px;
|
||||
width: 16px;
|
||||
margin-top: 4px;
|
||||
|
||||
&::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
mask-repeat: no-repeat;
|
||||
mask-position: center;
|
||||
mask-size: contain;
|
||||
mask-image: url('$(res)/img/feather-customised/x.svg');
|
||||
background-color: $notice-primary-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.mx_NetworkDropdown_server_subtitle {
|
||||
padding: 0 10px;
|
||||
font-size: $font-10px;
|
||||
line-height: $font-14px;
|
||||
margin-top: -4px;
|
||||
margin-bottom: 4px;
|
||||
color: $muted-fg-color;
|
||||
}
|
||||
|
||||
.mx_NetworkDropdown_server_network {
|
||||
font-size: $font-12px;
|
||||
line-height: $font-16px;
|
||||
padding: 4px 10px;
|
||||
cursor: pointer;
|
||||
position: relative;
|
||||
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
|
||||
&[aria-checked=true]::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
right: 10px;
|
||||
mask-repeat: no-repeat;
|
||||
mask-position: center;
|
||||
mask-size: contain;
|
||||
mask-image: url('$(res)/img/feather-customised/check.svg');
|
||||
background-color: $input-valid-border-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.mx_NetworkDropdown_server_add,
|
||||
.mx_NetworkDropdown_server_network {
|
||||
&:hover {
|
||||
background-color: $header-panel-bg-color;
|
||||
}
|
||||
}
|
||||
|
||||
.mx_NetworkDropdown_server_add {
|
||||
padding: 16px 10px 16px 32px;
|
||||
position: relative;
|
||||
border-radius: 0 0 4px 4px;
|
||||
|
||||
&::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
left: 7px;
|
||||
mask-repeat: no-repeat;
|
||||
mask-position: center;
|
||||
mask-size: contain;
|
||||
mask-image: url('$(res)/img/feather-customised/plus.svg');
|
||||
background-color: $muted-fg-color;
|
||||
}
|
||||
}
|
||||
|
||||
.mx_NetworkDropdown_handle {
|
||||
position: relative;
|
||||
|
||||
&::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
right: -28px; // - (24 + 4)
|
||||
mask-repeat: no-repeat;
|
||||
mask-position: center;
|
||||
mask-size: contain;
|
||||
mask-image: url('$(res)/img/feather-customised/chevron-down.svg');
|
||||
background-color: $primary-fg-color;
|
||||
}
|
||||
|
||||
.mx_NetworkDropdown_handle_server {
|
||||
color: $muted-fg-color;
|
||||
font-size: $font-12px;
|
||||
}
|
||||
}
|
||||
|
||||
.mx_NetworkDropdown_dialog .mx_Dialog {
|
||||
width: 45vw;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -27,7 +27,7 @@ limitations under the License.
|
|||
text-align: center;
|
||||
border-radius: 4px;
|
||||
display: inline-block;
|
||||
font-size: 14px;
|
||||
font-size: $font-14px;
|
||||
}
|
||||
|
||||
.mx_AccessibleButton_kind_primary {
|
||||
|
|
@ -36,12 +36,20 @@ limitations under the License.
|
|||
font-weight: 600;
|
||||
}
|
||||
|
||||
.mx_AccessibleButton_kind_primary_outline {
|
||||
color: $button-primary-bg-color;
|
||||
background-color: $button-secondary-bg-color;
|
||||
border: 1px solid $button-primary-bg-color;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.mx_AccessibleButton_kind_secondary {
|
||||
color: $accent-color;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.mx_AccessibleButton_kind_primary.mx_AccessibleButton_disabled {
|
||||
.mx_AccessibleButton_kind_primary.mx_AccessibleButton_disabled,
|
||||
.mx_AccessibleButton_kind_primary_outline.mx_AccessibleButton_disabled {
|
||||
opacity: 0.4;
|
||||
}
|
||||
|
||||
|
|
@ -60,7 +68,14 @@ limitations under the License.
|
|||
background-color: $button-danger-bg-color;
|
||||
}
|
||||
|
||||
.mx_AccessibleButton_kind_danger.mx_AccessibleButton_disabled {
|
||||
.mx_AccessibleButton_kind_danger_outline {
|
||||
color: $button-danger-bg-color;
|
||||
background-color: $button-secondary-bg-color;
|
||||
border: 1px solid $button-danger-bg-color;
|
||||
}
|
||||
|
||||
.mx_AccessibleButton_kind_danger.mx_AccessibleButton_disabled,
|
||||
.mx_AccessibleButton_kind_danger_outline.mx_AccessibleButton_disabled {
|
||||
color: $button-danger-disabled-fg-color;
|
||||
background-color: $button-danger-disabled-bg-color;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -19,9 +19,9 @@ limitations under the License.
|
|||
border-radius: 3px;
|
||||
background-color: rgba(74, 73, 74, 0.1);
|
||||
border: solid 1px $input-border-color;
|
||||
line-height: 26px;
|
||||
line-height: $font-26px;
|
||||
color: $primary-fg-color;
|
||||
font-size: 14px;
|
||||
font-size: $font-14px;
|
||||
font-weight: normal;
|
||||
margin-right: 4px;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -18,7 +18,6 @@ limitations under the License.
|
|||
display: flex;
|
||||
padding-left: 9px;
|
||||
padding-right: 9px;
|
||||
margin: 0 5px 0 0 !important;
|
||||
}
|
||||
|
||||
.mx_DirectorySearchBox_joinButton {
|
||||
|
|
@ -33,7 +32,7 @@ limitations under the License.
|
|||
background-repeat: no-repeat;
|
||||
text-indent: 18px;
|
||||
font-weight: 600;
|
||||
font-size: 12px;
|
||||
font-size: $font-12px;
|
||||
user-select: none;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -29,7 +29,7 @@ limitations under the License.
|
|||
position: relative;
|
||||
border-radius: 3px;
|
||||
border: 1px solid $strong-input-border-color;
|
||||
font-size: 12px;
|
||||
font-size: $font-12px;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
|
|
@ -53,7 +53,7 @@ limitations under the License.
|
|||
|
||||
.mx_Dropdown_option {
|
||||
height: 35px;
|
||||
line-height: 35px;
|
||||
line-height: $font-35px;
|
||||
padding-left: 8px;
|
||||
padding-right: 8px;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -20,14 +20,21 @@ limitations under the License.
|
|||
}
|
||||
|
||||
.mx_EditableItem {
|
||||
display: flex;
|
||||
margin-bottom: 5px;
|
||||
margin-left: 15px;
|
||||
}
|
||||
|
||||
.mx_EditableItem_delete {
|
||||
order: 3;
|
||||
margin-right: 5px;
|
||||
cursor: pointer;
|
||||
vertical-align: middle;
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
mask-image: url('$(res)/img/feather-customised/cancel.svg');
|
||||
mask-repeat: no-repeat;
|
||||
background-color: $warning-color;
|
||||
mask-size: 100%;
|
||||
}
|
||||
|
||||
.mx_EditableItem_email {
|
||||
|
|
@ -36,12 +43,19 @@ limitations under the License.
|
|||
|
||||
.mx_EditableItem_promptText {
|
||||
margin-right: 10px;
|
||||
order: 2;
|
||||
}
|
||||
|
||||
.mx_EditableItem_confirmBtn {
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
.mx_EditableItem_item {
|
||||
flex: auto 1 0;
|
||||
order: 1;
|
||||
}
|
||||
|
||||
.mx_EditableItemList_label {
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -19,7 +19,7 @@ limitations under the License.
|
|||
}
|
||||
|
||||
.mx_TextualEvent.mx_EventListSummary_summary {
|
||||
font-size: 14px;
|
||||
font-size: $font-14px;
|
||||
display: inline-flex;
|
||||
}
|
||||
|
||||
|
|
@ -27,7 +27,7 @@ limitations under the License.
|
|||
display: inline-block;
|
||||
margin-right: 8px;
|
||||
padding-top: 8px;
|
||||
line-height: 12px;
|
||||
line-height: $font-12px;
|
||||
}
|
||||
|
||||
.mx_EventListSummary_avatars .mx_BaseAvatar {
|
||||
|
|
@ -46,19 +46,19 @@ limitations under the License.
|
|||
.mx_EventListSummary_line {
|
||||
border-bottom: 1px solid $primary-hairline-color;
|
||||
margin-left: 63px;
|
||||
line-height: 30px;
|
||||
line-height: $font-30px;
|
||||
}
|
||||
|
||||
.mx_MatrixChat_useCompactLayout {
|
||||
.mx_EventListSummary {
|
||||
font-size: 13px;
|
||||
font-size: $font-13px;
|
||||
.mx_EventTile_line {
|
||||
line-height: 20px;
|
||||
line-height: $font-20px;
|
||||
}
|
||||
}
|
||||
|
||||
.mx_EventListSummary_line {
|
||||
line-height: 22px;
|
||||
line-height: $font-22px;
|
||||
}
|
||||
|
||||
.mx_EventListSummary_toggle {
|
||||
|
|
@ -66,6 +66,6 @@ limitations under the License.
|
|||
}
|
||||
|
||||
.mx_TextualEvent.mx_EventListSummary_summary {
|
||||
font-size: 13px;
|
||||
font-size: $font-13px;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -40,7 +40,7 @@ limitations under the License.
|
|||
.mx_Field textarea {
|
||||
font-weight: normal;
|
||||
font-family: $font-family;
|
||||
font-size: 14px;
|
||||
font-size: $font-14px;
|
||||
border: none;
|
||||
// Even without a border here, we still need this avoid overlapping the rounded
|
||||
// corners on the field above.
|
||||
|
|
@ -102,7 +102,7 @@ limitations under the License.
|
|||
background-color 0.25s ease-out 0.1s;
|
||||
color: $primary-fg-color;
|
||||
background-color: transparent;
|
||||
font-size: 14px;
|
||||
font-size: $font-14px;
|
||||
position: absolute;
|
||||
left: 0px;
|
||||
top: 0px;
|
||||
|
|
@ -126,7 +126,7 @@ limitations under the License.
|
|||
color 0.25s ease-out 0s,
|
||||
top 0.25s ease-out 0s,
|
||||
background-color 0.25s ease-out 0s;
|
||||
font-size: 10px;
|
||||
font-size: $font-10px;
|
||||
top: -13px;
|
||||
padding: 0 2px;
|
||||
background-color: $field-focused-label-bg-color;
|
||||
|
|
|
|||
|
|
@ -15,9 +15,9 @@ limitations under the License.
|
|||
*/
|
||||
|
||||
.mx_FormButton {
|
||||
line-height: 16px;
|
||||
line-height: $font-16px;
|
||||
padding: 5px 15px;
|
||||
font-size: 12px;
|
||||
font-size: $font-12px;
|
||||
height: min-content;
|
||||
|
||||
&:not(:last-child) {
|
||||
|
|
|
|||
|
|
@ -102,13 +102,13 @@ limitations under the License.
|
|||
}
|
||||
|
||||
.mx_ImageView_name {
|
||||
font-size: 18px;
|
||||
font-size: $font-18px;
|
||||
margin-bottom: 6px;
|
||||
word-wrap: break-word;
|
||||
}
|
||||
|
||||
.mx_ImageView_metadata {
|
||||
font-size: 15px;
|
||||
font-size: $font-15px;
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
|
|
@ -118,13 +118,13 @@ limitations under the License.
|
|||
margin-bottom: 6px;
|
||||
border-radius: 5px;
|
||||
background-color: $lightbox-bg-color;
|
||||
font-size: 14px;
|
||||
font-size: $font-14px;
|
||||
padding: 9px;
|
||||
border: 1px solid $lightbox-border-color;
|
||||
}
|
||||
|
||||
.mx_ImageView_size {
|
||||
font-size: 11px;
|
||||
font-size: $font-11px;
|
||||
}
|
||||
|
||||
.mx_ImageView_link {
|
||||
|
|
@ -133,7 +133,7 @@ limitations under the License.
|
|||
}
|
||||
|
||||
.mx_ImageView_button {
|
||||
font-size: 15px;
|
||||
font-size: $font-15px;
|
||||
opacity: 0.5;
|
||||
margin-top: 18px;
|
||||
cursor: pointer;
|
||||
|
|
|
|||
|
|
@ -24,7 +24,7 @@ limitations under the License.
|
|||
background-color: $interactive-tooltip-bg-color;
|
||||
color: $interactive-tooltip-fg-color;
|
||||
position: absolute;
|
||||
font-size: 10px;
|
||||
font-size: $font-10px;
|
||||
font-weight: 600;
|
||||
padding: 6px;
|
||||
z-index: 5001;
|
||||
|
|
|
|||
|
|
@ -9,7 +9,7 @@
|
|||
border-radius: 16px;
|
||||
display: inline-block;
|
||||
height: 20px;
|
||||
line-height: 20px;
|
||||
line-height: $font-20px;
|
||||
padding-left: 5px;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -58,8 +58,8 @@ limitations under the License.
|
|||
z-index: 4000; // Higher than dialogs so tooltips can be used in dialogs
|
||||
padding: 10px;
|
||||
pointer-events: none;
|
||||
line-height: 14px;
|
||||
font-size: 12px;
|
||||
line-height: $font-14px;
|
||||
font-size: $font-12px;
|
||||
font-weight: 600;
|
||||
color: $primary-fg-color;
|
||||
max-width: 200px;
|
||||
|
|
@ -82,7 +82,7 @@ limitations under the License.
|
|||
text-align: center;
|
||||
border: none;
|
||||
border-radius: 3px;
|
||||
font-size: 14px;
|
||||
font-size: $font-14px;
|
||||
line-height: 1.2;
|
||||
padding: 6px 8px;
|
||||
|
||||
|
|
|
|||
|
|
@ -28,7 +28,7 @@ limitations under the License.
|
|||
transition: opacity 0.2s ease-in;
|
||||
opacity: 0.6;
|
||||
|
||||
line-height: 11px;
|
||||
line-height: $font-11px;
|
||||
text-align: center;
|
||||
|
||||
cursor: pointer;
|
||||
|
|
|
|||
|
|
@ -163,7 +163,7 @@ limitations under the License.
|
|||
|
||||
.mx_EmojiPicker_item {
|
||||
display: inline-block;
|
||||
font-size: 20px;
|
||||
font-size: $font-20px;
|
||||
padding: 5px;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
|
|
@ -183,7 +183,7 @@ limitations under the License.
|
|||
}
|
||||
|
||||
.mx_EmojiPicker_category_label, .mx_EmojiPicker_preview_name {
|
||||
font-size: 16px;
|
||||
font-size: $font-16px;
|
||||
font-weight: 600;
|
||||
margin: 0;
|
||||
}
|
||||
|
|
@ -197,7 +197,7 @@ limitations under the License.
|
|||
}
|
||||
|
||||
.mx_EmojiPicker_preview_emoji {
|
||||
font-size: 32px;
|
||||
font-size: $font-32px;
|
||||
padding: 8px 16px;
|
||||
}
|
||||
|
||||
|
|
@ -212,7 +212,7 @@ limitations under the License.
|
|||
|
||||
.mx_EmojiPicker_shortcode {
|
||||
color: $light-fg-color;
|
||||
font-size: 14px;
|
||||
font-size: $font-14px;
|
||||
|
||||
&::before, &::after {
|
||||
content: ":";
|
||||
|
|
|
|||
|
|
@ -19,7 +19,7 @@ limitations under the License.
|
|||
margin: 4px 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 14px;
|
||||
font-size: $font-14px;
|
||||
color: $roomtopic-color;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -21,7 +21,7 @@ limitations under the License.
|
|||
cursor: pointer;
|
||||
display: flex;
|
||||
height: 24px;
|
||||
line-height: 24px;
|
||||
line-height: $font-24px;
|
||||
border-radius: 4px;
|
||||
background: $message-action-bar-bg-color;
|
||||
top: -18px;
|
||||
|
|
|
|||
|
|
@ -16,5 +16,5 @@ limitations under the License.
|
|||
|
||||
.mx_MessageTimestamp {
|
||||
color: $event-timestamp-color;
|
||||
font-size: 10px;
|
||||
font-size: $font-10px;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -21,7 +21,7 @@ limitations under the License.
|
|||
|
||||
.mx_ReactionsRow_showAll {
|
||||
text-decoration: none;
|
||||
font-size: 10px;
|
||||
font-size: $font-10px;
|
||||
font-weight: 600;
|
||||
margin-left: 6px;
|
||||
vertical-align: top;
|
||||
|
|
|
|||
|
|
@ -17,7 +17,7 @@ limitations under the License.
|
|||
.mx_ReactionsRowButton {
|
||||
display: inline-flex;
|
||||
height: 20px;
|
||||
line-height: 21px;
|
||||
line-height: $font-21px;
|
||||
margin-right: 6px;
|
||||
padding: 0 6px;
|
||||
border: 1px solid $reaction-row-button-border-color;
|
||||
|
|
|
|||
|
|
@ -17,7 +17,7 @@ limitations under the License.
|
|||
.mx_EventTile_content.mx_ViewSourceEvent {
|
||||
display: flex;
|
||||
opacity: 0.6;
|
||||
font-size: 12px;
|
||||
font-size: $font-12px;
|
||||
|
||||
pre, code {
|
||||
flex: 1;
|
||||
|
|
|
|||
|
|
@ -45,7 +45,7 @@ limitations under the License.
|
|||
|
||||
.mx_cryptoEvent_title {
|
||||
font-weight: 600;
|
||||
font-size: 15px;
|
||||
font-size: $font-15px;
|
||||
grid-column: 2;
|
||||
grid-row: 1;
|
||||
}
|
||||
|
|
@ -56,7 +56,7 @@ limitations under the License.
|
|||
}
|
||||
|
||||
.mx_cryptoEvent_state, .mx_cryptoEvent_subtitle {
|
||||
font-size: 12px;
|
||||
font-size: $font-12px;
|
||||
}
|
||||
|
||||
.mx_cryptoEvent_state, .mx_cryptoEvent_buttons {
|
||||
|
|
|
|||
|
|
@ -20,7 +20,7 @@ limitations under the License.
|
|||
flex-direction: column;
|
||||
flex: 1;
|
||||
overflow-y: auto;
|
||||
font-size: 12px;
|
||||
font-size: $font-12px;
|
||||
|
||||
.mx_UserInfo_cancel {
|
||||
cursor: pointer;
|
||||
|
|
@ -43,7 +43,7 @@ limitations under the License.
|
|||
}
|
||||
|
||||
h2 {
|
||||
font-size: 18px;
|
||||
font-size: $font-18px;
|
||||
font-weight: 600;
|
||||
margin: 18px 0 0 0;
|
||||
}
|
||||
|
|
@ -122,7 +122,7 @@ limitations under the License.
|
|||
text-transform: uppercase;
|
||||
color: $notice-secondary-color;
|
||||
font-weight: bold;
|
||||
font-size: 12px;
|
||||
font-size: $font-12px;
|
||||
margin: 4px 0;
|
||||
}
|
||||
|
||||
|
|
@ -134,24 +134,28 @@ limitations under the License.
|
|||
text-align: center;
|
||||
|
||||
h2 {
|
||||
font-size: 18px;
|
||||
line-height: 25px;
|
||||
display: flex;
|
||||
font-size: $font-18px;
|
||||
line-height: $font-25px;
|
||||
flex: 1;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
// limit to 2 lines, show an ellipsis if it overflows
|
||||
// this looks webkit specific but is supported by Firefox 68+
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: vertical;
|
||||
-webkit-line-clamp: 2;
|
||||
span {
|
||||
// limit to 2 lines, show an ellipsis if it overflows
|
||||
// this looks webkit specific but is supported by Firefox 68+
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: vertical;
|
||||
-webkit-line-clamp: 2;
|
||||
|
||||
overflow: hidden;
|
||||
word-break: break-all;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
word-break: break-all;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.mx_E2EIcon {
|
||||
margin: 5px;
|
||||
margin-top: 3px; // visual vertical centering to the top line of text
|
||||
margin-right: 4px; // margin from displyname
|
||||
min-width: 18px; // convince flexbox to not collapse it
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -197,7 +201,7 @@ limitations under the License.
|
|||
.mx_UserInfo_field {
|
||||
cursor: pointer;
|
||||
color: $accent-color;
|
||||
line-height: 16px;
|
||||
line-height: $font-16px;
|
||||
margin: 8px 0;
|
||||
|
||||
&.mx_UserInfo_destructive {
|
||||
|
|
@ -206,7 +210,7 @@ limitations under the License.
|
|||
}
|
||||
|
||||
.mx_UserInfo_statusMessage {
|
||||
font-size: 11px;
|
||||
font-size: $font-11px;
|
||||
opacity: 0.5;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
|
|
@ -266,12 +270,31 @@ limitations under the License.
|
|||
}
|
||||
}
|
||||
|
||||
.mx_AccessibleButton.mx_AccessibleButton_hasKind {
|
||||
padding: 8px 18px;
|
||||
|
||||
&.mx_AccessibleButton_kind_primary {
|
||||
color: $accent-color;
|
||||
background-color: $accent-bg-color;
|
||||
}
|
||||
|
||||
&.mx_AccessibleButton_kind_danger {
|
||||
color: $notice-primary-color;
|
||||
background-color: $notice-primary-bg-color;
|
||||
}
|
||||
}
|
||||
|
||||
.mx_VerificationShowSas .mx_AccessibleButton,
|
||||
.mx_UserInfo_wideButton {
|
||||
display: block;
|
||||
margin: 16px 0;
|
||||
margin: 16px 0 8px;
|
||||
}
|
||||
button.mx_UserInfo_wideButton {
|
||||
width: 100%; // FIXME get rid of this once we get rid of DialogButtons here
|
||||
|
||||
|
||||
.mx_VerificationShowSas {
|
||||
.mx_AccessibleButton + .mx_AccessibleButton {
|
||||
margin: 8px 0; // space between buttons
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -14,10 +14,30 @@ See the License for the specific language governing permissions and
|
|||
limitations under the License.
|
||||
*/
|
||||
|
||||
.mx_UserInfo {
|
||||
.mx_VerificationPanel_verified_section .mx_E2EIcon {
|
||||
.mx_VerificationPanel_verified_section,
|
||||
.mx_VerificationPanel_reciprocate_section {
|
||||
// center the big shield icon
|
||||
.mx_E2EIcon {
|
||||
// Override general user info margin
|
||||
margin: 0 auto !important;
|
||||
margin: 20px auto !important;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.mx_UserInfo {
|
||||
.mx_EncryptionPanel_cancel {
|
||||
mask: url('$(res)/img/feather-customised/cancel.svg');
|
||||
mask-repeat: no-repeat;
|
||||
mask-position: center;
|
||||
mask-size: cover;
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
background-color: $settings-subsection-fg-color;
|
||||
cursor: pointer;
|
||||
position: absolute;
|
||||
z-index: 100;
|
||||
top: 14px;
|
||||
right: 14px;
|
||||
}
|
||||
|
||||
.mx_VerificationPanel_qrCode {
|
||||
|
|
@ -36,6 +56,16 @@ limitations under the License.
|
|||
max-width: 240px;
|
||||
}
|
||||
}
|
||||
|
||||
.mx_VerificationPanel_reciprocate_section {
|
||||
.mx_FormButton {
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
padding: 10px;
|
||||
display: block;
|
||||
margin: 10px 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Special case styling for EncryptionPanel in a Modal dialog
|
||||
|
|
@ -45,6 +75,7 @@ limitations under the License.
|
|||
margin-top: 10px;
|
||||
margin-bottom: 10px;
|
||||
align-items: stretch;
|
||||
justify-content: center;
|
||||
|
||||
> .mx_VerificationPanel_QRPhase_betweenText {
|
||||
width: 50px;
|
||||
|
|
@ -60,10 +91,12 @@ limitations under the License.
|
|||
border-radius: 10px;
|
||||
flex: 1;
|
||||
display: flex;
|
||||
padding: 10px;
|
||||
padding: 20px;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
position: relative;
|
||||
max-width: 310px;
|
||||
justify-content: space-between;
|
||||
|
||||
canvas, .mx_VerificationPanel_QRPhase_noQR {
|
||||
width: 220px !important;
|
||||
|
|
@ -76,31 +109,36 @@ limitations under the License.
|
|||
}
|
||||
|
||||
> p {
|
||||
margin-top: 0;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.mx_VerificationPanel_QRPhase_helpText {
|
||||
font-size: 14px;
|
||||
margin-top: 71px;
|
||||
font-size: $font-14px;
|
||||
margin: 30px 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.mx_AccessibleButton {
|
||||
position: absolute;
|
||||
bottom: 30px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// EncryptionPanel when verification is done
|
||||
.mx_VerificationPanel_verified_section {
|
||||
// center the big shield icon
|
||||
.mx_E2EIcon {
|
||||
margin: 0 auto;
|
||||
}
|
||||
// right align the "Got it" button
|
||||
.mx_AccessibleButton {
|
||||
float: right;
|
||||
}
|
||||
}
|
||||
|
||||
.mx_VerificationPanel_reciprocate_section {
|
||||
.mx_AccessibleButton {
|
||||
margin-left: 10px;
|
||||
padding: 7px 40px;
|
||||
}
|
||||
|
||||
.mx_VerificationPanel_reciprocateButtons {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -26,3 +26,21 @@ limitations under the License.
|
|||
outline: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.mx_AliasSettings {
|
||||
summary {
|
||||
cursor: pointer;
|
||||
color: $accent-color;
|
||||
font-weight: 600;
|
||||
list-style: none;
|
||||
|
||||
// list-style doesn't do it for webkit
|
||||
&::-webkit-details-marker {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.mx_AliasSettings_localAliasHeader {
|
||||
margin-top: 35px;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -46,7 +46,7 @@ $AppsDrawerBodyHeight: 273px;
|
|||
padding: 0;
|
||||
margin: 5px auto 5px auto;
|
||||
color: $accent-color;
|
||||
font-size: 12px;
|
||||
font-size: $font-12px;
|
||||
}
|
||||
|
||||
.mx_AddWidget_button_full_width {
|
||||
|
|
@ -59,7 +59,7 @@ $AppsDrawerBodyHeight: 273px;
|
|||
padding: 9px;
|
||||
color: $primary-hairline-color;
|
||||
background-color: $primary-bg-color;
|
||||
font-size: 15px;
|
||||
font-size: $font-15px;
|
||||
}
|
||||
|
||||
.mx_AppTile {
|
||||
|
|
@ -102,7 +102,7 @@ $AppsDrawerBodyHeight: 273px;
|
|||
|
||||
.mx_AppTileMenuBar {
|
||||
margin: 0;
|
||||
font-size: 12px;
|
||||
font-size: $font-12px;
|
||||
background-color: $widget-menu-bar-bg-color;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
|
|
@ -272,7 +272,7 @@ form.mx_Custom_Widget_Form div {
|
|||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
font-size: 16px;
|
||||
font-size: $font-16px;
|
||||
}
|
||||
|
||||
.mx_AppPermissionWarning_row {
|
||||
|
|
@ -280,7 +280,7 @@ form.mx_Custom_Widget_Form div {
|
|||
}
|
||||
|
||||
.mx_AppPermissionWarning_smallText {
|
||||
font-size: 12px;
|
||||
font-size: $font-12px;
|
||||
}
|
||||
|
||||
.mx_AppPermissionWarning_bolder {
|
||||
|
|
|
|||
|
|
@ -63,8 +63,8 @@ limitations under the License.
|
|||
border-radius: 8px;
|
||||
text-align: center;
|
||||
font-weight: normal;
|
||||
line-height: 16px;
|
||||
font-size: 10.4px;
|
||||
line-height: $font-16px;
|
||||
font-size: $font-10-4px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -78,7 +78,7 @@ limitations under the License.
|
|||
.mx_GroupRoomTile_name {
|
||||
flex: 1 1 0;
|
||||
overflow: hidden;
|
||||
font-size: 14px;
|
||||
font-size: $font-14px;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
|
@ -116,7 +116,7 @@ limitations under the License.
|
|||
}
|
||||
|
||||
.mx_EntityTile_subtext {
|
||||
font-size: 11px;
|
||||
font-size: $font-11px;
|
||||
opacity: 0.5;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
|
|
@ -125,7 +125,7 @@ limitations under the License.
|
|||
|
||||
.mx_EntityTile_power {
|
||||
padding-inline-start: 6px;
|
||||
font-size: 10px;
|
||||
font-size: $font-10px;
|
||||
color: $notice-secondary-color;
|
||||
max-width: 6em;
|
||||
overflow: hidden;
|
||||
|
|
|
|||
|
|
@ -19,7 +19,7 @@ limitations under the License.
|
|||
max-width: 100%;
|
||||
clear: both;
|
||||
padding-top: 18px;
|
||||
font-size: 14px;
|
||||
font-size: $font-14px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
|
|
@ -64,7 +64,7 @@ limitations under the License.
|
|||
|
||||
.mx_EventTile .mx_SenderProfile {
|
||||
color: $primary-fg-color;
|
||||
font-size: 14px;
|
||||
font-size: $font-14px;
|
||||
display: inline-block; /* anti-zalgo, with overflow hidden */
|
||||
overflow: hidden;
|
||||
cursor: pointer;
|
||||
|
|
@ -72,7 +72,7 @@ limitations under the License.
|
|||
padding-bottom: 0px;
|
||||
padding-top: 0px;
|
||||
margin: 0px;
|
||||
line-height: 17px;
|
||||
line-height: $font-17px;
|
||||
/* the next three lines, along with overflow hidden, truncate long display names */
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
|
|
@ -111,15 +111,23 @@ limitations under the License.
|
|||
}
|
||||
|
||||
.mx_EventTile_line, .mx_EventTile_reply {
|
||||
clear: both;
|
||||
position: relative;
|
||||
/* ideally should be 100px, but 95px gives us a max thumbnail size of 800x600, which is nice */
|
||||
margin-right: 110px;
|
||||
padding-left: 65px; /* left gutter */
|
||||
padding-top: 4px;
|
||||
padding-bottom: 2px;
|
||||
border-radius: 4px;
|
||||
min-height: 24px;
|
||||
line-height: 22px;
|
||||
line-height: $font-22px;
|
||||
}
|
||||
|
||||
.mx_RoomView_timeline_rr_enabled,
|
||||
// on ELS we need the margin to allow interaction with the expand/collapse button which is normally in the RR gutter
|
||||
.mx_EventListSummary {
|
||||
.mx_EventTile_line, .mx_EventTile_reply {
|
||||
/* ideally should be 100px, but 95px gives us a max thumbnail size of 800x600, which is nice */
|
||||
margin-right: 110px;
|
||||
}
|
||||
}
|
||||
|
||||
.mx_EventTile_bubbleContainer {
|
||||
|
|
@ -307,7 +315,7 @@ div.mx_EventTile_notSent.mx_EventTile_redacted .mx_UnknownBody {
|
|||
|
||||
.mx_EventTile_readAvatarRemainder {
|
||||
color: $event-timestamp-color;
|
||||
font-size: 11px;
|
||||
font-size: $font-11px;
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
|
|
@ -336,7 +344,7 @@ div.mx_EventTile_notSent.mx_EventTile_redacted .mx_UnknownBody {
|
|||
|
||||
.mx_EventTile_spoiler_reason {
|
||||
color: $event-timestamp-color;
|
||||
font-size: 11px;
|
||||
font-size: $font-11px;
|
||||
}
|
||||
|
||||
.mx_EventTile_spoiler_content {
|
||||
|
|
@ -388,7 +396,7 @@ div.mx_EventTile_notSent.mx_EventTile_redacted .mx_UnknownBody {
|
|||
}
|
||||
|
||||
.mx_EventTile_keyRequestInfo {
|
||||
font-size: 12px;
|
||||
font-size: $font-12px;
|
||||
}
|
||||
|
||||
.mx_EventTile_keyRequestInfo_text {
|
||||
|
|
@ -466,7 +474,7 @@ div.mx_EventTile_notSent.mx_EventTile_redacted .mx_UnknownBody {
|
|||
|
||||
.mx_EventTile_content .mx_EventTile_edited {
|
||||
user-select: none;
|
||||
font-size: 12px;
|
||||
font-size: $font-12px;
|
||||
color: $roomtopic-color;
|
||||
display: inline-block;
|
||||
margin-left: 9px;
|
||||
|
|
@ -484,7 +492,7 @@ div.mx_EventTile_notSent.mx_EventTile_redacted .mx_UnknownBody {
|
|||
white-space: normal !important;
|
||||
line-height: inherit !important;
|
||||
color: inherit; // inherit the colour from the dark or light theme by default (but not for code blocks)
|
||||
font-size: 14px;
|
||||
font-size: $font-14px;
|
||||
|
||||
pre, code {
|
||||
font-family: $monospace-font-family !important;
|
||||
|
|
@ -584,9 +592,9 @@ div.mx_EventTile_notSent.mx_EventTile_redacted .mx_UnknownBody {
|
|||
.mx_EventTile.mx_EventTile_info {
|
||||
// same as the padding for non-compact .mx_EventTile.mx_EventTile_info
|
||||
padding-top: 0px;
|
||||
font-size: 13px;
|
||||
font-size: $font-13px;
|
||||
.mx_EventTile_line, .mx_EventTile_reply {
|
||||
line-height: 20px;
|
||||
line-height: $font-20px;
|
||||
}
|
||||
.mx_EventTile_avatar {
|
||||
top: 4px;
|
||||
|
|
@ -594,7 +602,7 @@ div.mx_EventTile_notSent.mx_EventTile_redacted .mx_UnknownBody {
|
|||
}
|
||||
|
||||
.mx_EventTile .mx_SenderProfile {
|
||||
font-size: 13px;
|
||||
font-size: $font-13px;
|
||||
}
|
||||
|
||||
.mx_EventTile.mx_EventTile_emote {
|
||||
|
|
|
|||
|
|
@ -34,8 +34,8 @@ limitations under the License.
|
|||
top: -12px;
|
||||
border-radius: 16px;
|
||||
font-weight: bold;
|
||||
font-size: 12px;
|
||||
line-height: 14px;
|
||||
font-size: $font-12px;
|
||||
line-height: $font-14px;
|
||||
text-align: center;
|
||||
// to be able to get it centered
|
||||
// with text-align in parent
|
||||
|
|
|
|||
|
|
@ -59,7 +59,7 @@ limitations under the License.
|
|||
|
||||
.mx_MemberDeviceInfo_deviceId {
|
||||
word-break: break-word;
|
||||
font-size: 13px;
|
||||
font-size: $font-13px;
|
||||
}
|
||||
|
||||
.mx_MemberDeviceInfo_deviceInfo {
|
||||
|
|
|
|||
|
|
@ -48,7 +48,7 @@ limitations under the License.
|
|||
}
|
||||
|
||||
.mx_MemberInfo h2 {
|
||||
font-size: 18px;
|
||||
font-size: $font-18px;
|
||||
font-weight: 600;
|
||||
margin: 16px 0 16px 15px;
|
||||
}
|
||||
|
|
@ -94,12 +94,12 @@ limitations under the License.
|
|||
text-transform: uppercase;
|
||||
color: $input-darker-fg-color;
|
||||
font-weight: bold;
|
||||
font-size: 12px;
|
||||
font-size: $font-12px;
|
||||
margin: 4px 0;
|
||||
}
|
||||
|
||||
.mx_MemberInfo_profileField {
|
||||
font-size: 15px;
|
||||
font-size: $font-15px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
|
|
@ -109,10 +109,10 @@ limitations under the License.
|
|||
|
||||
.mx_MemberInfo_field {
|
||||
cursor: pointer;
|
||||
font-size: 15px;
|
||||
font-size: $font-15px;
|
||||
color: $primary-fg-color;
|
||||
margin-left: 8px;
|
||||
line-height: 23px;
|
||||
line-height: $font-23px;
|
||||
}
|
||||
|
||||
.mx_MemberInfo_createRoom {
|
||||
|
|
@ -128,7 +128,7 @@ limitations under the License.
|
|||
}
|
||||
|
||||
.mx_MemberInfo label {
|
||||
font-size: 13px;
|
||||
font-size: $font-13px;
|
||||
}
|
||||
|
||||
.mx_MemberInfo label .mx_MemberInfo_label_text {
|
||||
|
|
@ -144,7 +144,7 @@ limitations under the License.
|
|||
}
|
||||
|
||||
.mx_MemberInfo_statusMessage {
|
||||
font-size: 11px;
|
||||
font-size: $font-11px;
|
||||
opacity: 0.5;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
|
|
|
|||
|
|
@ -30,7 +30,7 @@ limitations under the License.
|
|||
text-transform: uppercase;
|
||||
color: $h3-color;
|
||||
font-weight: 600;
|
||||
font-size: 13px;
|
||||
font-size: $font-13px;
|
||||
padding-left: 3px;
|
||||
padding-right: 12px;
|
||||
margin-top: 8px;
|
||||
|
|
|
|||
|
|
@ -105,7 +105,7 @@ limitations under the License.
|
|||
min-height: 60px;
|
||||
justify-content: flex-start;
|
||||
align-items: flex-start;
|
||||
font-size: 14px;
|
||||
font-size: $font-14px;
|
||||
margin-right: 6px;
|
||||
}
|
||||
|
||||
|
|
@ -161,7 +161,7 @@ limitations under the License.
|
|||
box-shadow: none;
|
||||
color: $primary-fg-color;
|
||||
background-color: $primary-bg-color;
|
||||
font-size: 14px;
|
||||
font-size: $font-14px;
|
||||
max-height: 120px;
|
||||
overflow: auto;
|
||||
/* needed for FF */
|
||||
|
|
@ -242,7 +242,7 @@ limitations under the License.
|
|||
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
font-size: 10px;
|
||||
font-size: $font-10px;
|
||||
color: $greyed-fg-color;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -97,13 +97,13 @@ limitations under the License.
|
|||
|
||||
.mx_MessageComposerFormatBar_buttonTooltip {
|
||||
white-space: nowrap;
|
||||
font-size: 13px;
|
||||
font-size: $font-13px;
|
||||
font-weight: 600;
|
||||
min-width: 54px;
|
||||
text-align: center;
|
||||
|
||||
.mx_MessageComposerFormatBar_tooltipShortcut {
|
||||
font-size: 9px;
|
||||
font-size: $font-9px;
|
||||
opacity: 0.7;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -15,6 +15,6 @@ limitations under the License.
|
|||
*/
|
||||
|
||||
.mx_PresenceLabel {
|
||||
font-size: 11px;
|
||||
font-size: $font-11px;
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -41,7 +41,7 @@ limitations under the License.
|
|||
overflow-x: visible;
|
||||
}
|
||||
|
||||
.mx_AutoHideScrollbar_offset {
|
||||
.mx_AutoHideScrollbar {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
height: 100%;
|
||||
|
|
|
|||
|
|
@ -28,7 +28,7 @@ limitations under the License.
|
|||
}
|
||||
|
||||
.mx_RoomDropTarget {
|
||||
font-size: 13px;
|
||||
font-size: $font-13px;
|
||||
padding-top: 5px;
|
||||
padding-bottom: 5px;
|
||||
border: 1px dashed $accent-color;
|
||||
|
|
@ -41,7 +41,7 @@ limitations under the License.
|
|||
.mx_RoomDropTarget_label {
|
||||
position: relative;
|
||||
margin-top: 3px;
|
||||
line-height: 21px;
|
||||
line-height: $font-21px;
|
||||
z-index: 1;
|
||||
text-align: center;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -77,9 +77,9 @@ limitations under the License.
|
|||
}
|
||||
|
||||
.mx_RoomHeader_simpleHeader {
|
||||
line-height: 52px;
|
||||
line-height: $font-52px;
|
||||
color: $roomheader-color;
|
||||
font-size: 18px;
|
||||
font-size: $font-18px;
|
||||
font-weight: 600;
|
||||
overflow: hidden;
|
||||
margin-left: 63px;
|
||||
|
|
@ -102,7 +102,7 @@ limitations under the License.
|
|||
overflow: hidden;
|
||||
color: $roomheader-color;
|
||||
font-weight: 600;
|
||||
font-size: 18px;
|
||||
font-size: $font-18px;
|
||||
margin: 0 7px;
|
||||
border-bottom: 1px solid transparent;
|
||||
display: flex;
|
||||
|
|
@ -161,7 +161,7 @@ limitations under the License.
|
|||
flex: 1;
|
||||
color: $roomtopic-color;
|
||||
font-weight: 400;
|
||||
font-size: 13px;
|
||||
font-size: $font-13px;
|
||||
margin: 0 7px;
|
||||
margin-top: 4px; // to align baseline of topic with room name
|
||||
overflow: hidden;
|
||||
|
|
|
|||
|
|
@ -47,13 +47,13 @@ limitations under the License.
|
|||
}
|
||||
|
||||
.mx_RoomList_emptySubListTip {
|
||||
font-size: 13px;
|
||||
font-size: $font-13px;
|
||||
padding: 5px;
|
||||
border: 1px dashed $accent-color;
|
||||
color: $primary-fg-color;
|
||||
background-color: $droptarget-bg-color;
|
||||
border-radius: 4px;
|
||||
line-height: 16px;
|
||||
line-height: $font-16px;
|
||||
}
|
||||
|
||||
.mx_RoomList_emptySubListTip .mx_RoleButton {
|
||||
|
|
|
|||
|
|
@ -23,7 +23,7 @@ limitations under the License.
|
|||
-webkit-align-items: center;
|
||||
|
||||
h3 {
|
||||
font-size: 18px;
|
||||
font-size: $font-18px;
|
||||
font-weight: 600;
|
||||
|
||||
&.mx_RoomPreviewBar_spinnerTitle {
|
||||
|
|
@ -33,6 +33,13 @@ limitations under the License.
|
|||
}
|
||||
}
|
||||
|
||||
h3,
|
||||
.mx_RoomPreviewBar_message p {
|
||||
// break-word, with fallback to break-all, which is wider supported
|
||||
word-break: break-all;
|
||||
word-break: break-word;
|
||||
}
|
||||
|
||||
.mx_Spinner {
|
||||
width: auto;
|
||||
height: auto;
|
||||
|
|
@ -41,8 +48,8 @@ limitations under the License.
|
|||
}
|
||||
|
||||
.mx_RoomPreviewBar_footer {
|
||||
font-size: 12px;
|
||||
line-height: 20px;
|
||||
font-size: $font-12px;
|
||||
line-height: $font-20px;
|
||||
|
||||
.mx_Spinner {
|
||||
vertical-align: middle;
|
||||
|
|
|
|||
|
|
@ -64,7 +64,7 @@ limitations under the License.
|
|||
|
||||
.mx_RoomTile_subtext {
|
||||
display: inline-block;
|
||||
font-size: 11px;
|
||||
font-size: $font-11px;
|
||||
padding: 0 0 0 7px;
|
||||
margin: 0;
|
||||
overflow: hidden;
|
||||
|
|
@ -112,7 +112,7 @@ limitations under the License.
|
|||
}
|
||||
|
||||
.mx_RoomTile_name {
|
||||
font-size: 14px;
|
||||
font-size: $font-14px;
|
||||
padding: 0 4px;
|
||||
color: $roomtile-name-color;
|
||||
white-space: nowrap;
|
||||
|
|
@ -126,7 +126,7 @@ limitations under the License.
|
|||
padding: 0 0.4em;
|
||||
color: $roomtile-badge-fg-color;
|
||||
font-weight: 600;
|
||||
font-size: 12px;
|
||||
font-size: $font-12px;
|
||||
}
|
||||
|
||||
.collapsed {
|
||||
|
|
|
|||
|
|
@ -22,7 +22,7 @@ limitations under the License.
|
|||
|
||||
.mx_SearchBar_input {
|
||||
// border: 1px solid $input-border-color;
|
||||
// font-size: 15px;
|
||||
// font-size: $font-15px;
|
||||
flex: 1 1 0;
|
||||
margin-left: 22px;
|
||||
}
|
||||
|
|
@ -45,7 +45,7 @@ limitations under the License.
|
|||
border: 0;
|
||||
margin: 0 0 0 22px;
|
||||
padding: 5px;
|
||||
font-size: 15px;
|
||||
font-size: $font-15px;
|
||||
cursor: pointer;
|
||||
color: $primary-fg-color;
|
||||
border-bottom: 2px solid $accent-color;
|
||||
|
|
|
|||
|
|
@ -1,77 +0,0 @@
|
|||
/*
|
||||
Copyright 2016 OpenMarket Ltd
|
||||
|
||||
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_SearchableEntityList {
|
||||
display: flex;
|
||||
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.mx_SearchableEntityList_query {
|
||||
font-family: $font-family;
|
||||
border-radius: 3px;
|
||||
border: 1px solid $input-border-color;
|
||||
padding: 9px;
|
||||
color: $primary-fg-color;
|
||||
background-color: $primary-bg-color;
|
||||
margin-left: 3px;
|
||||
font-size: 15px;
|
||||
margin-bottom: 8px;
|
||||
width: 189px;
|
||||
}
|
||||
|
||||
.mx_SearchableEntityList_query::-moz-placeholder {
|
||||
color: $primary-fg-color;
|
||||
opacity: 0.5;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.mx_SearchableEntityList_query::-webkit-input-placeholder {
|
||||
color: $primary-fg-color;
|
||||
opacity: 0.5;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.mx_SearchableEntityList_listWrapper {
|
||||
flex: 1;
|
||||
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.mx_SearchableEntityList_list {
|
||||
display: table;
|
||||
table-layout: fixed;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.mx_SearchableEntityList_list .mx_EntityTile_chevron {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.mx_SearchableEntityList_hrWrapper {
|
||||
width: 100%;
|
||||
flex: 0 0 auto;
|
||||
}
|
||||
|
||||
.mx_SearchableEntityList hr {
|
||||
height: 1px;
|
||||
border: 0px;
|
||||
color: $primary-fg-color;
|
||||
background-color: $primary-fg-color;
|
||||
margin-right: 15px;
|
||||
margin-top: 11px;
|
||||
margin-bottom: 11px;
|
||||
}
|
||||
|
|
@ -18,7 +18,7 @@ limitations under the License.
|
|||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
font-size: 14px;
|
||||
font-size: $font-14px;
|
||||
justify-content: center;
|
||||
margin-right: 6px;
|
||||
// don't grow wider than available space
|
||||
|
|
|
|||
|
|
@ -51,8 +51,30 @@ limitations under the License.
|
|||
position: absolute;
|
||||
width: 38px;
|
||||
height: 38px;
|
||||
mask: url('$(res)/img/icon-jump-to-first-unread.svg');
|
||||
mask-image: url('$(res)/img/icon-jump-to-first-unread.svg');
|
||||
mask-repeat: no-repeat;
|
||||
mask-position: 9px 13px;
|
||||
background: $roomtile-name-color;
|
||||
}
|
||||
|
||||
.mx_TopUnreadMessagesBar_markAsRead {
|
||||
display: block;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
background: $primary-bg-color;
|
||||
border: 1.3px solid $roomtile-name-color;
|
||||
border-radius: 10px;
|
||||
margin: 5px auto;
|
||||
}
|
||||
|
||||
.mx_TopUnreadMessagesBar_markAsRead::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
mask-image: url('$(res)/img/cancel.svg');
|
||||
mask-repeat: no-repeat;
|
||||
mask-size: 10px;
|
||||
mask-position: 4px 4px;
|
||||
background: $roomtile-name-color;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -49,7 +49,7 @@ limitations under the License.
|
|||
border-radius: 40px;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
line-height: 24px;
|
||||
line-height: $font-24px;
|
||||
font-size: 0.8em;
|
||||
vertical-align: top;
|
||||
text-align: center;
|
||||
|
|
@ -57,7 +57,7 @@ limitations under the License.
|
|||
|
||||
.mx_WhoIsTypingTile_label {
|
||||
flex: 1;
|
||||
font-size: 14px;
|
||||
font-size: $font-14px;
|
||||
font-weight: 600;
|
||||
color: $eventtile-meta-color;
|
||||
}
|
||||
|
|
|
|||
20
res/css/views/settings/_E2eAdvancedPanel.scss
Normal file
20
res/css/views/settings/_E2eAdvancedPanel.scss
Normal file
|
|
@ -0,0 +1,20 @@
|
|||
/*
|
||||
Copyright 2020 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_E2eAdvancedPanel_settingLongDescription {
|
||||
margin-right: 150px;
|
||||
}
|
||||
|
||||
|
|
@ -19,7 +19,7 @@ limitations under the License.
|
|||
}
|
||||
|
||||
.mx_SettingsTab_heading {
|
||||
font-size: 20px;
|
||||
font-size: $font-20px;
|
||||
font-weight: 600;
|
||||
color: $primary-fg-color;
|
||||
}
|
||||
|
|
@ -29,7 +29,7 @@ limitations under the License.
|
|||
}
|
||||
|
||||
.mx_SettingsTab_subheading {
|
||||
font-size: 16px;
|
||||
font-size: $font-16px;
|
||||
display: block;
|
||||
font-family: $font-family;
|
||||
font-weight: 600;
|
||||
|
|
@ -40,20 +40,28 @@ limitations under the License.
|
|||
|
||||
.mx_SettingsTab_subsectionText {
|
||||
color: $settings-subsection-fg-color;
|
||||
font-size: 14px;
|
||||
font-size: $font-14px;
|
||||
display: block;
|
||||
margin: 10px 100px 10px 0; // Align with the rest of the view
|
||||
}
|
||||
|
||||
.mx_SettingsTab_section .mx_SettingsFlag {
|
||||
margin-right: 100px;
|
||||
margin-bottom: 10px;
|
||||
.mx_SettingsTab_section {
|
||||
margin-bottom: 24px;
|
||||
|
||||
.mx_SettingsFlag {
|
||||
margin-right: 100px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
&.mx_SettingsTab_subsectionText .mx_SettingsFlag {
|
||||
margin-right: 0px !important;
|
||||
}
|
||||
}
|
||||
|
||||
.mx_SettingsTab_section .mx_SettingsFlag .mx_SettingsFlag_label {
|
||||
vertical-align: middle;
|
||||
display: inline-block;
|
||||
font-size: 14px;
|
||||
font-size: $font-14px;
|
||||
color: $primary-fg-color;
|
||||
max-width: calc(100% - 48px); // Force word wrap instead of colliding with the switch
|
||||
box-sizing: border-box;
|
||||
|
|
|
|||
|
|
@ -16,7 +16,7 @@ limitations under the License.
|
|||
|
||||
.mx_InlineTermsAgreement_cbContainer {
|
||||
margin-bottom: 10px;
|
||||
font-size: 14px;
|
||||
font-size: $font-14px;
|
||||
|
||||
a {
|
||||
color: $accent-color;
|
||||
|
|
|
|||
|
|
@ -48,16 +48,34 @@ limitations under the License.
|
|||
}
|
||||
|
||||
.mx_VerificationShowSas_emojiSas_emoji {
|
||||
font-size: 32px;
|
||||
font-size: $font-32px;
|
||||
}
|
||||
|
||||
.mx_VerificationShowSas_emojiSas_label {
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
font-size: 12px;
|
||||
font-size: $font-12px;
|
||||
}
|
||||
|
||||
.mx_VerificationShowSas_emojiSas_break {
|
||||
flex-basis: 100%;
|
||||
}
|
||||
|
||||
.mx_VerificationShowSas {
|
||||
.mx_Dialog_buttons {
|
||||
// this is more specific than the DialogButtons css so gets preference
|
||||
button.mx_VerificationShowSas_matchButton {
|
||||
color: $accent-color;
|
||||
background-color: $accent-bg-color;
|
||||
border: none;
|
||||
}
|
||||
|
||||
// this is more specific than the DialogButtons css so gets preference
|
||||
button.mx_VerificationShowSas_noMatchButton {
|
||||
color: $notice-primary-color;
|
||||
background-color: $notice-primary-bg-color;
|
||||
border: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -21,5 +21,5 @@ limitations under the License.
|
|||
text-align: center;
|
||||
padding: 6px;
|
||||
font-weight: bold;
|
||||
font-size: 13px;
|
||||
font-size: $font-13px;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -54,7 +54,7 @@ limitations under the License.
|
|||
vertical-align: middle;
|
||||
width: 80px;
|
||||
height: 36px;
|
||||
line-height: 36px;
|
||||
line-height: $font-36px;
|
||||
border-radius: 36px;
|
||||
color: $accent-fg-color;
|
||||
margin: auto;
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue