Apply prettier formatting

This commit is contained in:
Michael Weimann
2022-12-12 12:24:14 +01:00
parent 1cac306093
commit 526645c791
1576 changed files with 65385 additions and 62478 deletions
@@ -24,7 +24,7 @@ limitations under the License.
background-color: $system;
&::before {
content: '';
content: "";
position: absolute; /* sizing varies by icon */
background-color: $secondary-content;
mask-repeat: no-repeat;
@@ -40,7 +40,7 @@ limitations under the License.
height: 16px;
top: 8px; /* center */
left: 12px; /* center */
mask-image: url('$(res)/img/element-icons/play.svg');
mask-image: url("$(res)/img/element-icons/play.svg");
}
&.mx_PlayPauseButton_pause::before {
@@ -48,6 +48,6 @@ limitations under the License.
height: 12px;
top: 10px; /* center */
left: 11px; /* center */
mask-image: url('$(res)/img/element-icons/pause.svg');
mask-image: url("$(res)/img/element-icons/pause.svg");
}
}
+4 -3
View File
@@ -61,8 +61,9 @@ limitations under the License.
/* browsers. Firefox responds to webkit-prefixed values now, which means we can't use media */
/* or support queries to selectively apply the rule. An upside is that this CSS doesn't work */
/* in firefox, so it's just wasted CPU/GPU time. */
&::before { /* ::before to ensure it ends up under the thumb */
content: '';
&::before {
/* ::before to ensure it ends up under the thumb */
content: "";
background-color: $tertiary-content;
/* Absolute positioning to ensure it overlaps with the existing bar */
@@ -93,7 +94,7 @@ limitations under the License.
/* We do it this way to keep the same padding and margins of the element, avoiding margin math. */
/* Source: https://front-back.com/expand-clickable-areas-for-a-better-touch-experience/ */
&::after {
content: '';
content: "";
position: absolute;
top: -6px;
bottom: -6px;
+1 -1
View File
@@ -179,7 +179,7 @@ limitations under the License.
&:disabled {
cursor: default;
opacity: .4;
opacity: 0.4;
}
}
}
+3 -2
View File
@@ -32,8 +32,9 @@ limitations under the License.
align-items: center;
text-align: center;
&::before, &::after {
content: '';
&::before,
&::after {
content: "";
flex: 1;
border-bottom: 1px solid $quinary-content;
}
+2 -1
View File
@@ -28,7 +28,8 @@ progress.mx_PassphraseField_progress {
@mixin ProgressBarBorderRadius "2px";
@mixin ProgressBarColour $PassphraseStrengthLow;
&[value="2"], &[value="3"] {
&[value="2"],
&[value="3"] {
@mixin ProgressBarColour $PassphraseStrengthMedium;
}
&[value="4"] {
+2 -1
View File
@@ -29,7 +29,8 @@ limitations under the License.
user-select: none;
&.mx_RoomAvatar_isSpaceRoom {
&.mx_BaseAvatar_image, .mx_BaseAvatar_image {
&.mx_BaseAvatar_image,
.mx_BaseAvatar_image {
border-radius: 8px;
}
}
@@ -14,12 +14,13 @@ See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_DecoratedRoomAvatar, .mx_ExtraTile {
.mx_DecoratedRoomAvatar,
.mx_ExtraTile {
position: relative;
contain: content;
&.mx_DecoratedRoomAvatar_cutout .mx_BaseAvatar {
mask-image: url('$(res)/img/element-icons/roomlist/decorated-avatar-mask.svg');
mask-image: url("$(res)/img/element-icons/roomlist/decorated-avatar-mask.svg");
mask-position: center;
mask-size: contain;
mask-repeat: no-repeat;
@@ -37,7 +38,7 @@ limitations under the License.
}
.mx_DecoratedRoomAvatar_icon::before {
content: '';
content: "";
width: 100%;
height: 100%;
right: 0;
@@ -50,7 +51,7 @@ limitations under the License.
mask-size: contain;
mask-repeat: no-repeat;
background: $secondary-content;
mask-image: url('$(res)/img/globe.svg');
mask-image: url("$(res)/img/globe.svg");
}
.mx_DecoratedRoomAvatar_icon_offline::before {
@@ -69,7 +70,8 @@ limitations under the License.
background-color: $presence-busy;
}
.mx_NotificationBadge, .mx_RoomTile_badgeContainer {
.mx_NotificationBadge,
.mx_RoomTile_badgeContainer {
position: absolute;
top: 0;
right: 0;
@@ -31,7 +31,8 @@ limitations under the License.
}
/* the notFirst class is for cases where the optionList might be under a header of sorts. */
&:nth-child(n + 2), .mx_IconizedContextMenu_optionList_notFirst {
&:nth-child(n + 2),
.mx_IconizedContextMenu_optionList_notFirst {
/* This is a bit of a hack when we could just use a simple border-top property, */
/* however we have a (kinda) good reason for doing it this way: we need opacity. */
/* To get the right color, we need an opacity modifier which means we have to work */
@@ -44,7 +45,7 @@ limitations under the License.
&::before {
border-top: 1px solid $primary-content;
opacity: 0.1;
content: '';
content: "";
/* Counteract the padding problems (width: 100% ignores the 40px padding, */
/* unless we position it absolutely then it does the right thing). */
@@ -92,13 +93,16 @@ limitations under the License.
cursor: not-allowed;
}
img, .mx_IconizedContextMenu_icon { /* icons */
img,
.mx_IconizedContextMenu_icon {
/* icons */
width: 16px;
min-width: 16px;
max-width: 16px;
}
span.mx_IconizedContextMenu_label { /* labels */
span.mx_IconizedContextMenu_label {
/* labels */
width: 100%;
flex: 1;
@@ -124,7 +128,7 @@ limitations under the License.
height: 16px;
&::before {
content: '';
content: "";
width: inherit;
height: inherit;
position: absolute;
@@ -154,7 +158,8 @@ limitations under the License.
}
.mx_IconizedContextMenu_active {
&.mx_IconizedContextMenu_item, .mx_IconizedContextMenu_item {
&.mx_IconizedContextMenu_item,
.mx_IconizedContextMenu_item {
color: $accent !important;
}
@@ -176,7 +181,7 @@ limitations under the License.
}
.mx_IconizedContextMenu_checked::before {
mask-image: url('$(res)/img/element-icons/roomlist/checkmark.svg');
mask-image: url("$(res)/img/element-icons/roomlist/checkmark.svg");
}
.mx_IconizedContextMenu_unchecked::before {
@@ -16,14 +16,13 @@ limitations under the License.
*/
.mx_MessageContextMenu {
.mx_IconizedContextMenu_icon {
width: 16px;
height: 16px;
display: block;
&::before {
content: '';
content: "";
width: 16px;
height: 16px;
display: block;
@@ -35,59 +34,59 @@ limitations under the License.
}
.mx_MessageContextMenu_iconCollapse::before {
mask-image: url('$(res)/img/element-icons/message/chevron-up.svg');
mask-image: url("$(res)/img/element-icons/message/chevron-up.svg");
}
.mx_MessageContextMenu_iconReport::before {
mask-image: url('$(res)/img/element-icons/warning-badge.svg');
mask-image: url("$(res)/img/element-icons/warning-badge.svg");
}
.mx_MessageContextMenu_iconLink::before {
mask-image: url('$(res)/img/element-icons/link.svg');
mask-image: url("$(res)/img/element-icons/link.svg");
}
.mx_MessageContextMenu_iconPermalink::before {
mask-image: url('$(res)/img/element-icons/room/share.svg');
mask-image: url("$(res)/img/element-icons/room/share.svg");
}
.mx_MessageContextMenu_iconUnhidePreview::before {
mask-image: url('$(res)/img/element-icons/settings/appearance.svg');
mask-image: url("$(res)/img/element-icons/settings/appearance.svg");
}
.mx_MessageContextMenu_iconOpenInMapSite::before {
mask-image: url('$(res)/img/external-link.svg');
mask-image: url("$(res)/img/external-link.svg");
}
.mx_MessageContextMenu_iconEndPoll::before {
mask-image: url('$(res)/img/element-icons/check-white.svg');
mask-image: url("$(res)/img/element-icons/check-white.svg");
}
.mx_MessageContextMenu_iconForward::before {
mask-image: url('$(res)/img/element-icons/message/fwd.svg');
mask-image: url("$(res)/img/element-icons/message/fwd.svg");
}
.mx_MessageContextMenu_iconRedact::before {
mask-image: url('$(res)/img/element-icons/trashcan.svg');
mask-image: url("$(res)/img/element-icons/trashcan.svg");
}
.mx_MessageContextMenu_iconResend::before {
mask-image: url('$(res)/img/element-icons/retry.svg');
mask-image: url("$(res)/img/element-icons/retry.svg");
}
.mx_MessageContextMenu_iconSource::before {
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_MessageContextMenu_iconQuote::before {
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_MessageContextMenu_iconPin::before {
mask-image: url('$(res)/img/element-icons/room/pin-upright.svg');
mask-image: url("$(res)/img/element-icons/room/pin-upright.svg");
}
.mx_MessageContextMenu_iconUnpin::before {
mask-image: url('$(res)/img/element-icons/room/pin.svg');
mask-image: url("$(res)/img/element-icons/room/pin.svg");
}
.mx_MessageContextMenu_iconCopy::before {
@@ -100,26 +99,26 @@ limitations under the License.
}
.mx_MessageContextMenu_iconEdit::before {
mask-image: url('$(res)/img/element-icons/room/message-bar/edit.svg');
mask-image: url("$(res)/img/element-icons/room/message-bar/edit.svg");
}
.mx_MessageContextMenu_iconReply::before {
mask-image: url('$(res)/img/element-icons/room/message-bar/reply.svg');
mask-image: url("$(res)/img/element-icons/room/message-bar/reply.svg");
}
.mx_MessageContextMenu_iconReplyInThread::before {
mask-image: url('$(res)/img/element-icons/message/thread.svg');
mask-image: url("$(res)/img/element-icons/message/thread.svg");
}
.mx_MessageContextMenu_iconReact::before {
mask-image: url('$(res)/img/element-icons/room/message-bar/emoji.svg');
mask-image: url("$(res)/img/element-icons/room/message-bar/emoji.svg");
}
.mx_MessageContextMenu_iconViewInRoom::before {
mask-image: url('$(res)/img/element-icons/view-in-room.svg');
mask-image: url("$(res)/img/element-icons/view-in-room.svg");
}
.mx_MessageContextMenu_jumpToEvent::before {
mask-image: url('$(res)/img/element-icons/child-relationship.svg');
mask-image: url("$(res)/img/element-icons/child-relationship.svg");
}
}
@@ -1,63 +1,63 @@
.mx_RoomGeneralContextMenu_iconStar::before {
mask-image: url('$(res)/img/element-icons/roomlist/favorite.svg');
mask-image: url("$(res)/img/element-icons/roomlist/favorite.svg");
}
.mx_RoomGeneralContextMenu_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_RoomGeneralContextMenu_iconNotificationsDefault::before {
mask-image: url('$(res)/img/element-icons/notifications.svg');
mask-image: url("$(res)/img/element-icons/notifications.svg");
}
.mx_RoomGeneralContextMenu_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_RoomGeneralContextMenu_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_RoomGeneralContextMenu_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_RoomGeneralContextMenu_iconPeople::before {
mask-image: url('$(res)/img/element-icons/room/members.svg');
mask-image: url("$(res)/img/element-icons/room/members.svg");
}
.mx_RoomGeneralContextMenu_iconFiles::before {
mask-image: url('$(res)/img/element-icons/room/files.svg');
mask-image: url("$(res)/img/element-icons/room/files.svg");
}
.mx_RoomGeneralContextMenu_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_RoomGeneralContextMenu_iconWidgets::before {
mask-image: url('$(res)/img/element-icons/room/apps.svg');
mask-image: url("$(res)/img/element-icons/room/apps.svg");
}
.mx_RoomGeneralContextMenu_iconSettings::before {
mask-image: url('$(res)/img/element-icons/settings.svg');
mask-image: url("$(res)/img/element-icons/settings.svg");
}
.mx_RoomGeneralContextMenu_iconExport::before {
mask-image: url('$(res)/img/element-icons/export.svg');
mask-image: url("$(res)/img/element-icons/export.svg");
}
.mx_RoomGeneralContextMenu_iconDeveloperTools::before {
mask-image: url('$(res)/img/element-icons/settings/flask.svg');
mask-image: url("$(res)/img/element-icons/settings/flask.svg");
}
.mx_RoomGeneralContextMenu_iconCopyLink::before {
mask-image: url('$(res)/img/element-icons/link.svg');
mask-image: url("$(res)/img/element-icons/link.svg");
}
.mx_RoomGeneralContextMenu_iconInvite::before {
mask-image: url('$(res)/img/element-icons/room/invite.svg');
mask-image: url("$(res)/img/element-icons/room/invite.svg");
}
.mx_RoomGeneralContextMenu_iconSignOut::before {
mask-image: url('$(res)/img/element-icons/leave.svg');
mask-image: url("$(res)/img/element-icons/leave.svg");
}
@@ -1,12 +1,12 @@
.mx_RoomNotificationContextMenu_iconBell::before {
mask-image: url('$(res)/img/element-icons/notifications.svg');
mask-image: url("$(res)/img/element-icons/notifications.svg");
}
.mx_RoomNotificationContextMenu_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_RoomNotificationContextMenu_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_RoomNotificationContextMenu_iconBellCrossed::before {
mask-image: url('$(res)/img/element-icons/roomlist/notifications-off.svg');
mask-image: url("$(res)/img/element-icons/roomlist/notifications-off.svg");
}
@@ -123,13 +123,13 @@ limitations under the License.
position: relative;
&::before {
content: '';
content: "";
position: absolute;
background-color: $primary-content;
mask-repeat: no-repeat;
mask-position: center;
mask-size: contain;
mask-image: url('$(res)/img/element-icons/retry.svg');
mask-image: url("$(res)/img/element-icons/retry.svg");
width: 18px;
height: 18px;
left: 0;
@@ -199,7 +199,7 @@ limitations under the License.
position: relative;
&::before {
content: '';
content: "";
width: 20px;
height: 20px;
top: 8px;
@@ -209,7 +209,7 @@ limitations under the License.
mask-size: contain;
mask-repeat: no-repeat;
background-color: $accent;
mask-image: url('$(res)/img/element-icons/roomlist/checkmark.svg');
mask-image: url("$(res)/img/element-icons/roomlist/checkmark.svg");
}
}
}
@@ -17,7 +17,7 @@ limitations under the License.
.mx_AnalyticsLearnMoreDialog {
max-width: 500px;
.mx_AnalyticsLearnMore_image_holder {
background-image: url('$(res)/img/element-shiny.svg');
background-image: url("$(res)/img/element-shiny.svg");
background-repeat: no-repeat;
background-position: center top;
height: 112px;
@@ -41,7 +41,7 @@ limitations under the License.
.mx_AnalyticsPolicyLink {
display: inline-block;
mask-image: url('$(res)/img/external-link.svg');
mask-image: url("$(res)/img/external-link.svg");
background-color: $accent;
mask-repeat: no-repeat;
mask-size: contain;
@@ -56,7 +56,7 @@ limitations under the License.
}
.mx_AnalyticsLearnMore_bullets li {
background: url('$(res)/img/tick-circle.svg') no-repeat;
background: url("$(res)/img/tick-circle.svg") no-repeat;
list-style-type: none;
padding: 2px 0px 20px 32px;
vertical-align: middle;
+2 -1
View File
@@ -15,7 +15,8 @@ limitations under the License.
*/
.mx_BulkRedactDialog {
.mx_Checkbox, .mx_BulkRedactDialog_checkboxMicrocopy {
.mx_Checkbox,
.mx_BulkRedactDialog_checkboxMicrocopy {
line-height: $font-20px;
}
@@ -50,7 +50,7 @@ limitations under the License.
color: $secondary-content;
&::before {
content: '';
content: "";
position: absolute;
left: 10px;
top: calc(50% - 8px); /* vertical centering */
@@ -59,7 +59,7 @@ limitations under the License.
background-color: $secondary-content;
mask-repeat: no-repeat;
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");
mask-position: center;
}
}
+4 -2
View File
@@ -138,7 +138,8 @@ limitations under the License.
text-align: left;
}
td, th {
td,
th {
width: 360px; /* "feels right" number */
text-overflow: ellipsis;
@@ -146,7 +147,8 @@ limitations under the License.
white-space: nowrap;
}
td + td, th + th {
td + td,
th + th {
width: auto;
}
+2 -1
View File
@@ -47,7 +47,8 @@ limitations under the License.
color: unset;
}
.mx_Field_valid.mx_Field, .mx_Field_valid.mx_Field:focus-within {
.mx_Field_valid.mx_Field,
.mx_Field_valid.mx_Field:focus-within {
border-color: $input-border-color;
}
+7 -5
View File
@@ -58,12 +58,14 @@ limitations under the License.
line-height: $font-15px;
}
a, .mx_AccessibleButton_kind_link {
a,
.mx_AccessibleButton_kind_link {
color: $accent;
text-decoration: underline;
}
&::before, &::after {
&::before,
&::after {
content: "";
position: absolute;
width: 40px;
@@ -87,7 +89,7 @@ limitations under the License.
.mx_FeedbackDialog_reportBug {
&::after {
mask-image: url('$(res)/img/feather-customised/bug.svg');
mask-image: url("$(res)/img/feather-customised/bug.svg");
}
}
@@ -95,7 +97,7 @@ limitations under the License.
.mx_StyledRadioButton {
display: inline-flex;
font-size: 20px;
transition: font-size 1s, border .5s;
transition: font-size 1s, border 0.5s;
border-radius: 50%;
border: 2px solid transparent;
margin-top: 12px;
@@ -132,7 +134,7 @@ limitations under the License.
}
&::after {
mask-image: url('$(res)/img/element-icons/feedback.svg');
mask-image: url("$(res)/img/element-icons/feedback.svg");
}
}
}
+4 -3
View File
@@ -137,7 +137,8 @@ limitations under the License.
visibility: hidden;
}
.mx_ForwardList_sendIcon, .mx_NotificationBadge {
.mx_ForwardList_sendIcon,
.mx_NotificationBadge {
position: absolute;
}
@@ -148,7 +149,7 @@ limitations under the License.
&.mx_ForwardList_sending .mx_ForwardList_sendIcon {
background-color: $accent;
mask-image: url('$(res)/img/element-icons/circle-sending.svg');
mask-image: url("$(res)/img/element-icons/circle-sending.svg");
mask-position: center;
mask-repeat: no-repeat;
mask-size: 14px;
@@ -158,7 +159,7 @@ limitations under the License.
&.mx_ForwardList_sent .mx_ForwardList_sendIcon {
background-color: $accent;
mask-image: url('$(res)/img/element-icons/circle-sent.svg');
mask-image: url("$(res)/img/element-icons/circle-sent.svg");
mask-position: center;
mask-repeat: no-repeat;
mask-size: 14px;
+2 -2
View File
@@ -313,11 +313,11 @@ limitations under the License.
}
.mx_InviteDialog_userDirectoryIcon::before {
mask-image: url('$(res)/img/voip/tab-userdirectory.svg');
mask-image: url("$(res)/img/voip/tab-userdirectory.svg");
}
.mx_InviteDialog_dialPadIcon::before {
mask-image: url('$(res)/img/voip/tab-dialpad.svg');
mask-image: url("$(res)/img/voip/tab-dialpad.svg");
}
.mx_InviteDialog_tile {
+3 -3
View File
@@ -50,17 +50,17 @@ limitations under the License.
}
.mx_JoinRuleDropdown_invite::before {
mask-image: url('$(res)/img/element-icons/lock.svg');
mask-image: url("$(res)/img/element-icons/lock.svg");
mask-size: contain;
}
.mx_JoinRuleDropdown_public::before {
mask-image: url('$(res)/img/globe.svg');
mask-image: url("$(res)/img/globe.svg");
mask-size: 12px;
}
.mx_JoinRuleDropdown_restricted::before {
mask-image: url('$(res)/img/element-icons/group-members.svg');
mask-image: url("$(res)/img/element-icons/group-members.svg");
mask-size: contain;
}
}
+2 -2
View File
@@ -44,7 +44,7 @@ limitations under the License.
color: $secondary-content;
&::before {
content: '';
content: "";
position: absolute;
left: 10px;
top: calc(50% - 8px); /* vertical centering */
@@ -53,7 +53,7 @@ limitations under the License.
background-color: $secondary-content;
mask-repeat: no-repeat;
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");
mask-position: center;
}
}
@@ -116,7 +116,7 @@ limitations under the License.
color: $secondary-content;
&::before {
content: '';
content: "";
position: absolute;
left: 10px;
top: calc(50% - 8px); /* vertical centering */
@@ -125,7 +125,7 @@ limitations under the License.
background-color: $secondary-content;
mask-repeat: no-repeat;
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");
mask-position: center;
}
}
@@ -35,7 +35,8 @@ limitations under the License.
padding: 0;
color: $primary-content;
span.mx_EditHistoryMessage_deletion, span.mx_EditHistoryMessage_insertion {
span.mx_EditHistoryMessage_deletion,
span.mx_EditHistoryMessage_insertion {
padding: 0px 2px;
}
+1 -1
View File
@@ -63,7 +63,7 @@ limitations under the License.
&::before {
content: "";
mask: url('$(res)/img/element-icons/x-8px.svg');
mask: url("$(res)/img/element-icons/x-8px.svg");
mask-repeat: no-repeat;
mask-position: center;
mask-size: cover;
@@ -18,32 +18,32 @@ limitations under the License.
/* ========================================================== */
.mx_RoomSettingsDialog_settingsIcon::before {
mask-image: url('$(res)/img/element-icons/settings.svg');
mask-image: url("$(res)/img/element-icons/settings.svg");
}
.mx_RoomSettingsDialog_voiceIcon::before {
mask-image: url('$(res)/img/element-icons/call/voice-call.svg');
mask-image: url("$(res)/img/element-icons/call/voice-call.svg");
}
.mx_RoomSettingsDialog_securityIcon::before {
mask-image: url('$(res)/img/element-icons/security.svg');
mask-image: url("$(res)/img/element-icons/security.svg");
}
.mx_RoomSettingsDialog_rolesIcon::before {
mask-image: url('$(res)/img/element-icons/room/settings/roles.svg');
mask-image: url("$(res)/img/element-icons/room/settings/roles.svg");
}
.mx_RoomSettingsDialog_notificationsIcon::before {
mask-image: url('$(res)/img/element-icons/notifications.svg');
mask-image: url("$(res)/img/element-icons/notifications.svg");
}
.mx_RoomSettingsDialog_bridgesIcon::before {
/* This icon is pants, please improve :) */
mask-image: url('$(res)/img/feather-customised/bridge.svg');
mask-image: url("$(res)/img/feather-customised/bridge.svg");
}
.mx_RoomSettingsDialog_warningIcon::before {
mask-image: url('$(res)/img/element-icons/room/settings/advanced.svg');
mask-image: url("$(res)/img/element-icons/room/settings/advanced.svg");
}
.mx_RoomSettingsDialog .mx_Dialog_title {
@@ -46,5 +46,5 @@ limitations under the License.
}
.mx_SpacePreferencesDialog_appearanceIcon::before {
mask-image: url('$(res)/img/element-icons/settings/appearance.svg');
mask-image: url("$(res)/img/element-icons/settings/appearance.svg");
}
@@ -88,11 +88,11 @@ limitations under the License.
.mx_TabbedView_tabLabel {
.mx_SpaceSettingsDialog_generalIcon::before {
mask-image: url('$(res)/img/element-icons/settings.svg');
mask-image: url("$(res)/img/element-icons/settings.svg");
}
.mx_SpaceSettingsDialog_visibilityIcon::before {
mask-image: url('$(res)/img/element-icons/eye.svg');
mask-image: url("$(res)/img/element-icons/eye.svg");
}
}
}
+21 -17
View File
@@ -93,11 +93,11 @@ limitations under the License.
}
&.mx_SpotlightDialog_filterPeople::before {
mask-image: url('$(res)/img/element-icons/room/members.svg');
mask-image: url("$(res)/img/element-icons/room/members.svg");
}
&.mx_SpotlightDialog_filterPublicRooms::before {
mask-image: url('$(res)/img/element-icons/roomlist/explore.svg');
mask-image: url("$(res)/img/element-icons/roomlist/explore.svg");
}
.mx_SpotlightDialog_filter--close {
@@ -156,7 +156,8 @@ limitations under the License.
padding: $spacing-16;
.mx_SpotlightDialog_section {
> h4, > .mx_SpotlightDialog_sectionHeader > h4 {
> h4,
> .mx_SpotlightDialog_sectionHeader > h4 {
font-weight: $font-semi-bold;
font-size: $font-12px;
line-height: $font-15px;
@@ -216,7 +217,8 @@ limitations under the License.
margin-left: $spacing-16;
}
&:hover, &[aria-selected="true"] {
&:hover,
&[aria-selected="true"] {
background-color: $quinary-content;
}
}
@@ -329,7 +331,7 @@ limitations under the License.
&::before {
top: 2px;
left: 2px;
content: '';
content: "";
width: 16px;
height: 16px;
position: absolute;
@@ -339,16 +341,18 @@ limitations under the License.
background: $tertiary-content;
}
&:hover::before, &[aria-selected="true"]::before {
&:hover::before,
&[aria-selected="true"]::before {
background-color: $secondary-content;
}
}
.mx_SpotlightDialog_option--menu::before {
mask-image: url('$(res)/img/element-icons/context-menu.svg');
mask-image: url("$(res)/img/element-icons/context-menu.svg");
}
&:hover, &[aria-selected="true"] {
&:hover,
&[aria-selected="true"] {
background-color: $system;
.mx_SpotlightDialog_option--menu,
@@ -419,19 +423,19 @@ limitations under the License.
}
.mx_SpotlightDialog_startChat::before {
mask-image: url('$(res)/img/element-icons/room/members.svg');
mask-image: url("$(res)/img/element-icons/room/members.svg");
}
.mx_SpotlightDialog_joinRoomAlias::before {
mask-image: url('$(res)/img/element-icons/roomlist/hash-circle.svg');
mask-image: url("$(res)/img/element-icons/roomlist/hash-circle.svg");
}
.mx_SpotlightDialog_explorePublicRooms::before {
mask-image: url('$(res)/img/element-icons/roomlist/explore.svg');
mask-image: url("$(res)/img/element-icons/roomlist/explore.svg");
}
.mx_SpotlightDialog_startGroupChat::before {
mask-image: url('$(res)/img/element-icons/group-members.svg');
mask-image: url("$(res)/img/element-icons/group-members.svg");
}
.mx_SpotlightDialog_otherSearches_messageSearchText {
@@ -448,7 +452,7 @@ limitations under the License.
mask-repeat: no-repeat;
mask-position: center;
mask-size: contain;
mask-image: url('$(res)/img/element-icons/room/search-inset.svg');
mask-image: url("$(res)/img/element-icons/room/search-inset.svg");
}
}
@@ -491,19 +495,19 @@ limitations under the License.
mask-size: contain;
&.mx_SpotlightDialog_metaspaceResult_home-space {
mask-image: url('$(res)/img/element-icons/home.svg');
mask-image: url("$(res)/img/element-icons/home.svg");
}
&.mx_SpotlightDialog_metaspaceResult_favourites-space {
mask-image: url('$(res)/img/element-icons/roomlist/favorite.svg');
mask-image: url("$(res)/img/element-icons/roomlist/favorite.svg");
}
&.mx_SpotlightDialog_metaspaceResult_people-space {
mask-image: url('$(res)/img/element-icons/room/members.svg');
mask-image: url("$(res)/img/element-icons/room/members.svg");
}
&.mx_SpotlightDialog_metaspaceResult_orphans-space {
mask-image: url('$(res)/img/element-icons/roomlist/hash-circle.svg');
mask-image: url("$(res)/img/element-icons/roomlist/hash-circle.svg");
}
}
}
+3 -2
View File
@@ -35,13 +35,14 @@ limitations under the License.
width: 100%;
}
.mx_TermsDialog_service, .mx_TermsDialog_summary {
.mx_TermsDialog_service,
.mx_TermsDialog_summary {
padding-right: 10px;
}
.mx_TermsDialog_link {
display: inline-block;
mask-image: url('$(res)/img/external-link.svg');
mask-image: url("$(res)/img/external-link.svg");
background-color: $accent;
width: 10px;
height: 10px;
+11 -11
View File
@@ -18,45 +18,45 @@ limitations under the License.
/* ========================================================== */
.mx_UserSettingsDialog_settingsIcon::before {
mask-image: url('$(res)/img/element-icons/settings.svg');
mask-image: url("$(res)/img/element-icons/settings.svg");
}
.mx_UserSettingsDialog_appearanceIcon::before {
mask-image: url('$(res)/img/element-icons/settings/appearance.svg');
mask-image: url("$(res)/img/element-icons/settings/appearance.svg");
}
.mx_UserSettingsDialog_voiceIcon::before {
mask-image: url('$(res)/img/element-icons/call/voice-call.svg');
mask-image: url("$(res)/img/element-icons/call/voice-call.svg");
}
.mx_UserSettingsDialog_bellIcon::before {
mask-image: url('$(res)/img/element-icons/notifications.svg');
mask-image: url("$(res)/img/element-icons/notifications.svg");
}
.mx_UserSettingsDialog_preferencesIcon::before {
mask-image: url('$(res)/img/element-icons/settings/preference.svg');
mask-image: url("$(res)/img/element-icons/settings/preference.svg");
}
.mx_UserSettingsDialog_keyboardIcon::before {
mask-image: url('$(res)/img/element-icons/settings/keyboard.svg');
mask-image: url("$(res)/img/element-icons/settings/keyboard.svg");
}
.mx_UserSettingsDialog_sidebarIcon::before {
mask-image: url('$(res)/img/element-icons/settings/sidebar.svg');
mask-image: url("$(res)/img/element-icons/settings/sidebar.svg");
}
.mx_UserSettingsDialog_securityIcon::before {
mask-image: url('$(res)/img/element-icons/security.svg');
mask-image: url("$(res)/img/element-icons/security.svg");
}
.mx_UserSettingsDialog_helpIcon::before {
mask-image: url('$(res)/img/element-icons/settings/help.svg');
mask-image: url("$(res)/img/element-icons/settings/help.svg");
}
.mx_UserSettingsDialog_labsIcon::before {
mask-image: url('$(res)/img/element-icons/settings/flask.svg');
mask-image: url("$(res)/img/element-icons/settings/flask.svg");
}
.mx_UserSettingsDialog_mjolnirIcon::before {
mask-image: url('$(res)/img/element-icons/room/composer/emoji.svg');
mask-image: url("$(res)/img/element-icons/room/composer/emoji.svg");
}
@@ -17,7 +17,7 @@ limitations under the License.
.mx_AccessSecretStorageDialog {
.mx_AccessSecretStorageDialog_titleWithIcon {
&::before {
content: '';
content: "";
display: inline-block;
width: 24px;
height: 24px;
@@ -35,11 +35,11 @@ limitations under the License.
}
&.mx_AccessSecretStorageDialog_secureBackupTitle::before {
mask-image: url('$(res)/img/feather-customised/secure-backup.svg');
mask-image: url("$(res)/img/feather-customised/secure-backup.svg");
}
&.mx_AccessSecretStorageDialog_securePhraseTitle::before {
mask-image: url('$(res)/img/feather-customised/secure-phrase.svg');
mask-image: url("$(res)/img/feather-customised/secure-phrase.svg");
}
}
@@ -88,7 +88,7 @@ limitations under the License.
color: $accent;
&::before {
mask-image: url('$(res)/img/feather-customised/check.svg');
mask-image: url("$(res)/img/feather-customised/check.svg");
background-color: $accent;
}
}
@@ -97,19 +97,19 @@ limitations under the License.
color: $alert;
&::before {
mask-image: url('$(res)/img/feather-customised/x.svg');
mask-image: url("$(res)/img/feather-customised/x.svg");
background-color: $alert;
}
}
}
.mx_Dialog_buttons {
$spacingStart: $spacing-24; /* 16px icon + 8px padding */
$spacingStart: $spacing-24; /* 16px icon + 8px padding */
text-align: initial;
display: flex;
flex-flow: column;
gap: 14px; /* TODO: spacing variable */
gap: 14px; /* TODO: spacing variable */
.mx_Dialog_buttons_additive {
float: none;
@@ -49,7 +49,7 @@ limitations under the License.
}
.mx_CreateSecretStorageDialog_titleWithIcon::before {
content: '';
content: "";
display: inline-block;
width: 24px;
height: 24px;
@@ -60,14 +60,15 @@ limitations under the License.
}
.mx_CreateSecretStorageDialog_secureBackupTitle::before {
mask-image: url('$(res)/img/feather-customised/secure-backup.svg');
mask-image: url("$(res)/img/feather-customised/secure-backup.svg");
}
.mx_CreateSecretStorageDialog_securePhraseTitle::before {
mask-image: url('$(res)/img/feather-customised/secure-phrase.svg');
mask-image: url("$(res)/img/feather-customised/secure-phrase.svg");
}
.mx_CreateSecretStorageDialog_centeredTitle, .mx_CreateSecretStorageDialog_centeredBody {
.mx_CreateSecretStorageDialog_centeredTitle,
.mx_CreateSecretStorageDialog_centeredBody {
text-align: center;
}
@@ -110,11 +111,11 @@ limitations under the License.
}
.mx_CreateSecretStorageDialog_optionIcon_securePhrase {
mask-image: url('$(res)/img/feather-customised/secure-phrase.svg');
mask-image: url("$(res)/img/feather-customised/secure-phrase.svg");
}
.mx_CreateSecretStorageDialog_optionIcon_secureBackup {
mask-image: url('$(res)/img/feather-customised/secure-backup.svg');
mask-image: url("$(res)/img/feather-customised/secure-backup.svg");
}
.mx_CreateSecretStorageDialog_passPhraseContainer {
@@ -68,7 +68,7 @@ limitations under the License.
background-color: $accent;
&::before {
mask-image: url('$(res)/img/feather-customised/check.svg');
mask-image: url("$(res)/img/feather-customised/check.svg");
}
}
@@ -76,7 +76,7 @@ limitations under the License.
background-color: $alert;
&::before {
mask-image: url('$(res)/img/feather-customised/x.svg');
mask-image: url("$(res)/img/feather-customised/x.svg");
}
}
+1 -1
View File
@@ -40,7 +40,7 @@ limitations under the License.
display: block;
/* center to first line */
position: relative;
top: .15em;
top: 0.15em;
&::before {
content: "";
@@ -23,7 +23,7 @@ limitations under the License.
/* force this element to appear on the DOM */
content: "";
background-color: #8D97A5;
background-color: #8d97a5;
width: inherit;
height: inherit;
top: 0px;
@@ -32,7 +32,7 @@ limitations under the License.
display: inline-block;
vertical-align: middle;
mask-image: url('$(res)/img/element-icons/call/delete.svg');
mask-image: url("$(res)/img/element-icons/call/delete.svg");
mask-position: 8px;
mask-size: 20px;
mask-repeat: no-repeat;
+1 -1
View File
@@ -50,7 +50,7 @@ limitations under the License.
width: 10px;
height: 6px;
padding-right: 9px;
mask: url('$(res)/img/feather-customised/dropdown-arrow.svg');
mask: url("$(res)/img/feather-customised/dropdown-arrow.svg");
mask-repeat: no-repeat;
background: $primary-content;
}
+1 -1
View File
@@ -20,7 +20,7 @@ limitations under the License.
.mx_ExternalLink_icon {
display: inline-block;
mask-image: url('$(res)/img/external-link.svg');
mask-image: url("$(res)/img/external-link.svg");
background-color: currentColor;
mask-repeat: no-repeat;
mask-size: contain;
+1 -1
View File
@@ -56,7 +56,7 @@ limitations under the License.
mask-position: center;
mask-size: 20px;
mask-repeat: no-repeat;
mask-image: url('$(res)/img/element-icons/room/ellipsis.svg');
mask-image: url("$(res)/img/element-icons/room/ellipsis.svg");
}
}
}
+3 -9
View File
@@ -65,7 +65,7 @@ limitations under the License.
right: 10px;
width: 10px;
height: 6px;
mask: url('$(res)/img/feather-customised/dropdown-arrow.svg');
mask: url("$(res)/img/feather-customised/dropdown-arrow.svg");
mask-repeat: no-repeat;
background-color: $primary-content;
z-index: 1;
@@ -96,10 +96,7 @@ limitations under the License.
}
.mx_Field label {
transition:
font-size 0.25s ease-out 0.1s,
color 0.25s ease-out 0.1s,
transform 0.25s ease-out 0.1s,
transition: font-size 0.25s ease-out 0.1s, color 0.25s ease-out 0.1s, transform 0.25s ease-out 0.1s,
background-color 0.25s ease-out 0.1s;
background-color: transparent;
font-size: $font-14px;
@@ -121,10 +118,7 @@ limitations under the License.
.mx_Field input:not(:placeholder-shown) + label,
.mx_Field textarea:focus + label,
.mx_Field textarea:not(:placeholder-shown) + label {
transition:
font-size 0.25s ease-out 0s,
color 0.25s ease-out 0s,
transform 0.25s ease-out 0s,
transition: font-size 0.25s ease-out 0s, color 0.25s ease-out 0s, transform 0.25s ease-out 0s,
background-color 0.25s ease-out 0s;
font-size: $font-10px;
transform: translateY(-13px);
+8 -8
View File
@@ -97,7 +97,7 @@ $button-gap: 24px;
display: block;
&::before {
content: '';
content: "";
height: $icon-size;
width: $icon-size;
mask-repeat: no-repeat;
@@ -109,27 +109,27 @@ $button-gap: 24px;
}
.mx_ImageView_button_rotateCW::before {
mask-image: url('$(res)/img/image-view/rotate-cw.svg');
mask-image: url("$(res)/img/image-view/rotate-cw.svg");
}
.mx_ImageView_button_rotateCCW::before {
mask-image: url('$(res)/img/image-view/rotate-ccw.svg');
mask-image: url("$(res)/img/image-view/rotate-ccw.svg");
}
.mx_ImageView_button_zoomOut::before {
mask-image: url('$(res)/img/image-view/zoom-out.svg');
mask-image: url("$(res)/img/image-view/zoom-out.svg");
}
.mx_ImageView_button_zoomIn::before {
mask-image: url('$(res)/img/image-view/zoom-in.svg');
mask-image: url("$(res)/img/image-view/zoom-in.svg");
}
.mx_ImageView_button_download::before {
mask-image: url('$(res)/img/image-view/download.svg');
mask-image: url("$(res)/img/image-view/download.svg");
}
.mx_ImageView_button_more::before {
mask-image: url('$(res)/img/image-view/more.svg');
mask-image: url("$(res)/img/image-view/more.svg");
}
.mx_ImageView_button_close {
@@ -139,7 +139,7 @@ $button-gap: 24px;
&::before {
width: $button-size;
height: $button-size;
mask-image: url('$(res)/img/image-view/close.svg');
mask-image: url("$(res)/img/image-view/close.svg");
mask-size: 40%;
}
}
+3 -3
View File
@@ -28,14 +28,14 @@ limitations under the License.
width: 16px;
height: 16px;
mask-position: center;
content: '';
content: "";
vertical-align: middle;
}
.mx_InfoTooltip_icon_info::before {
mask-image: url('$(res)/img/element-icons/info.svg');
mask-image: url("$(res)/img/element-icons/info.svg");
}
.mx_InfoTooltip_icon_warning::before {
mask-image: url('$(res)/img/element-icons/warning.svg');
mask-image: url("$(res)/img/element-icons/warning.svg");
}
+2 -1
View File
@@ -18,7 +18,8 @@ limitations under the License.
display: inline;
}
.mx_InlineSpinner img, .mx_InlineSpinner_icon {
.mx_InlineSpinner img,
.mx_InlineSpinner_icon {
margin: 0px 6px;
vertical-align: -3px;
}
+1 -1
View File
@@ -38,7 +38,7 @@ limitations under the License.
content: "";
margin-right: 8px;
background-color: $secondary-content;
mask-image: url('$(res)/img/feather-customised/eye.svg');
mask-image: url("$(res)/img/feather-customised/eye.svg");
display: inline-block;
width: 18px;
height: 14px;
@@ -50,7 +50,7 @@ limitations under the License.
background-color: $secondary-content;
mask-position: center;
mask-repeat: no-repeat;
mask-image: url('$(res)/img/element-icons/camera.svg');
mask-image: url("$(res)/img/element-icons/camera.svg");
mask-size: 16px;
z-index: 2;
}
+1 -1
View File
@@ -20,7 +20,7 @@
}
.mx_Markdown_CODE {
padding: .2em 0;
padding: 0.2em 0;
margin: 0;
font-size: 85%;
background-color: $rte-code-bg-color;
+2 -1
View File
@@ -34,7 +34,8 @@ limitations under the License.
font-weight: normal;
}
.mx_Field_prefix, .mx_Field_postfix {
.mx_Field_prefix,
.mx_Field_postfix {
color: $info-plinth-fg-color;
border-left: none;
border-right: none;
+2 -2
View File
@@ -45,7 +45,7 @@ limitations under the License.
position: relative;
&::before {
content: '';
content: "";
width: 24px;
height: 24px;
position: absolute;
@@ -54,7 +54,7 @@ limitations under the License.
mask-position: center;
mask-size: contain;
mask-repeat: no-repeat;
mask-image: url('$(res)/img/element-icons/i.svg');
mask-image: url("$(res)/img/element-icons/i.svg");
background: #ffffff;
}
}
+2 -1
View File
@@ -56,7 +56,8 @@ limitations under the License.
color: $secondary-content;
/* Support code/pre elements in settings flag descriptions */
pre, code {
pre,
code {
font-family: $monospace-font-family !important;
background-color: $rte-code-bg-color;
}
+2 -2
View File
@@ -39,7 +39,7 @@ limitations under the License.
.mx_Spinner_icon {
background-color: $quinary-content;
mask: url('$(res)/img/spinner/spinner-background.svg');
mask: url("$(res)/img/spinner/spinner-background.svg");
mask-size: 100%;
display: flex;
@@ -51,7 +51,7 @@ limitations under the License.
&::before {
background-color: $secondary-content;
mask: url('$(res)/img/spinner/spinner-foreground.svg');
mask: url("$(res)/img/spinner/spinner-foreground.svg");
mask-size: 100%;
width: 100%;
+1 -1
View File
@@ -53,7 +53,7 @@ limitations under the License.
height: 100%;
width: 100%;
mask-image: url('$(res)/img/feather-customised/check.svg');
mask-image: url("$(res)/img/feather-customised/check.svg");
mask-position: center;
mask-size: 100%;
mask-repeat: no-repeat;
+2 -3
View File
@@ -50,7 +50,6 @@ limitations under the License.
}
.mx_Tag {
font-size: $font-15px;
display: inline-flex;
@@ -63,7 +62,7 @@ limitations under the License.
color: $primary-content;
background: $quinary-content;
>svg:first-child {
> svg:first-child {
width: 1em;
color: $secondary-content;
transform: scale(1.25);
@@ -81,7 +80,7 @@ limitations under the License.
position: relative;
svg {
width: .5em;
width: 0.5em;
vertical-align: middle;
}
}
+1 -1
View File
@@ -17,7 +17,7 @@ limitations under the License.
.mx_ToggleSwitch {
--ToggleSwitch-min-width: $font-44px;
transition: background-color 0.20s ease-out 0.1s;
transition: background-color 0.2s ease-out 0.1s;
width: $font-44px;
height: $font-20px;
+2 -2
View File
@@ -47,7 +47,7 @@ limitations under the License.
}
.mx_Tooltip_chevron::after {
content: '';
content: "";
width: 0;
height: 0;
border-top: 6px solid transparent;
@@ -71,7 +71,7 @@ limitations under the License.
max-width: 300px;
word-break: break-word;
background-color: #21262C; /* Same on both themes */
background-color: #21262c; /* Same on both themes */
color: $accent-fg-color;
border: 0;
text-align: center;
+1 -1
View File
@@ -35,7 +35,7 @@ limitations under the License.
}
.mx_TooltipButton:hover {
opacity: 1.0;
opacity: 1;
}
.mx_TooltipButton_container {
@@ -88,7 +88,8 @@ limitations under the License.
}
.mx_UseCaseSelection_selected {
.mx_UseCaseSelection_slideIn, .mx_UseCaseSelection_slideInDelayed {
.mx_UseCaseSelection_slideIn,
.mx_UseCaseSelection_slideInDelayed {
animation-delay: 800ms;
animation-duration: 300ms;
animation-fill-mode: forwards;
@@ -29,7 +29,7 @@ limitations under the License.
.mx_UseCaseSelectionButton_icon {
/* workaround: design expects a layering of two colors */
background: linear-gradient(0deg, rgba(172, 59, 168, 0.15), rgba(172, 59, 168, 0.15)), #FFFFFF;
background: linear-gradient(0deg, rgba(172, 59, 168, 0.15), rgba(172, 59, 168, 0.15)), #ffffff;
border-radius: 14px;
padding: $spacing-8;
margin-bottom: $spacing-16;
@@ -39,7 +39,7 @@ limitations under the License.
display: block;
/* this has to remain the same color across all themes,
as its background has a fixed color as well */
background: #1E1E1E;
background: #1e1e1e;
mask-position: center;
mask-repeat: no-repeat;
mask-size: contain;
@@ -48,19 +48,20 @@ limitations under the License.
}
&.mx_UseCaseSelectionButton_messaging::before {
mask-image: url('$(res)/img/element-icons/chat-bubble.svg');
mask-image: url("$(res)/img/element-icons/chat-bubble.svg");
}
&.mx_UseCaseSelectionButton_work::before {
mask-image: url('$(res)/img/element-icons/view-community.svg');
mask-image: url("$(res)/img/element-icons/view-community.svg");
}
&.mx_UseCaseSelectionButton_community::before {
mask-image: url('$(res)/img/globe.svg');
mask-image: url("$(res)/img/globe.svg");
}
}
&:hover, &:focus {
&:hover,
&:focus {
box-shadow: 0 $spacing-4 $spacing-8 rgba(0, 0, 0, 0.08);
transform: translate(0, -$spacing-8);
}
@@ -87,7 +88,7 @@ limitations under the License.
width: 12px;
height: 12px;
mask-image: url('$(res)/img/element-icons/check-white.svg');
mask-image: url("$(res)/img/element-icons/check-white.svg");
}
}
+2 -2
View File
@@ -53,7 +53,7 @@ limitations under the License.
color: $accent;
&::before {
mask-image: url('$(res)/img/feather-customised/check.svg');
mask-image: url("$(res)/img/feather-customised/check.svg");
background-color: $accent;
}
}
@@ -62,7 +62,7 @@ limitations under the License.
color: $alert;
&::before {
mask-image: url('$(res)/img/feather-customised/x.svg');
mask-image: url("$(res)/img/feather-customised/x.svg");
background-color: $alert;
}
}
+39 -17
View File
@@ -58,7 +58,7 @@ limitations under the License.
.mx_EmojiPicker_anchor::before {
background-color: $primary-content;
content: '';
content: "";
display: inline-block;
mask-size: 100%;
mask-repeat: no-repeat;
@@ -70,16 +70,36 @@ limitations under the License.
background-color: $focus-bg-color;
}
.mx_EmojiPicker_anchor_activity::before { mask-image: url('$(res)/img/emojipicker/activity.svg'); }
.mx_EmojiPicker_anchor_custom::before { mask-image: url('$(res)/img/emojipicker/custom.svg'); }
.mx_EmojiPicker_anchor_flags::before { mask-image: url('$(res)/img/emojipicker/flags.svg'); }
.mx_EmojiPicker_anchor_foods::before { mask-image: url('$(res)/img/emojipicker/foods.svg'); }
.mx_EmojiPicker_anchor_nature::before { mask-image: url('$(res)/img/emojipicker/nature.svg'); }
.mx_EmojiPicker_anchor_objects::before { mask-image: url('$(res)/img/emojipicker/objects.svg'); }
.mx_EmojiPicker_anchor_people::before { mask-image: url('$(res)/img/emojipicker/people.svg'); }
.mx_EmojiPicker_anchor_places::before { mask-image: url('$(res)/img/emojipicker/places.svg'); }
.mx_EmojiPicker_anchor_recent::before { mask-image: url('$(res)/img/emojipicker/recent.svg'); }
.mx_EmojiPicker_anchor_symbols::before { mask-image: url('$(res)/img/emojipicker/symbols.svg'); }
.mx_EmojiPicker_anchor_activity::before {
mask-image: url("$(res)/img/emojipicker/activity.svg");
}
.mx_EmojiPicker_anchor_custom::before {
mask-image: url("$(res)/img/emojipicker/custom.svg");
}
.mx_EmojiPicker_anchor_flags::before {
mask-image: url("$(res)/img/emojipicker/flags.svg");
}
.mx_EmojiPicker_anchor_foods::before {
mask-image: url("$(res)/img/emojipicker/foods.svg");
}
.mx_EmojiPicker_anchor_nature::before {
mask-image: url("$(res)/img/emojipicker/nature.svg");
}
.mx_EmojiPicker_anchor_objects::before {
mask-image: url("$(res)/img/emojipicker/objects.svg");
}
.mx_EmojiPicker_anchor_people::before {
mask-image: url("$(res)/img/emojipicker/people.svg");
}
.mx_EmojiPicker_anchor_places::before {
mask-image: url("$(res)/img/emojipicker/places.svg");
}
.mx_EmojiPicker_anchor_recent::before {
mask-image: url("$(res)/img/emojipicker/recent.svg");
}
.mx_EmojiPicker_anchor_symbols::before {
mask-image: url("$(res)/img/emojipicker/symbols.svg");
}
.mx_EmojiPicker_anchor_visible {
border-bottom: 2px solid $accent;
@@ -124,17 +144,17 @@ limitations under the License.
}
.mx_EmojiPicker_search_icon::after {
mask: url('$(res)/img/emojipicker/search.svg') no-repeat;
mask: url("$(res)/img/emojipicker/search.svg") no-repeat;
mask-size: 100%;
background-color: $primary-content;
content: '';
content: "";
display: inline-block;
width: 100%;
height: 100%;
}
.mx_EmojiPicker_search_clear::after {
mask-image: url('$(res)/img/emojipicker/delete.svg');
mask-image: url("$(res)/img/emojipicker/delete.svg");
}
.mx_EmojiPicker_category {
@@ -177,12 +197,13 @@ limitations under the License.
}
.mx_EmojiPicker_item_selected {
color: rgba(0, 0, 0, .5);
color: rgba(0, 0, 0, 0.5);
border: 1px solid $accent;
padding: 4px;
}
.mx_EmojiPicker_category_label, .mx_EmojiPicker_preview_name {
.mx_EmojiPicker_category_label,
.mx_EmojiPicker_preview_name {
font-size: $font-16px;
font-weight: 600;
margin: 0;
@@ -214,7 +235,8 @@ limitations under the License.
color: $light-fg-color;
font-size: $font-14px;
&::before, &::after {
&::before,
&::after {
content: ":";
}
}
+2 -1
View File
@@ -27,7 +27,8 @@ limitations under the License.
/* and can overlap error message/close buttons */
/* hide it */
&.mx_LocationPicker_hasError {
.maplibregl-canvas-container, .maplibregl-control-container {
.maplibregl-canvas-container,
.maplibregl-control-container {
display: none;
}
}
+2 -2
View File
@@ -41,9 +41,9 @@ limitations under the License.
&.mx_CallEvent_inactive .mx_CallEvent_title::before {
display: inline-block;
vertical-align: middle;
content: '';
content: "";
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: 16px;
width: 16px;
height: 16px;
+1 -1
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/chat-bubbles.svg');
mask-image: url("$(res)/img/element-icons/chat-bubbles.svg");
}
}
+1 -1
View File
@@ -49,6 +49,6 @@ limitations under the License.
mask-position: center;
mask-size: contain;
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;
}
+2 -2
View File
@@ -24,12 +24,12 @@ limitations under the License.
height: 14px;
width: 14px;
background-color: $muted-fg-color;
mask-image: url('$(res)/img/element-icons/hide.svg');
mask-image: url("$(res)/img/element-icons/hide.svg");
mask-repeat: no-repeat;
mask-position: center;
mask-size: contain;
content: '';
content: "";
position: absolute;
top: 1px;
left: 0;
@@ -31,7 +31,8 @@ limitations under the License.
margin: 0;
margin-left: 8px;
&, & > input {
&,
& > input {
border-radius: 8px;
}
}
+11 -11
View File
@@ -39,7 +39,7 @@ limitations under the License.
display: inline-flex;
&::before {
content: '';
content: "";
height: 16px;
width: 16px;
@@ -51,24 +51,24 @@ limitations under the License.
}
.mx_LegacyCallEvent_silence::before {
mask-image: url('$(res)/img/voip/silence.svg');
mask-image: url("$(res)/img/voip/silence.svg");
}
.mx_LegacyCallEvent_unSilence::before {
mask-image: url('$(res)/img/voip/un-silence.svg');
mask-image: url("$(res)/img/voip/un-silence.svg");
}
&.mx_LegacyCallEvent_voice {
.mx_LegacyCallEvent_type_icon::before,
.mx_LegacyCallEvent_content_button_callBack span::before,
.mx_LegacyCallEvent_content_button_answer span::before {
mask-image: url('$(res)/img/element-icons/call/voice-call.svg');
mask-image: url("$(res)/img/element-icons/call/voice-call.svg");
}
&.mx_LegacyCallEvent_rejected,
&.mx_LegacyCallEvent_noAnswer {
.mx_LegacyCallEvent_type_icon::before {
mask-image: url('$(res)/img/voip/declined-voice.svg');
mask-image: url("$(res)/img/voip/declined-voice.svg");
}
}
}
@@ -77,13 +77,13 @@ limitations under the License.
.mx_LegacyCallEvent_type_icon::before,
.mx_LegacyCallEvent_content_button_callBack span::before,
.mx_LegacyCallEvent_content_button_answer span::before {
mask-image: url('$(res)/img/element-icons/call/video-call.svg');
mask-image: url("$(res)/img/element-icons/call/video-call.svg");
}
&.mx_LegacyCallEvent_rejected,
&.mx_LegacyCallEvent_noAnswer {
.mx_LegacyCallEvent_type_icon::before {
mask-image: url('$(res)/img/voip/declined-video.svg');
mask-image: url("$(res)/img/voip/declined-video.svg");
}
}
}
@@ -91,13 +91,13 @@ limitations under the License.
&.mx_LegacyCallEvent_missed {
&.mx_LegacyCallEvent_voice {
.mx_LegacyCallEvent_type_icon::before {
mask-image: url('$(res)/img/voip/missed-voice.svg');
mask-image: url("$(res)/img/voip/missed-voice.svg");
}
}
&.mx_LegacyCallEvent_video {
.mx_LegacyCallEvent_type_icon::before {
mask-image: url('$(res)/img/voip/missed-video.svg');
mask-image: url("$(res)/img/voip/missed-video.svg");
}
}
}
@@ -142,7 +142,7 @@ limitations under the License.
margin-right: 5px;
&::before {
content: '';
content: "";
position: absolute;
height: 13px;
width: 13px;
@@ -179,7 +179,7 @@ limitations under the License.
.mx_LegacyCallEvent_content_button_reject {
span::before {
mask-image: url('$(res)/img/element-icons/call/hangup.svg');
mask-image: url("$(res)/img/element-icons/call/hangup.svg");
}
}
+2 -2
View File
@@ -73,11 +73,11 @@ limitations under the License.
margin-right: 12px;
&::before {
content: '';
content: "";
mask-repeat: no-repeat;
mask-position: center;
mask-size: cover;
mask-image: url('$(res)/img/element-icons/room/composer/attach.svg');
mask-image: url("$(res)/img/element-icons/room/composer/attach.svg");
background-color: $secondary-content;
width: 15px;
height: 15px;
+2 -2
View File
@@ -50,7 +50,7 @@ $timeline-image-border-radius: 8px;
background-color: $background;
.mx_Blurhash > canvas {
animation: mx--anim-pulse 1.75s infinite cubic-bezier(.4, 0, .6, 1);
animation: mx--anim-pulse 1.75s infinite cubic-bezier(0.4, 0, 0.6, 1);
}
}
@@ -113,7 +113,7 @@ $timeline-image-border-radius: 8px;
margin-right: 8px;
background-color: $accent;
mask-image: url('$(res)/img/feather-customised/eye.svg');
mask-image: url("$(res)/img/feather-customised/eye.svg");
display: inline-block;
width: 18px;
height: 14px;
@@ -17,6 +17,6 @@ limitations under the License.
.mx_EventTileBubble.mx_MJitsiWidgetEvent {
&::before {
background-color: $header-panel-text-primary-color; /* XXX: Variable abuse */
mask-image: url('$(res)/img/element-icons/call/video-call.svg');
mask-image: url("$(res)/img/element-icons/call/video-call.svg");
}
}
+13 -9
View File
@@ -32,7 +32,7 @@ limitations under the License.
}
h2::before {
content: '';
content: "";
position: relative;
display: inline-block;
margin-right: 12px;
@@ -44,7 +44,7 @@ limitations under the License.
mask-repeat: no-repeat;
mask-size: contain;
mask-position: center;
mask-image: url('$(res)/img/element-icons/room/composer/poll.svg');
mask-image: url("$(res)/img/element-icons/room/composer/poll.svg");
}
.mx_MPollBody_option {
@@ -55,11 +55,13 @@ limitations under the License.
max-width: 550px;
background-color: $background;
.mx_StyledRadioButton, .mx_MPollBody_endedOption {
.mx_StyledRadioButton,
.mx_MPollBody_endedOption {
margin-bottom: 8px;
}
.mx_StyledRadioButton_content, .mx_MPollBody_endedOption {
.mx_StyledRadioButton_content,
.mx_MPollBody_endedOption {
padding-top: 2px;
margin-right: 0px;
}
@@ -110,16 +112,18 @@ limitations under the License.
}
/* options not actionable in these states */
.mx_MPollBody_option_checked, .mx_MPollBody_option_ended {
.mx_MPollBody_option_checked,
.mx_MPollBody_option_ended {
pointer-events: none;
}
.mx_StyledRadioButton_checked, .mx_MPollBody_endedOptionWinner {
.mx_StyledRadioButton_checked,
.mx_MPollBody_endedOptionWinner {
input[type="radio"] + div {
border-width: 2px;
border-color: $accent;
background-color: $accent;
background-image: url('$(res)/img/element-icons/check-white.svg');
background-image: url("$(res)/img/element-icons/check-white.svg");
background-size: 12px;
background-repeat: no-repeat;
background-position: center;
@@ -131,7 +135,7 @@ limitations under the License.
}
.mx_MPollBody_endedOptionWinner .mx_MPollBody_optionDescription .mx_MPollBody_optionVoteCount::before {
content: '';
content: "";
position: relative;
display: inline-block;
margin-right: 4px;
@@ -142,7 +146,7 @@ limitations under the License.
mask-repeat: no-repeat;
mask-size: contain;
mask-position: center;
mask-image: url('$(res)/img/element-icons/trophy.svg');
mask-image: url("$(res)/img/element-icons/trophy.svg");
}
.mx_MPollBody_totalVotes {
@@ -43,7 +43,7 @@ limitations under the License.
/* previous event while trying to mouse into the action bar or from the */
/* react button to its tooltip. */
&::before {
content: '';
content: "";
position: absolute;
/* tooltip safe mousing area + tooltip overhang + */
/* action bar + action bar offset from event */
@@ -56,7 +56,11 @@ limitations under the License.
cursor: initial;
/* stylelint-disable-next-line max-line-length */
.mx_GenericEventListSummary[data-layout="bubble"] .mx_GenericEventListSummary_toggle ~ .mx_GenericEventListSummary_unstyledList .mx_EventTile_info:first-of-type & {
.mx_GenericEventListSummary[data-layout="bubble"]
.mx_GenericEventListSummary_toggle
~ .mx_GenericEventListSummary_unstyledList
.mx_EventTile_info:first-of-type
& {
/* improve clickability of "collapse" link button on bubble layout by reducing width and height values */
/* mx_GenericEventListSummary_toggle ~: to apply rules to action bar when "collapse" button is available */
/* mx_EventTile_info:first-of-type: to apply rules to the info event tile just under "collapse" button */
@@ -76,7 +80,7 @@ limitations under the License.
}
}
>* {
> * {
white-space: nowrap;
display: inline-block;
position: relative;
@@ -107,7 +111,7 @@ limitations under the License.
&:disabled,
&[disabled] {
cursor: not-allowed;
opacity: .75;
opacity: 0.75;
}
&:hover {
@@ -115,7 +119,6 @@ limitations under the License.
}
&.mx_MessageActionBar_threadButton {
.mx_Indicator {
background: $links;
animation-iteration-count: infinite;
+4 -3
View File
@@ -29,7 +29,7 @@ limitations under the License.
margin-right: 4px;
&::before {
content: '';
content: "";
position: absolute;
height: 100%;
width: 100%;
@@ -37,14 +37,15 @@ limitations under the License.
mask-repeat: no-repeat;
mask-position: center;
background-color: $tertiary-content;
mask-image: url('$(res)/img/element-icons/room/message-bar/emoji.svg');
mask-image: url("$(res)/img/element-icons/room/message-bar/emoji.svg");
}
&.mx_ReactionsRow_addReactionButton_active {
visibility: visible; /* keep showing whilst the context menu is shown */
}
&:hover, &.mx_ReactionsRow_addReactionButton_active {
&:hover,
&.mx_ReactionsRow_addReactionButton_active {
&::before {
background-color: $primary-content;
}
+2 -2
View File
@@ -24,11 +24,11 @@ limitations under the License.
height: 14px;
width: 14px;
background-color: $muted-fg-color;
mask-image: url('$(res)/img/feather-customised/trash.custom.svg');
mask-image: url("$(res)/img/feather-customised/trash.custom.svg");
mask-repeat: no-repeat;
mask-position: center;
mask-size: contain;
content: '';
content: "";
position: absolute;
top: 1px;
left: 0;
@@ -20,14 +20,14 @@ limitations under the License.
/* white infill for the transparency */
&.mx_cryptoEvent_icon::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%;
}
&.mx_cryptoEvent_icon::after {
mask-image: url('$(res)/img/e2e/normal.svg');
mask-image: url("$(res)/img/e2e/normal.svg");
background-color: $header-panel-text-primary-color;
}
@@ -41,7 +41,8 @@ limitations under the License.
background-color: $alert;
}
.mx_cryptoEvent_state, .mx_cryptoEvent_buttons {
.mx_cryptoEvent_state,
.mx_cryptoEvent_buttons {
grid-column: 3;
grid-row: 1 / 3;
}
+3 -3
View File
@@ -70,7 +70,7 @@ limitations under the License.
&::before {
transform: rotate(90deg);
mask-size: 22px;
mask-image: url('$(res)/img/feather-customised/chevron-down.svg');
mask-image: url("$(res)/img/feather-customised/chevron-down.svg");
}
/* Header title with the back button */
@@ -89,7 +89,7 @@ limitations under the License.
margin-inline-end: calc(var(--BaseCard_header_button-margin) - $spacing-4);
&::before {
mask-image: url('$(res)/img/icons-close.svg');
mask-image: url("$(res)/img/icons-close.svg");
mask-size: 8px;
}
}
@@ -115,7 +115,7 @@ limitations under the License.
height: var(--BaseCard_header-button-size);
&::after {
content: '';
content: "";
position: absolute;
inset-block-start: 0;
inset-inline-start: 0;
+18 -17
View File
@@ -30,7 +30,8 @@ limitations under the License.
text-overflow: ellipsis;
}
h2, .mx_RoomSummaryCard_alias {
h2,
.mx_RoomSummaryCard_alias {
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
@@ -52,7 +53,7 @@ limitations under the License.
border: 3px solid $dark-panel-bg-color;
&::before {
content: '';
content: "";
position: absolute;
top: 13px;
left: 13px;
@@ -61,7 +62,7 @@ limitations under the License.
mask-size: cover;
mask-repeat: no-repeat;
mask-position: center;
mask-image: url('$(res)/img/e2e/disabled.svg');
mask-image: url("$(res)/img/e2e/disabled.svg");
background-color: #ffffff;
}
}
@@ -69,21 +70,21 @@ limitations under the License.
.mx_RoomSummaryCard_e2ee_normal {
background-color: #424446;
&::before {
mask-image: url('$(res)/img/e2e/normal.svg');
mask-image: url("$(res)/img/e2e/normal.svg");
}
}
.mx_RoomSummaryCard_e2ee_verified {
background-color: #0dbd8b;
&::before {
mask-image: url('$(res)/img/e2e/verified.svg');
mask-image: url("$(res)/img/e2e/verified.svg");
}
}
.mx_RoomSummaryCard_e2ee_warning {
background-color: #ff5b55;
&::before {
mask-image: url('$(res)/img/e2e/warning.svg');
mask-image: url("$(res)/img/e2e/warning.svg");
}
}
}
@@ -94,7 +95,7 @@ limitations under the License.
padding-left: 44px;
&::before {
content: '';
content: "";
position: absolute;
top: 8px;
left: 10px;
@@ -143,7 +144,7 @@ limitations under the License.
&:hover {
&::after {
content: '';
content: "";
position: absolute;
height: 24px;
width: 24px;
@@ -155,7 +156,7 @@ limitations under the License.
}
&::before {
content: '';
content: "";
position: absolute;
height: 16px;
width: 16px;
@@ -170,7 +171,7 @@ limitations under the License.
right: 8px;
&::before {
mask-image: url('$(res)/img/element-icons/room/pin-upright.svg');
mask-image: url("$(res)/img/element-icons/room/pin-upright.svg");
}
}
.mx_RoomSummaryCard_app_maximiseToggle {
@@ -186,7 +187,7 @@ limitations under the License.
right: 56px; /* 2*24 + 8 */
display: none;
&::before {
mask-image: url('$(res)/img/element-icons/room/ellipsis.svg');
mask-image: url("$(res)/img/element-icons/room/ellipsis.svg");
}
}
@@ -244,25 +245,25 @@ limitations under the License.
}
.mx_RoomSummaryCard_icon_files::before {
mask-image: url('$(res)/img/element-icons/room/files.svg');
mask-image: url("$(res)/img/element-icons/room/files.svg");
}
.mx_RoomSummaryCard_icon_pins::before {
mask-image: url('$(res)/img/element-icons/room/pin-upright.svg');
mask-image: url("$(res)/img/element-icons/room/pin-upright.svg");
}
.mx_RoomSummaryCard_icon_threads::before {
mask-image: url('$(res)/img/element-icons/message/thread.svg');
mask-image: url("$(res)/img/element-icons/message/thread.svg");
}
.mx_RoomSummaryCard_icon_share::before {
mask-image: url('$(res)/img/element-icons/room/share.svg');
mask-image: url("$(res)/img/element-icons/room/share.svg");
}
.mx_RoomSummaryCard_icon_settings::before {
mask-image: url('$(res)/img/element-icons/settings.svg');
mask-image: url("$(res)/img/element-icons/settings.svg");
}
.mx_RoomSummaryCard_icon_export::before {
mask-image: url('$(res)/img/element-icons/export.svg');
mask-image: url("$(res)/img/element-icons/export.svg");
}
+5 -4
View File
@@ -94,7 +94,8 @@ limitations under the License.
}
}
.mx_RoomView_messagePanel { /* To avoid the rule from being applied to .mx_ThreadPanel_empty */
.mx_RoomView_messagePanel {
/* To avoid the rule from being applied to .mx_ThreadPanel_empty */
.mx_RoomView_messageListWrapper {
width: calc(100% + 6px); /* 8px - 2px */
}
@@ -149,11 +150,11 @@ limitations under the License.
}
.mx_ThreadPanel_viewInRoom::before {
mask-image: url('$(res)/img/element-icons/view-in-room.svg');
mask-image: url("$(res)/img/element-icons/view-in-room.svg");
}
.mx_ThreadPanel_copyLinkToThread::before {
mask-image: url('$(res)/img/element-icons/link.svg');
mask-image: url("$(res)/img/element-icons/link.svg");
}
.mx_ThreadPanel_empty {
@@ -202,7 +203,7 @@ limitations under the License.
font-size: $font-12px;
line-height: $font-15px;
>b {
> b {
font-weight: $font-semi-bold;
}
}
+6 -4
View File
@@ -37,7 +37,7 @@ limitations under the License.
padding-right: 11px;
&::after {
content: '';
content: "";
display: block;
position: absolute;
left: 0;
@@ -171,13 +171,15 @@ limitations under the License.
}
.mx_GenericEventListSummary_unstyledList, /* RR next to a message on the event list summary */
.mx_RoomView_MessageList { /* RR next to a message on the messsge list */
.mx_RoomView_MessageList {
/* RR next to a message on the messsge list */
.mx_EventTile[data-layout="bubble"] {
.mx_ReadReceiptGroup {
/* 6px: scroll bar width (magic number) */
/* stylelint-disable-next-line declaration-colon-space-after */
inset-inline-end:
calc(-1 * var(--ReadReceiptGroup_EventBubbleTile-spacing-end) + $container-gap-width + 6px);
inset-inline-end: calc(
-1 * var(--ReadReceiptGroup_EventBubbleTile-spacing-end) + $container-gap-width + 6px
);
}
&.mx_EventTile_info {
+2 -2
View File
@@ -34,7 +34,7 @@ limitations under the License.
height: 16px;
width: 16px;
padding: 4px;
mask-image: url('$(res)/img/minimise.svg');
mask-image: url("$(res)/img/minimise.svg");
mask-repeat: no-repeat;
mask-position: 7px center;
background-color: $header-panel-text-primary-color;
@@ -69,7 +69,7 @@ limitations under the License.
}
.mx_UserInfo_separator {
border-bottom: 1px solid rgba($primary-content, .1);
border-bottom: 1px solid rgba($primary-content, 0.1);
}
.mx_UserInfo_memberDetailsContainer {
@@ -25,7 +25,6 @@ limitations under the License.
.mx_UserInfo.mx_BaseCard {
.mx_UserInfo_container:not(.mx_UserInfo_separator) {
> div > p {
margin-top: 0;
margin-bottom: 0;
@@ -88,7 +87,8 @@ limitations under the License.
}
/* Special case styling for EncryptionPanel in a Modal dialog */
.mx_Dialog, .mx_CompleteSecurity_body {
.mx_Dialog,
.mx_CompleteSecurity_body {
.mx_VerificationPanel_QRPhase_startOptions {
display: flex;
margin-top: 10px;
@@ -117,7 +117,8 @@ limitations under the License.
max-width: 310px;
justify-content: space-between;
canvas, .mx_VerificationPanel_QRPhase_noQR {
canvas,
.mx_VerificationPanel_QRPhase_noQR {
width: 220px !important;
height: 220px !important;
background-color: #fff;
+14 -10
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 {
@@ -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 {
+7 -6
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;
}
+3 -3
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;
}
}
+1 -1
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;
+10 -7
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;
}
}
+25 -25
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)
);
}
}
}
+1 -1
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");
}
}
+2 -1
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;
+1 -1
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;
+4 -4
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;
+1 -1
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;
+2 -2
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;
+21 -17
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;
@@ -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;
}
}
+2 -2
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");
}
}
+1 -1
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");
}
}
+1 -3
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;
}
}
}
@@ -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;
+1 -1
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;

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