Merge branch 'develop' into 19245-improve-styling-of-search-initialization-errors

This commit is contained in:
Travis Ralston 2022-05-09 19:32:43 -06:00
commit 401e124df6
90 changed files with 562 additions and 398 deletions

View file

@ -119,7 +119,7 @@ limitations under the License.
font-size: 12px;
font-weight: $font-semi-bold;
line-height: 15px;
color: #FFFFFF;
color: $button-primary-fg-color;
display: inline-block;
vertical-align: text-bottom;
word-break: keep-all; // avoid multiple lines on CJK language

View file

@ -38,14 +38,9 @@ limitations under the License.
}
.mx_CompoundDialog_cancelButton {
mask: url('$(res)/img/feather-customised/cancel.svg');
mask-repeat: no-repeat;
mask-position: center;
mask-size: cover;
@mixin customisedCancelButton;
width: 20px;
height: 20px;
background-color: $dialog-close-fg-color;
cursor: pointer;
// Align with middle of title, 34px from right edge
position: absolute;

View file

@ -25,14 +25,12 @@ limitations under the License.
}
.mx_EditableItem_delete {
@mixin customisedCancelButton;
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: $alert;
mask-size: 100%;
}

View file

@ -27,6 +27,7 @@ limitations under the License.
flex: 1 1 0;
height: 0;
border: none;
border-bottom: 1px solid $menu-selected-color;
}
.mx_DateSeparator > div {

View file

@ -38,3 +38,7 @@ limitations under the License.
max-width: 100%;
width: 450px;
}
.mx_DisambiguatedProfile ~ .mx_MLocationBody {
margin-top: 6px; // See: https://github.com/matrix-org/matrix-react-sdk/pull/8442
}

View file

@ -25,14 +25,10 @@ limitations under the License.
.mx_UserInfo {
.mx_EncryptionPanel_cancel {
mask: url('$(res)/img/feather-customised/cancel.svg');
mask-repeat: no-repeat;
mask-position: center;
mask-size: cover;
@mixin customisedCancelButton;
width: 14px;
height: 14px;
background-color: $settings-subsection-fg-color;
cursor: pointer;
position: absolute;
z-index: 100;
top: 14px;

View file

@ -50,6 +50,12 @@ $threadInfoLineHeight: calc(2 * $font-12px); // See: _commons.scss
.mx_EventTile_receiptSending::before {
mask-image: url('$(res)/img/element-icons/circle-sending.svg');
}
&[data-layout=group] {
.mx_EventTile_line {
line-height: var(--GroupLayout-EventTile-line-height);
}
}
}
.mx_EventTile:not([data-layout=bubble]) {
@ -263,8 +269,15 @@ $threadInfoLineHeight: calc(2 * $font-12px); // See: _commons.scss
}
}
.mx_GenericEventListSummary:not([data-layout=bubble]) .mx_EventTile_line {
padding-left: $left-gutter;
.mx_GenericEventListSummary:not([data-layout=bubble]) {
.mx_EventTile_line {
padding-left: $left-gutter;
line-height: normal;
.mx_RedactedBody {
line-height: 1; // remove spacing between lines
}
}
}
.mx_EventTile:not([data-layout=bubble]).mx_EventTile_info .mx_EventTile_line,
@ -842,12 +855,6 @@ $threadInfoLineHeight: calc(2 * $font-12px); // See: _commons.scss
padding-right: 0;
}
.mx_ReplyChain {
.mx_MLocationBody {
margin-top: 6px; // See: https://github.com/matrix-org/matrix-react-sdk/pull/8442
}
}
&:not([data-layout=bubble]) {
padding-top: $spacing-16;
}

View file

@ -18,6 +18,8 @@ limitations under the License.
$left-gutter: 64px;
.mx_GroupLayout {
--GroupLayout-EventTile-line-height: $font-22px;
.mx_EventTile {
> .mx_DisambiguatedProfile {
line-height: $font-20px;
@ -33,10 +35,14 @@ $left-gutter: 64px;
position: absolute; // for modern layout
}
.mx_EventTile_line, .mx_EventTile_reply {
.mx_EventTile_line,
.mx_EventTile_reply {
padding-top: 1px;
padding-bottom: 3px;
line-height: $font-22px;
}
.mx_EventTile_reply {
line-height: var(--GroupLayout-EventTile-line-height);
}
}
}
@ -47,7 +53,8 @@ $left-gutter: 64px;
.mx_EventTile {
padding-top: 4px;
.mx_EventTile_line, .mx_EventTile_reply {
.mx_EventTile_line,
.mx_EventTile_reply {
padding-top: 0;
padding-bottom: 0;
}
@ -56,9 +63,12 @@ $left-gutter: 64px;
// same as the padding for non-compact .mx_EventTile.mx_EventTile_info
padding-top: 0px;
font-size: $font-13px;
.mx_EventTile_line, .mx_EventTile_reply {
.mx_EventTile_line,
.mx_EventTile_reply {
line-height: $font-20px;
}
.mx_EventTile_avatar {
top: 4px;
}
@ -71,10 +81,13 @@ $left-gutter: 64px;
&.mx_EventTile_emote {
// add a bit more space for emotes so that avatars don't collide
padding-top: 8px;
.mx_EventTile_avatar {
top: 2px;
}
.mx_EventTile_line, .mx_EventTile_reply {
.mx_EventTile_line,
.mx_EventTile_reply {
padding-top: 0px;
padding-bottom: 1px;
}
@ -82,7 +95,9 @@ $left-gutter: 64px;
&.mx_EventTile_emote.mx_EventTile_continuation {
padding-top: 0;
.mx_EventTile_line, .mx_EventTile_reply {
.mx_EventTile_line,
.mx_EventTile_reply {
padding-top: 0px;
padding-bottom: 0px;
}

View file

@ -178,12 +178,6 @@ limitations under the License.
}
}
.mx_ContextualMenu {
.mx_MessageComposer_button {
padding-left: calc(var(--size) + 6px);
}
}
.mx_MessageComposer_button {
--size: 26px;
position: relative;
@ -192,20 +186,16 @@ limitations under the License.
line-height: var(--size);
width: auto;
padding-left: var(--size);
border-radius: 50%;
margin-right: 6px;
&:not(.mx_CallContextMenu_item) {
border-radius: 50%;
margin-right: 6px;
&:last-child {
margin-right: auto;
}
&:last-child {
margin-right: auto;
}
&::before {
content: '';
position: absolute;
top: 3px;
left: 3px;
height: 20px;
@ -399,18 +389,3 @@ limitations under the License.
left: 0;
}
}
.mx_MessageComposer_Menu .mx_CallContextMenu_item {
display: flex;
align-items: center;
max-width: unset;
margin: 7px 7px 7px 16px; // space out the buttons
}
.mx_MessageComposer_Menu .mx_ContextualMenu {
min-width: 150px;
width: max-content;
padding: 5px 10px 5px 0;
box-shadow: 0px 2px 9px rgba(0, 0, 0, 0.25);
border-radius: 8px;
}

View file

@ -16,12 +16,10 @@ limitations under the License.
.mx_ReplyPreview {
border: 1px solid $primary-hairline-color;
background: $background;
border-bottom: none;
border-radius: 8px 8px 0 0;
background: $background;
max-height: 50vh;
overflow: auto;
box-shadow: 0px -16px 32px $composer-shadow-color;
.mx_ReplyPreview_section {
border-bottom: 1px solid $primary-hairline-color;
@ -53,3 +51,12 @@ limitations under the License.
}
}
}
.mx_RoomView_body {
.mx_ReplyPreview {
// Add box-shadow to the reply preview on the main (left) panel only.
// It is not added to the preview on the (right) panel for threads and a chat with a maximized widget.
box-shadow: 0px -16px 32px $composer-shadow-color;
border-radius: 8px 8px 0 0;
}
}

View file

@ -38,6 +38,10 @@ limitations under the License.
margin-right: 10px;
}
.mx_RoomTile_details {
min-width: 0;
}
.mx_RoomTile_titleContainer {
height: 32px;
min-width: 0;

View file

@ -35,15 +35,10 @@ limitations under the License.
}
.mx_DialPadContextMenu_cancel {
@mixin customisedCancelButton;
float: right;
mask: url('$(res)/img/feather-customised/cancel.svg');
mask-repeat: no-repeat;
mask-position: center;
mask-size: cover;
width: 14px;
height: 14px;
background-color: $dialog-close-fg-color;
cursor: pointer;
}
.mx_DialPadContextMenu_header:focus-within {

View file

@ -45,15 +45,10 @@ limitations under the License.
}
.mx_DialPadModal_cancel {
@mixin customisedCancelButton;
float: right;
mask: url('$(res)/img/feather-customised/cancel.svg');
mask-repeat: no-repeat;
mask-position: center;
mask-size: cover;
width: 14px;
height: 14px;
background-color: $dialog-close-fg-color;
cursor: pointer;
margin-right: 16px;
}