imterah/element-portable
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Apply prettier formatting

Browse source
This commit is contained in:
Michael Weimann 2022-12-12 12:24:14 +01:00
parent 1cac306093
commit 526645c791
No known key found for this signature in database
GPG key ID: 53F535A266BB9584
1576 changed files with 65385 additions and 62478 deletions
Download patch file Download diff file Expand all files Collapse all files

24
res/css/views/rooms/_AppsDrawer.pcss
View file

@ -55,7 +55,7 @@ $MinWidth: 240px;
/* We then render the pill handle in an ::after to keep it in the handle's */
/* area without being a massive line across the screen */
&::after {
content: '';
content: "";
position: absolute;
border-radius: 3px;
@ -85,7 +85,7 @@ $MinWidth: 240px;
width: 4px;
border-radius: 4px;
content: '';
content: "";
background-color: $primary-content;
opacity: 0.8;
@ -231,7 +231,7 @@ $MinWidth: 240px;
&::before {
background-color: $muted-fg-color;
content: '';
content: "";
height: 24px;
mask-position: center;
mask-repeat: no-repeat;
@ -243,7 +243,7 @@ $MinWidth: 240px;
&:hover::after {
background-color: $panel-actions;
border-radius: 50%;
content: '';
content: "";
height: 24px;
left: 0;
position: absolute;
@ -264,11 +264,11 @@ $MinWidth: 240px;
}
&.mx_AppTileMenuBar_iconButton_popout::before {
mask-image: url('$(res)/img/feather-customised/widget/external-link.svg');
mask-image: url("$(res)/img/feather-customised/widget/external-link.svg");
}
&.mx_AppTileMenuBar_iconButton_menu::before {
mask-image: url('$(res)/img/element-icons/room/ellipsis.svg');
mask-image: url("$(res)/img/element-icons/room/ellipsis.svg");
}
}
@ -353,9 +353,9 @@ $MinWidth: 240px;
width: 12px;
height: 12px;
mask-position: center;
content: '';
content: "";
vertical-align: middle;
mask-image: url('$(res)/img/feather-customised/help-circle.svg');
mask-image: url("$(res)/img/feather-customised/help-circle.svg");
}
.mx_AppPermissionWarning_tooltip {
@ -398,8 +398,12 @@ $MinWidth: 240px;
}
@keyframes mx_AppLoading_spinner_fadeIn_animation {
from { opacity: 0; }
to { opacity: 1; }
from {
opacity: 0;
}
to {
opacity: 1;
}
}
.mx_AppLoading iframe {

8
res/css/views/rooms/_BasicMessageComposer.pcss
View file

@ -30,8 +30,12 @@ limitations under the License.
}
@keyframes visualbell {
from { background-color: $visual-bell-bg-color; }
to { background-color: $background; }
from {
background-color: $visual-bell-bg-color;
}
to {
background-color: $background;
}
}
&.mx_BasicMessageComposer_input_error {

13
res/css/views/rooms/_E2EIcon.pcss
View file

@ -25,7 +25,8 @@ limitations under the License.
.mx_E2EIcon_warning,
.mx_E2EIcon_normal,
.mx_E2EIcon_verified {
&::before, &::after {
&::before,
&::after {
content: "";
display: block;
position: absolute;
@ -42,7 +43,7 @@ limitations under the License.
/* white infill for the transparency */
.mx_E2EIcon::before {
background-color: #ffffff;
mask-image: url('$(res)/img/e2e/normal.svg');
mask-image: url("$(res)/img/e2e/normal.svg");
mask-repeat: no-repeat;
mask-position: center;
mask-size: 80%;
@ -50,7 +51,7 @@ limitations under the License.
/* transparent-looking border surrounding the shield for when overlain over avatars */
.mx_E2EIcon_bordered {
mask-image: url('$(res)/img/e2e/normal.svg');
mask-image: url("$(res)/img/e2e/normal.svg");
background-color: $header-panel-bg-color;
/* shrink the actual badge */
@ -64,16 +65,16 @@ limitations under the License.
}
.mx_E2EIcon_warning::after {
mask-image: url('$(res)/img/e2e/warning.svg');
mask-image: url("$(res)/img/e2e/warning.svg");
background-color: $alert;
}
.mx_E2EIcon_normal::after {
mask-image: url('$(res)/img/e2e/normal.svg');
mask-image: url("$(res)/img/e2e/normal.svg");
background-color: $header-panel-text-primary-color;
}
.mx_E2EIcon_verified::after {
mask-image: url('$(res)/img/e2e/verified.svg');
mask-image: url("$(res)/img/e2e/verified.svg");
background-color: $accent;
}

6
res/css/views/rooms/_EmojiButton.pcss
View file

@ -15,7 +15,7 @@ limitations under the License.
*/
.mx_EmojiButton {
@mixin composerButton 50%,$accent;
@mixin composerButton 50%, $accent;
}
.mx_EmojiButton_highlight {
@ -23,11 +23,11 @@ limitations under the License.
}
.mx_EmojiButton_icon::before {
mask-image: url('$(res)/img/element-icons/room/composer/emoji.svg');
mask-image: url("$(res)/img/element-icons/room/composer/emoji.svg");
}
.mx_MessageComposer_wysiwyg {
.mx_EmojiButton {
@mixin composerButton 5px,$tertiary-content;
@mixin composerButton 5px, $tertiary-content;
}
}

2
res/css/views/rooms/_EntityTile.pcss
View file

@ -39,7 +39,7 @@ limitations under the License.
position: absolute;
top: calc(50% - 8px); /* center */
right: -8px;
mask: url('$(res)/img/member_chevron.png');
mask: url("$(res)/img/member_chevron.png");
mask-repeat: no-repeat;
width: 16px;
height: 16px;

17
res/css/views/rooms/_EventBubbleTile.pcss
View file

@ -15,7 +15,9 @@ limitations under the License.
*/
.mx_RoomView_body[data-layout="bubble"] {
.mx_RoomView_timeline, .mx_RoomView_statusArea, .mx_MessageComposer {
.mx_RoomView_timeline,
.mx_RoomView_statusArea,
.mx_MessageComposer {
width: 100%;
max-width: 1200px;
margin: 0 auto;
@ -75,7 +77,7 @@ limitations under the License.
}
&::before {
content: '';
content: "";
position: absolute;
top: -1px;
bottom: -1px;
@ -87,7 +89,6 @@ limitations under the License.
&:hover,
&.mx_EventTile_selected {
&::before {
background: $eventbubble-bg-hover;
}
@ -478,7 +479,7 @@ limitations under the License.
"reply reply" auto
"shield body" auto
"shield link" auto
/ auto 1fr;
/ auto 1fr;
.mx_UnknownBody,
.mx_EventTile_keyRequestInfo,
@ -512,7 +513,7 @@ limitations under the License.
grid-template:
"shield source" auto
"shield link" auto
/ auto 1fr;
/ auto 1fr;
.mx_ViewSourceEvent {
grid-area: source;
@ -538,7 +539,8 @@ limitations under the License.
padding-right: 60px; /* align with bubbles text */
font-style: italic;
> a { /* timestamp anchor wrapper */
> a {
/* timestamp anchor wrapper */
align-self: center;
bottom: unset;
top: unset;
@ -601,7 +603,8 @@ limitations under the License.
bottom: unset;
align-self: center;
.mx_MessageTimestamp, &.mx_MessageTimestamp {
.mx_MessageTimestamp,
&.mx_MessageTimestamp {
vertical-align: middle;
}
}

50
res/css/views/rooms/_EventTile.pcss
View file

@ -50,7 +50,7 @@ $left-gutter: 64px;
mask-size: 16px;
width: 16px;
height: 16px;
content: '';
content: "";
position: absolute;
top: 0;
left: 0;
@ -59,11 +59,11 @@ $left-gutter: 64px;
}
.mx_EventTile_receiptSent::before {
mask-image: url('$(res)/img/element-icons/circle-sent.svg');
mask-image: url("$(res)/img/element-icons/circle-sent.svg");
}
.mx_EventTile_receiptSending::before {
mask-image: url('$(res)/img/element-icons/circle-sending.svg');
mask-image: url("$(res)/img/element-icons/circle-sending.svg");
}
.mx_EventTile_content {
@ -225,9 +225,8 @@ $left-gutter: 64px;
&.mx_EventTile_selected {
> .mx_EventTile_line {
/* TODO: ultimately we probably want some transition on here. */
box-shadow:
inset var(--EventTile-box-shadow-offset-x) 0 0
var(--EventTile-box-shadow-spread-radius) $accent;
box-shadow: inset var(--EventTile-box-shadow-offset-x) 0 0 var(--EventTile-box-shadow-spread-radius)
$accent;
}
}
@ -247,21 +246,18 @@ $left-gutter: 64px;
}
&.mx_EventTile_verified .mx_EventTile_line {
box-shadow:
inset var(--EventTile-box-shadow-offset-x) 0 0
var(--EventTile-box-shadow-spread-radius) $e2e-verified-color;
box-shadow: inset var(--EventTile-box-shadow-offset-x) 0 0 var(--EventTile-box-shadow-spread-radius)
$e2e-verified-color;
}
&.mx_EventTile_unverified .mx_EventTile_line {
box-shadow:
inset var(--EventTile-box-shadow-offset-x) 0 0
var(--EventTile-box-shadow-spread-radius) $e2e-unverified-color;
box-shadow: inset var(--EventTile-box-shadow-offset-x) 0 0 var(--EventTile-box-shadow-spread-radius)
$e2e-unverified-color;
}
&.mx_EventTile_unknown .mx_EventTile_line {
box-shadow:
inset var(--EventTile-box-shadow-offset-x) 0 0
var(--EventTile-box-shadow-spread-radius) $e2e-unknown-color;
box-shadow: inset var(--EventTile-box-shadow-offset-x) 0 0 var(--EventTile-box-shadow-spread-radius)
$e2e-unknown-color;
}
}
}
@ -499,8 +495,9 @@ $left-gutter: 64px;
> .mx_EventTile_line {
/* 15 px of padding */
/* stylelint-disable-next-line declaration-colon-space-after */
padding-left:
calc(var(--name-width) + var(--icon-width) + $MessageTimestamp_width + 3 * var(--right-padding));
padding-left: calc(
var(--name-width) + var(--icon-width) + $MessageTimestamp_width + 3 * var(--right-padding)
);
}
}
@ -618,7 +615,8 @@ $left-gutter: 64px;
*/
/* Override nested lists being lower-roman */
ol ol, ul ol {
ol ol,
ul ol {
list-style-type: revert;
}
}
@ -679,12 +677,12 @@ $left-gutter: 64px;
}
&.mx_EventTile_e2eIcon_warning::after {
mask-image: url('$(res)/img/e2e/warning.svg');
mask-image: url("$(res)/img/e2e/warning.svg");
background-color: $alert;
}
&.mx_EventTile_e2eIcon_normal::after {
mask-image: url('$(res)/img/e2e/normal.svg');
mask-image: url("$(res)/img/e2e/normal.svg");
background-color: $header-panel-text-primary-color;
}
}
@ -845,7 +843,7 @@ $left-gutter: 64px;
.mx_EventTile:hover .mx_MessageActionBar,
.mx_EventTile.mx_EventTile_actionBarFocused .mx_MessageActionBar,
[data-whatinput='keyboard'] .mx_EventTile:focus-within .mx_MessageActionBar,
[data-whatinput="keyboard"] .mx_EventTile:focus-within .mx_MessageActionBar,
.mx_EventTile.focus-visible:focus-within .mx_MessageActionBar {
visibility: visible;
}
@ -854,7 +852,7 @@ $left-gutter: 64px;
/* is less pretty, but is easier to target because otherwise we need to define the */
/* animation for when it's shown which means duplicating the style definition in */
/* multiple places. */
.mx_EventTile:not(:hover):not(.mx_EventTile_actionBarFocused):not([data-whatinput='keyboard'] :focus-within) {
.mx_EventTile:not(:hover):not(.mx_EventTile_actionBarFocused):not([data-whatinput="keyboard"] :focus-within) {
&:not(.focus-visible:focus-within) .mx_MessageActionBar .mx_Indicator {
animation: none;
}
@ -1130,7 +1128,8 @@ $left-gutter: 64px;
.mx_ReplyChain_wrapper {
.mx_MLocationBody,
.mx_UnknownBody { /* Error message inside ReplyTile */
.mx_UnknownBody {
/* Error message inside ReplyTile */
margin-inline: unset;
}
}
@ -1316,8 +1315,9 @@ $left-gutter: 64px;
&[data-shape="ThreadsList"][data-notification]::before,
.mx_NotificationBadge {
/* stylelint-disable-next-line declaration-colon-space-after */
inset-block-start:
calc($notification-inset-block-start - var(--MatrixChat_useCompactLayout_group-padding-top));
inset-block-start: calc(
$notification-inset-block-start - var(--MatrixChat_useCompactLayout_group-padding-top)
);
}
}
}

2
res/css/views/rooms/_HistoryTile.pcss
View file

@ -19,6 +19,6 @@ limitations under the License.
&::before {
background-color: $header-panel-text-primary-color;
mask-image: url('$(res)/img/element-icons/hide.svg');
mask-image: url("$(res)/img/element-icons/hide.svg");
}
}

3
res/css/views/rooms/_IRCLayout.pcss
View file

@ -65,7 +65,8 @@ $irc-line-height: $font-18px;
align-items: center;
/* Need to use important to override the js provided height and width values. */
> .mx_BaseAvatar, > .mx_BaseAvatar > * {
> .mx_BaseAvatar,
> .mx_BaseAvatar > * {
height: $font-14px !important;
width: $font-14px !important;
font-size: $font-10px !important;

2
res/css/views/rooms/_JumpToBottomButton.pcss
View file

@ -68,7 +68,7 @@ limitations under the License.
bottom: 0;
left: 0;
right: 0;
mask-image: url('$(res)/img/element-icons/message/chevron-up.svg');
mask-image: url("$(res)/img/element-icons/message/chevron-up.svg");
mask-repeat: no-repeat;
mask-size: 20px;
mask-position: center 6px;

8
res/css/views/rooms/_LiveContentSummary.pcss
View file

@ -21,7 +21,7 @@ limitations under the License.
&::before {
display: inline-block;
vertical-align: text-bottom;
content: '';
content: "";
background-color: $secondary-content;
mask-size: 16px;
width: 16px;
@ -30,7 +30,7 @@ limitations under the License.
}
&.mx_LiveContentSummary_text_video::before {
mask-image: url('$(res)/img/element-icons/call/video-call.svg');
mask-image: url("$(res)/img/element-icons/call/video-call.svg");
}
&.mx_LiveContentSummary_text_active {
@ -45,9 +45,9 @@ limitations under the License.
.mx_LiveContentSummary_participants::before {
display: inline-block;
vertical-align: text-bottom;
content: '';
content: "";
background-color: $secondary-content;
mask-image: url('$(res)/img/element-icons/group-members.svg');
mask-image: url("$(res)/img/element-icons/group-members.svg");
mask-size: 16px;
width: 16px;
height: 16px;

2
res/css/views/rooms/_MemberInfo.pcss
View file

@ -36,7 +36,7 @@ limitations under the License.
width: 16px;
padding: 10px 0 10px 10px;
cursor: pointer;
mask-image: url('$(res)/img/minimise.svg');
mask-image: url("$(res)/img/minimise.svg");
mask-repeat: no-repeat;
mask-position: 16px center;
background-color: $header-panel-text-primary-color;

4
res/css/views/rooms/_MemberList.pcss
View file

@ -98,10 +98,10 @@ limitations under the License.
display: inline-flex;
&::before {
content: '';
content: "";
display: inline-block;
background-color: $button-fg-color;
mask-image: url('$(res)/img/element-icons/room/invite.svg');
mask-image: url("$(res)/img/element-icons/room/invite.svg");
mask-position: center;
mask-repeat: no-repeat;
mask-size: 20px;

38
res/css/views/rooms/_MessageComposer.pcss
View file

@ -135,8 +135,12 @@ limitations under the License.
}
@keyframes visualbell {
from { background-color: $visual-bell-bg-color; }
to { background-color: $background; }
from {
background-color: $visual-bell-bg-color;
}
to {
background-color: $background;
}
}
.mx_MessageComposer_input_error {
@ -170,7 +174,7 @@ limitations under the License.
.mx_MessageComposer_input textarea::-moz-placeholder {
line-height: 100%;
color: $accent;
opacity: 1.0;
opacity: 1;
}
.mx_MessageComposer_input textarea::-webkit-input-placeholder {
color: $accent;
@ -181,7 +185,7 @@ limitations under the License.
}
.mx_MessageComposer_button {
@mixin composerButton 50%,$accent;
@mixin composerButton 50%, $accent;
&:last-child {
margin-right: auto;
@ -223,7 +227,7 @@ limitations under the License.
}
.mx_MessageComposer_button {
@mixin composerButton 5px,$tertiary-content;
@mixin composerButton 5px, $tertiary-content;
&.mx_MessageComposer_closeButtonMenu {
&::after {
@ -242,39 +246,39 @@ limitations under the License.
}
.mx_MessageComposer_upload::before {
mask-image: url('$(res)/img/element-icons/room/composer/attach.svg');
mask-image: url("$(res)/img/element-icons/room/composer/attach.svg");
}
.mx_MessageComposer_poll::before {
mask-image: url('$(res)/img/element-icons/room/composer/poll.svg');
mask-image: url("$(res)/img/element-icons/room/composer/poll.svg");
}
.mx_MessageComposer_voiceMessage::before {
mask-image: url('$(res)/img/voip/mic-on-mask.svg');
mask-image: url("$(res)/img/voip/mic-on-mask.svg");
}
.mx_MessageComposer_voiceBroadcast::before {
mask-image: url('$(res)/img/element-icons/live.svg');
mask-image: url("$(res)/img/element-icons/live.svg");
}
.mx_MessageComposer_plain_text::before {
mask-image: url('$(res)/img/element-icons/room/composer/plain_text.svg');
mask-image: url("$(res)/img/element-icons/room/composer/plain_text.svg");
}
.mx_MessageComposer_rich_text::before {
mask-image: url('$(res)/img/element-icons/room/composer/rich_text.svg');
mask-image: url("$(res)/img/element-icons/room/composer/rich_text.svg");
}
.mx_MessageComposer_location::before {
mask-image: url('$(res)/img/element-icons/room/composer/location.svg');
mask-image: url("$(res)/img/element-icons/room/composer/location.svg");
}
.mx_MessageComposer_stickers::before {
mask-image: url('$(res)/img/element-icons/room/composer/sticker.svg');
mask-image: url("$(res)/img/element-icons/room/composer/sticker.svg");
}
.mx_MessageComposer_buttonMenu::before {
mask-image: url('$(res)/img/image-view/more.svg');
mask-image: url("$(res)/img/image-view/more.svg");
}
.mx_MessageComposer_sendMessage {
@ -292,13 +296,13 @@ limitations under the License.
top: 8px;
left: 9px;
mask-image: url('$(res)/img/element-icons/send-message.svg');
mask-image: url("$(res)/img/element-icons/send-message.svg");
mask-repeat: no-repeat;
mask-size: contain;
mask-position: center;
background-color: $button-fg-color;
content: '';
content: "";
}
}
@ -359,7 +363,7 @@ limitations under the License.
.mx_MessageComposer_formatbar_markdown,
.mx_MessageComposer_input_markdownIndicator {
cursor: pointer;
mask-image: url('$(res)/img/markdown.svg');
mask-image: url("$(res)/img/markdown.svg");
mask-size: contain;
mask-position: center;
mask-repeat: no-repeat;

14
res/css/views/rooms/_MessageComposerFormatBar.pcss
View file

@ -55,7 +55,7 @@ limitations under the License.
}
.mx_MessageComposerFormatBar_button::after {
content: '';
content: "";
position: absolute;
top: 0;
left: 0;
@ -71,27 +71,27 @@ limitations under the License.
}
.mx_MessageComposerFormatBar_buttonIconBold::after {
mask-image: url('$(res)/img/element-icons/room/format-bar/bold.svg');
mask-image: url("$(res)/img/element-icons/room/format-bar/bold.svg");
}
.mx_MessageComposerFormatBar_buttonIconItalic::after {
mask-image: url('$(res)/img/element-icons/room/format-bar/italic.svg');
mask-image: url("$(res)/img/element-icons/room/format-bar/italic.svg");
}
.mx_MessageComposerFormatBar_buttonIconStrikethrough::after {
mask-image: url('$(res)/img/element-icons/room/format-bar/strikethrough.svg');
mask-image: url("$(res)/img/element-icons/room/format-bar/strikethrough.svg");
}
.mx_MessageComposerFormatBar_buttonIconQuote::after {
mask-image: url('$(res)/img/element-icons/room/format-bar/quote.svg');
mask-image: url("$(res)/img/element-icons/room/format-bar/quote.svg");
}
.mx_MessageComposerFormatBar_buttonIconCode::after {
mask-image: url('$(res)/img/element-icons/room/format-bar/code.svg');
mask-image: url("$(res)/img/element-icons/room/format-bar/code.svg");
}
.mx_MessageComposerFormatBar_buttonIconInsertLink::after {
mask-image: url('$(res)/img/element-icons/link.svg');
mask-image: url("$(res)/img/element-icons/link.svg");
mask-size: 18px;
}
}

4
res/css/views/rooms/_NewRoomIntro.pcss
View file

@ -34,7 +34,7 @@ limitations under the License.
display: inline-block;
&:not(.mx_AccessibleButton_kind_primary_outline)::before {
content: '';
content: "";
display: inline-block;
background-color: $button-fg-color;
mask-position: center;
@ -48,7 +48,7 @@ limitations under the License.
}
.mx_NewRoomIntro_inviteButton::before {
mask-image: url('$(res)/img/element-icons/room/invite.svg');
mask-image: url("$(res)/img/element-icons/room/invite.svg");
}
}

2
res/css/views/rooms/_PinnedEventTile.pcss
View file

@ -77,7 +77,7 @@ limitations under the License.
mask-position: center;
mask-size: 8px;
mask-repeat: no-repeat;
mask-image: url('$(res)/img/image-view/close.svg');
mask-image: url("$(res)/img/image-view/close.svg");
}
}

4
res/css/views/rooms/_ReadReceiptGroup.pcss
View file

@ -57,9 +57,7 @@ limitations under the License.
border-radius: 100%;
will-change: left, top;
transition:
left var(--transition-short) ease-out,
top var(--transition-standard) ease-out;
transition: left var(--transition-short) ease-out, top var(--transition-standard) ease-out;
}
}
}

2
res/css/views/rooms/_RecentlyViewedButton.pcss
View file

@ -19,7 +19,7 @@ limitations under the License.
width: max-content;
max-width: 240px;
max-height: 400px;
border: 1px solid rgba($primary-content, .1);
border: 1px solid rgba($primary-content, 0.1);
border-radius: 8px;
box-shadow: 0 8px 4px rgba(0, 0, 0, 0.08);
display: flex;

2
res/css/views/rooms/_ReplyPreview.pcss
View file

@ -39,7 +39,7 @@ limitations under the License.
.mx_ReplyPreview_header_cancel {
background-color: $primary-content;
mask: url('$(res)/img/cancel.svg');
mask: url("$(res)/img/cancel.svg");
mask-repeat: no-repeat;
mask-position: center;
mask-size: 18px;

8
res/css/views/rooms/_ReplyTile.pcss
View file

@ -30,7 +30,7 @@ limitations under the License.
> a {
display: grid;
grid-template:
"sender" auto
"sender" auto
"message" auto
/ auto;
text-decoration: none;
@ -49,7 +49,6 @@ limitations under the License.
.mx_RedactedBody,
.mx_HiddenBody {
padding: 4px 0 2px 20px;
&::before {
@ -76,7 +75,8 @@ limitations under the License.
}
// Hide line numbers and edited indicator
.mx_EventTile_lineNumbers, .mx_EventTile_edited {
.mx_EventTile_lineNumbers,
.mx_EventTile_edited {
display: none;
}
@ -110,7 +110,7 @@ limitations under the License.
/* Render replies to emotes inline with the sender avatar */
grid-template:
"sender message" auto
/ max-content auto;
/ max-content auto;
gap: 4px; // increase spacing
}

28
res/css/views/rooms/_RoomHeader.pcss
View file

@ -27,7 +27,7 @@ limitations under the License.
height: 14px;
width: 14px;
background-color: $secondary-content;
mask-image: url('$(res)/img/element-icons/call/video-call.svg');
mask-image: url("$(res)/img/element-icons/call/video-call.svg");
mask-size: 100%;
}
@ -125,7 +125,7 @@ limitations under the License.
mask-position: center;
mask-size: 20px;
mask-repeat: no-repeat;
mask-image: url('$(res)/img/feather-customised/chevron-down.svg');
mask-image: url("$(res)/img/feather-customised/chevron-down.svg");
background-color: $tertiary-content;
}
@ -200,7 +200,7 @@ limitations under the License.
border-radius: 100%;
&::before {
content: '';
content: "";
position: absolute;
top: 4px; /* center with parent of 32px */
left: 4px; /* center with parent of 32px */
@ -221,12 +221,12 @@ limitations under the License.
}
.mx_RoomHeader_forgetButton::before {
mask-image: url('$(res)/img/element-icons/leave.svg');
mask-image: url("$(res)/img/element-icons/leave.svg");
width: 26px;
}
.mx_RoomHeader_appsButton::before {
mask-image: url('$(res)/img/element-icons/room/apps.svg');
mask-image: url("$(res)/img/element-icons/room/apps.svg");
}
.mx_RoomHeader_appsButton_highlight::before {
@ -234,15 +234,15 @@ limitations under the License.
}
.mx_RoomHeader_searchButton::before {
mask-image: url('$(res)/img/element-icons/room/search-inset.svg');
mask-image: url("$(res)/img/element-icons/room/search-inset.svg");
}
.mx_RoomHeader_inviteButton::before {
mask-image: url('$(res)/img/element-icons/room/invite.svg');
mask-image: url("$(res)/img/element-icons/room/invite.svg");
}
.mx_RoomHeader_voiceCallButton::before {
mask-image: url('$(res)/img/element-icons/call/voice-call.svg');
mask-image: url("$(res)/img/element-icons/call/voice-call.svg");
/* The call button SVG is padded slightly differently, so match it up to the size */
/* of the other icons */
@ -251,31 +251,31 @@ limitations under the License.
}
.mx_RoomHeader_videoCallButton::before {
mask-image: url('$(res)/img/element-icons/call/video-call.svg');
mask-image: url("$(res)/img/element-icons/call/video-call.svg");
}
.mx_RoomHeader_layoutButton--freedom::before,
.mx_RoomHeader_freedomIcon::before {
mask-image: url('$(res)/img/element-icons/call/freedom.svg');
mask-image: url("$(res)/img/element-icons/call/freedom.svg");
}
.mx_RoomHeader_layoutButton--spotlight::before,
.mx_RoomHeader_spotlightIcon::before {
mask-image: url('$(res)/img/element-icons/call/spotlight.svg');
mask-image: url("$(res)/img/element-icons/call/spotlight.svg");
}
.mx_RoomHeader_closeButton::before {
mask-image: url('$(res)/img/cancel.svg');
mask-image: url("$(res)/img/cancel.svg");
mask-size: 20px;
mask-position: center;
}
.mx_RoomHeader_minimiseButton::before {
mask-image: url('$(res)/img/element-icons/reduce.svg');
mask-image: url("$(res)/img/element-icons/reduce.svg");
}
.mx_RoomHeader_layoutMenu .mx_IconizedContextMenu_icon::before {
content: '';
content: "";
width: 16px;
height: 16px;
display: block;

22
res/css/views/rooms/_RoomList.pcss
View file

@ -19,28 +19,28 @@ limitations under the License.
}
.mx_RoomList_iconPlus::before {
mask-image: url('$(res)/img/element-icons/roomlist/plus-circle.svg');
mask-image: url("$(res)/img/element-icons/roomlist/plus-circle.svg");
}
.mx_RoomList_iconNewRoom::before {
mask-image: url('$(res)/img/element-icons/roomlist/hash-plus.svg');
mask-image: url("$(res)/img/element-icons/roomlist/hash-plus.svg");
}
.mx_RoomList_iconNewVideoRoom::before {
mask-image: url('$(res)/img/element-icons/roomlist/hash-video.svg');
mask-image: url("$(res)/img/element-icons/roomlist/hash-video.svg");
}
.mx_RoomList_iconAddExistingRoom::before {
mask-image: url('$(res)/img/element-icons/roomlist/hash.svg');
mask-image: url("$(res)/img/element-icons/roomlist/hash.svg");
}
.mx_RoomList_iconExplore::before {
mask-image: url('$(res)/img/element-icons/roomlist/hash-search.svg');
mask-image: url("$(res)/img/element-icons/roomlist/hash-search.svg");
}
.mx_RoomList_iconDialpad::before {
mask-image: url('$(res)/img/element-icons/roomlist/dialpad.svg');
mask-image: url("$(res)/img/element-icons/roomlist/dialpad.svg");
}
.mx_RoomList_iconStartChat::before {
mask-image: url('$(res)/img/element-icons/roomlist/member-plus.svg');
mask-image: url("$(res)/img/element-icons/roomlist/member-plus.svg");
}
.mx_RoomList_iconInvite::before {
mask-image: url('$(res)/img/element-icons/room/share.svg');
mask-image: url("$(res)/img/element-icons/room/share.svg");
}
.mx_RoomList_explorePrompt {
@ -67,7 +67,7 @@ limitations under the License.
border-radius: 4px;
&::before {
content: '';
content: "";
width: 16px;
height: 16px;
position: absolute;
@ -80,11 +80,11 @@ limitations under the License.
}
&.mx_RoomList_explorePrompt_startChat::before {
mask-image: url('$(res)/img/element-icons/feedback.svg');
mask-image: url("$(res)/img/element-icons/feedback.svg");
}
&.mx_RoomList_explorePrompt_explore::before {
mask-image: url('$(res)/img/element-icons/roomlist/explore.svg');
mask-image: url("$(res)/img/element-icons/roomlist/explore.svg");
}
}
}

20
res/css/views/rooms/_RoomListHeader.pcss
View file

@ -41,7 +41,7 @@ limitations under the License.
}
&::before {
content: '';
content: "";
width: 20px;
height: 20px;
top: 3px;
@ -51,7 +51,7 @@ limitations under the License.
mask-size: contain;
mask-repeat: no-repeat;
background-color: $tertiary-content;
mask-image: url('$(res)/img/feather-customised/chevron-down.svg');
mask-image: url("$(res)/img/feather-customised/chevron-down.svg");
}
&[aria-expanded="true"] {
@ -76,7 +76,7 @@ limitations under the License.
flex-shrink: 0;
&::before {
content: '';
content: "";
width: 16px;
height: 16px;
position: absolute;
@ -84,7 +84,7 @@ limitations under the License.
mask-size: contain;
mask-repeat: no-repeat;
background-color: $secondary-content;
mask-image: url('$(res)/img/element-icons/roomlist/plus.svg');
mask-image: url("$(res)/img/element-icons/roomlist/plus.svg");
}
&:hover {
@ -98,20 +98,20 @@ limitations under the License.
}
.mx_RoomListHeader_iconInvite::before {
mask-image: url('$(res)/img/element-icons/room/invite.svg');
mask-image: url("$(res)/img/element-icons/room/invite.svg");
}
.mx_RoomListHeader_iconStartChat::before {
mask-image: url('$(res)/img/element-icons/roomlist/member-plus.svg');
mask-image: url("$(res)/img/element-icons/roomlist/member-plus.svg");
}
.mx_RoomListHeader_iconNewRoom::before {
mask-image: url('$(res)/img/element-icons/roomlist/hash-plus.svg');
mask-image: url("$(res)/img/element-icons/roomlist/hash-plus.svg");
}
.mx_RoomListHeader_iconNewVideoRoom::before {
mask-image: url('$(res)/img/element-icons/roomlist/hash-video.svg');
mask-image: url("$(res)/img/element-icons/roomlist/hash-video.svg");
}
.mx_RoomListHeader_iconExplore::before {
mask-image: url('$(res)/img/element-icons/roomlist/hash-search.svg');
mask-image: url("$(res)/img/element-icons/roomlist/hash-search.svg");
}
.mx_RoomListHeader_iconPlus::before {
mask-image: url('$(res)/img/element-icons/plus.svg');
mask-image: url("$(res)/img/element-icons/plus.svg");
}

7
res/css/views/rooms/_RoomPreviewCard.pcss
View file

@ -42,7 +42,7 @@ limitations under the License.
mask-repeat: no-repeat;
mask-position: center;
mask-size: contain;
mask-image: url('$(res)/img/element-icons/room/room-summary.svg');
mask-image: url("$(res)/img/element-icons/room/room-summary.svg");
background-color: $secondary-content;
}
}
@ -71,7 +71,8 @@ limitations under the License.
align-items: center;
.mx_RoomAvatar_isSpaceRoom {
&.mx_BaseAvatar_image, .mx_BaseAvatar_image {
&.mx_BaseAvatar_image,
.mx_BaseAvatar_image {
border-radius: 12px;
}
}
@ -95,7 +96,7 @@ limitations under the License.
mask-size: 22px;
mask-position: center;
mask-repeat: no-repeat;
mask-image: url('$(res)/img/element-icons/call/video-call.svg');
mask-image: url("$(res)/img/element-icons/call/video-call.svg");
}
}

22
res/css/views/rooms/_RoomSublist.pcss
View file

@ -109,7 +109,7 @@ limitations under the License.
border-radius: 8px;
&::before {
content: '';
content: "";
width: 16px;
height: 16px;
position: absolute;
@ -135,11 +135,11 @@ limitations under the License.
}
.mx_RoomSublist_auxButton::before {
mask-image: url('$(res)/img/element-icons/roomlist/plus.svg');
mask-image: url("$(res)/img/element-icons/roomlist/plus.svg");
}
.mx_RoomSublist_menuButton::before {
mask-image: url('$(res)/img/element-icons/context-menu.svg');
mask-image: url("$(res)/img/element-icons/context-menu.svg");
}
.mx_RoomSublist_headerText {
@ -162,7 +162,7 @@ limitations under the License.
margin-right: 6px;
&::before {
content: '';
content: "";
width: 18px;
height: 18px;
position: absolute;
@ -170,7 +170,7 @@ limitations under the License.
mask-size: contain;
mask-repeat: no-repeat;
background-color: $tertiary-content;
mask-image: url('$(res)/img/feather-customised/chevron-down.svg');
mask-image: url("$(res)/img/feather-customised/chevron-down.svg");
}
&.mx_RoomSublist_collapseBtn_collapsed::before {
@ -247,7 +247,8 @@ limitations under the License.
bottom: 0 !important; /* override from library */
}
&:hover, &.mx_RoomSublist_hasMenuOpen {
&:hover,
&.mx_RoomSublist_hasMenuOpen {
.mx_RoomSublist_resizerHandle {
opacity: 0.8;
background-color: $primary-content;
@ -285,7 +286,7 @@ limitations under the License.
.mx_RoomSublist_showMoreButtonChevron,
.mx_RoomSublist_showLessButtonChevron {
mask-image: url('$(res)/img/feather-customised/chevron-down.svg');
mask-image: url("$(res)/img/feather-customised/chevron-down.svg");
}
.mx_RoomSublist_showLessButtonChevron {
@ -402,7 +403,8 @@ limitations under the License.
margin-bottom: 4px;
}
.mx_StyledRadioButton, .mx_Checkbox {
.mx_StyledRadioButton,
.mx_Checkbox {
margin-top: 8px;
}
}
@ -418,11 +420,11 @@ limitations under the License.
width: 100%;
height: 100%;
content: '';
content: "";
position: absolute;
mask-repeat: repeat-y;
mask-size: auto 48px;
mask-image: url('$(res)/img/element-icons/roomlist/skeleton-ui.svg');
mask-image: url("$(res)/img/element-icons/roomlist/skeleton-ui.svg");
}
}

53
res/css/views/rooms/_RoomTile.pcss
View file

@ -34,7 +34,8 @@ limitations under the License.
border-radius: 8px;
}
.mx_DecoratedRoomAvatar, .mx_RoomTile_avatarContainer {
.mx_DecoratedRoomAvatar,
.mx_RoomTile_avatarContainer {
margin-right: 10px;
}
@ -54,7 +55,8 @@ limitations under the License.
flex-direction: column;
justify-content: center;
.mx_RoomTile_title, .mx_RoomTile_subtitle {
.mx_RoomTile_title,
.mx_RoomTile_subtitle {
width: 100%;
/* Ellipsize any text overflow */
@ -120,7 +122,7 @@ limitations under the License.
&::before {
top: 2px;
left: 2px;
content: '';
content: "";
width: 16px;
height: 16px;
position: absolute;
@ -137,7 +139,7 @@ limitations under the License.
}
.mx_RoomTile_menuButton::before {
mask-image: url('$(res)/img/element-icons/context-menu.svg');
mask-image: url("$(res)/img/element-icons/context-menu.svg");
}
&:not(.mx_RoomTile_minimized) {
@ -163,7 +165,8 @@ limitations under the License.
align-items: center;
position: relative;
.mx_DecoratedRoomAvatar, .mx_RoomTile_avatarContainer {
.mx_DecoratedRoomAvatar,
.mx_RoomTile_avatarContainer {
margin-right: 0;
}
}
@ -171,80 +174,80 @@ limitations under the License.
/* We use these both in context menus and the room tiles */
.mx_RoomTile_iconBell::before {
mask-image: url('$(res)/img/element-icons/notifications.svg');
mask-image: url("$(res)/img/element-icons/notifications.svg");
}
.mx_RoomTile_iconBellDot::before {
mask-image: url('$(res)/img/element-icons/roomlist/notifications-default.svg');
mask-image: url("$(res)/img/element-icons/roomlist/notifications-default.svg");
}
.mx_RoomTile_iconBellCrossed::before {
mask-image: url('$(res)/img/element-icons/roomlist/notifications-off.svg');
mask-image: url("$(res)/img/element-icons/roomlist/notifications-off.svg");
}
.mx_RoomTile_iconBellMentions::before {
mask-image: url('$(res)/img/element-icons/roomlist/notifications-dm.svg');
mask-image: url("$(res)/img/element-icons/roomlist/notifications-dm.svg");
}
.mx_RoomTile_contextMenu {
.mx_RoomTile_iconStar::before {
mask-image: url('$(res)/img/element-icons/roomlist/favorite.svg');
mask-image: url("$(res)/img/element-icons/roomlist/favorite.svg");
}
.mx_RoomTile_iconArrowDown::before {
mask-image: url('$(res)/img/element-icons/roomlist/low-priority.svg');
mask-image: url("$(res)/img/element-icons/roomlist/low-priority.svg");
}
.mx_RoomTile_iconNotificationsDefault::before {
mask-image: url('$(res)/img/element-icons/notifications.svg');
mask-image: url("$(res)/img/element-icons/notifications.svg");
}
.mx_RoomTile_iconNotificationsAllMessages::before {
mask-image: url('$(res)/img/element-icons/roomlist/notifications-default.svg');
mask-image: url("$(res)/img/element-icons/roomlist/notifications-default.svg");
}
.mx_RoomTile_iconNotificationsMentionsKeywords::before {
mask-image: url('$(res)/img/element-icons/roomlist/notifications-dm.svg');
mask-image: url("$(res)/img/element-icons/roomlist/notifications-dm.svg");
}
.mx_RoomTile_iconNotificationsNone::before {
mask-image: url('$(res)/img/element-icons/roomlist/notifications-off.svg');
mask-image: url("$(res)/img/element-icons/roomlist/notifications-off.svg");
}
.mx_RoomTile_iconPeople::before {
mask-image: url('$(res)/img/element-icons/room/members.svg');
mask-image: url("$(res)/img/element-icons/room/members.svg");
}
.mx_RoomTile_iconFiles::before {
mask-image: url('$(res)/img/element-icons/room/files.svg');
mask-image: url("$(res)/img/element-icons/room/files.svg");
}
.mx_RoomTile_iconPins::before {
mask-image: url('$(res)/img/element-icons/room/pin-upright.svg');
mask-image: url("$(res)/img/element-icons/room/pin-upright.svg");
}
.mx_RoomTile_iconWidgets::before {
mask-image: url('$(res)/img/element-icons/room/apps.svg');
mask-image: url("$(res)/img/element-icons/room/apps.svg");
}
.mx_RoomTile_iconSettings::before {
mask-image: url('$(res)/img/element-icons/settings.svg');
mask-image: url("$(res)/img/element-icons/settings.svg");
}
.mx_RoomTile_iconExport::before {
mask-image: url('$(res)/img/element-icons/export.svg');
mask-image: url("$(res)/img/element-icons/export.svg");
}
.mx_RoomTile_iconDeveloperTools::before {
mask-image: url('$(res)/img/element-icons/settings/flask.svg');
mask-image: url("$(res)/img/element-icons/settings/flask.svg");
}
.mx_RoomTile_iconCopyLink::before {
mask-image: url('$(res)/img/element-icons/link.svg');
mask-image: url("$(res)/img/element-icons/link.svg");
}
.mx_RoomTile_iconInvite::before {
mask-image: url('$(res)/img/element-icons/room/invite.svg');
mask-image: url("$(res)/img/element-icons/room/invite.svg");
}
.mx_RoomTile_iconSignOut::before {
mask-image: url('$(res)/img/element-icons/leave.svg');
mask-image: url("$(res)/img/element-icons/leave.svg");
}
}

4
res/css/views/rooms/_SearchBar.pcss
View file

@ -32,7 +32,7 @@ limitations under the License.
width: 37px;
height: 37px;
background-color: $accent;
mask: url('$(res)/img/feather-customised/search-input.svg');
mask: url("$(res)/img/feather-customised/search-input.svg");
mask-repeat: no-repeat;
mask-position: center;
}
@ -59,7 +59,7 @@ limitations under the License.
.mx_SearchBar_cancel {
background-color: $alert;
mask: url('$(res)/img/cancel.svg');
mask: url("$(res)/img/cancel.svg");
mask-repeat: no-repeat;
mask-position: center;
mask-size: 14px;

6
res/css/views/rooms/_ThreadSummary.pcss
View file

@ -60,17 +60,17 @@ limitations under the License.
opacity: 0;
transform: translateX(60px);
transition: all .1s ease-in-out;
transition: all 0.1s ease-in-out;
&::before {
content: '';
content: "";
position: absolute;
top: 50%;
right: $spacing-12;
transform: translateY(-50%);
width: 12px;
height: 12px;
mask-image: url('$(res)/img/compound/chevron-right-12px.svg');
mask-image: url("$(res)/img/compound/chevron-right-12px.svg");
mask-position: center;
mask-size: contain;
mask-repeat: no-repeat;

4
res/css/views/rooms/_TopUnreadMessagesBar.pcss
View file

@ -51,7 +51,7 @@ limitations under the License.
position: absolute;
width: 36px;
height: 36px;
mask-image: url('$(res)/img/element-icons/message/chevron-up.svg');
mask-image: url("$(res)/img/element-icons/message/chevron-up.svg");
mask-repeat: no-repeat;
mask-size: 20px;
mask-position: center;
@ -73,7 +73,7 @@ limitations under the License.
position: absolute;
width: 18px;
height: 18px;
mask-image: url('$(res)/img/cancel.svg');
mask-image: url("$(res)/img/cancel.svg");
mask-repeat: no-repeat;
mask-size: 10px;
mask-position: 4px 4px;

6
res/css/views/rooms/_VoiceRecordComposerTile.pcss
View file

@ -24,7 +24,7 @@ limitations under the License.
position: relative;
&::after {
content: '';
content: "";
width: 14px;
height: 14px;
position: absolute;
@ -43,7 +43,7 @@ limitations under the License.
background-color: $voice-record-icon-color;
mask-repeat: no-repeat;
mask-size: contain;
mask-image: url('$(res)/img/element-icons/trashcan.svg');
mask-image: url("$(res)/img/element-icons/trashcan.svg");
}
.mx_VoiceRecordComposerTile_uploadingState {
@ -81,7 +81,7 @@ limitations under the License.
&::before {
animation: recording-pulse 2s infinite;
content: '';
content: "";
background-color: $voice-record-live-circle-color;
width: 10px;
height: 10px;

3
res/css/views/rooms/_WhoIsTypingTile.pcss
View file

@ -63,7 +63,7 @@ limitations under the License.
}
.mx_WhoIsTypingTile_label > span {
background-image: url('$(res)/img/typing-indicator-2x.gif');
background-image: url("$(res)/img/typing-indicator-2x.gif");
background-size: 25px;
background-position: left bottom;
background-repeat: no-repeat;
@ -72,7 +72,6 @@ limitations under the License.
}
.mx_MatrixChat_useCompactLayout {
.mx_WhoIsTypingTile {
padding-top: 4px;
}

8
res/css/views/rooms/wysiwyg_composer/components/_Editor.pcss
View file

@ -16,8 +16,12 @@ limitations under the License.
.mx_WysiwygComposer_Editor_container {
@keyframes visualbell {
from { background-color: $visual-bell-bg-color; }
to { background-color: $background; }
from {
background-color: $visual-bell-bg-color;
}
to {
background-color: $background;
}
}
.mx_WysiwygComposer_Editor_content {