Switch to rendering svg icons rather than css masking (#31517)
* Switch to rendering svg icons rather than masking them in left panel Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Remove unused stylesheet Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Switch to rendering svg icons rather than masking them for ExternalLink Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Switch to rendering svg icons rather than masking them for TabbedView Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Switch to rendering svg icons rather than masking them for JoinRuleDropdown Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Switch to rendering svg icons rather than masking them in ManageRestrictedJoinRuleDialog Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Switch to rendering svg icons rather than masking them in LeaveSpaceDialog Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Switch to rendering svg icons rather than masking them in ReplyPreview Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Switch to rendering svg icons rather than masking them in SearchBox Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Switch to rendering svg icons rather than masking them in RoomStatusBar Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Fix advanced.svg Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Update snapshots Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Update screenshots Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Iterate Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Fix bad merge conflict resolution Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> --------- Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
|
Before Width: | Height: | Size: 29 KiB After Width: | Height: | Size: 29 KiB |
|
Before Width: | Height: | Size: 33 KiB After Width: | Height: | Size: 33 KiB |
|
Before Width: | Height: | Size: 30 KiB After Width: | Height: | Size: 30 KiB |
|
Before Width: | Height: | Size: 44 KiB After Width: | Height: | Size: 44 KiB |
@@ -280,7 +280,6 @@
|
||||
@import "./views/rooms/_AuxPanel.pcss";
|
||||
@import "./views/rooms/_BasicMessageComposer.pcss";
|
||||
@import "./views/rooms/_CallGuestLinkButton.pcss";
|
||||
@import "./views/rooms/_DecryptionFailureBar.pcss";
|
||||
@import "./views/rooms/_E2EIcon.pcss";
|
||||
@import "./views/rooms/_E2EIconView.pcss";
|
||||
@import "./views/rooms/_EditMessageComposer.pcss";
|
||||
|
||||
@@ -114,67 +114,30 @@ Please see LICENSE files in the repository root for full details.
|
||||
margin-top: 12px;
|
||||
}
|
||||
|
||||
.mx_LeftPanel_dialPadButton {
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
.mx_LeftPanel_dialPadButton,
|
||||
.mx_LeftPanel_exploreButton {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
padding: var(--cpd-space-1-5x);
|
||||
border-radius: 8px;
|
||||
background-color: $panel-actions;
|
||||
position: relative;
|
||||
margin-left: 8px;
|
||||
|
||||
&::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 6px;
|
||||
left: 6px;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
mask-image: url("@vector-im/compound-design-tokens/icons/dial-pad.svg");
|
||||
mask-position: center;
|
||||
mask-size: contain;
|
||||
mask-repeat: no-repeat;
|
||||
background-color: $secondary-content;
|
||||
}
|
||||
}
|
||||
|
||||
.mx_LeftPanel_exploreButton,
|
||||
.mx_LeftPanel_recentsButton {
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
border-radius: 8px;
|
||||
background-color: $panel-actions;
|
||||
position: relative;
|
||||
margin-left: 8px;
|
||||
|
||||
&::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 8px;
|
||||
left: 8px;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
mask-position: center;
|
||||
mask-size: contain;
|
||||
mask-repeat: no-repeat;
|
||||
background-color: $secondary-content;
|
||||
svg {
|
||||
width: inherit;
|
||||
height: inherit;
|
||||
display: block;
|
||||
color: $secondary-content;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background-color: $tertiary-content;
|
||||
|
||||
&::before {
|
||||
background-color: $background;
|
||||
svg {
|
||||
color: $background;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.mx_LeftPanel_exploreButton::before {
|
||||
mask-image: url("@vector-im/compound-design-tokens/icons/explore.svg");
|
||||
}
|
||||
|
||||
.mx_LeftPanel_recentsButton::before {
|
||||
mask-image: url("@vector-im/compound-design-tokens/icons/time.svg");
|
||||
}
|
||||
}
|
||||
|
||||
.mx_LegacyRoomListHeader:first-child {
|
||||
@@ -228,8 +191,7 @@ Please see LICENSE files in the repository root for full details.
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.mx_LeftPanel_exploreButton,
|
||||
.mx_LeftPanel_recentsButton {
|
||||
.mx_LeftPanel_exploreButton {
|
||||
margin-left: 0;
|
||||
margin-top: 8px;
|
||||
}
|
||||
|
||||
@@ -99,34 +99,17 @@ Please see LICENSE files in the repository root for full details.
|
||||
position: relative;
|
||||
user-select: none;
|
||||
|
||||
&:nth-child(2) {
|
||||
& + .mx_AccessibleButton {
|
||||
border-left: 1px solid $resend-button-divider-color;
|
||||
}
|
||||
|
||||
&::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
svg {
|
||||
left: 10px; /* inset for regular button padding */
|
||||
background-color: $muted-fg-color;
|
||||
mask-repeat: no-repeat;
|
||||
mask-position: center;
|
||||
mask-size: contain;
|
||||
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
top: 50%; /* text sizes are dynamic */
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
|
||||
&.mx_RoomStatusBar_unsentCancelAllBtn::before {
|
||||
mask-image: url("@vector-im/compound-design-tokens/icons/delete.svg");
|
||||
}
|
||||
|
||||
&.mx_RoomStatusBar_unsentRetry {
|
||||
padding-left: 34px; /* 28px from above, but +6px to account for the wider icon */
|
||||
|
||||
&::before {
|
||||
mask-image: url("@vector-im/compound-design-tokens/icons/restart.svg");
|
||||
}
|
||||
vertical-align: middle;
|
||||
color: $muted-fg-color;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -17,13 +17,14 @@ Please see LICENSE files in the repository root for full details.
|
||||
|
||||
.mx_SearchBox_closeButton {
|
||||
cursor: pointer;
|
||||
mask-image: url("@vector-im/compound-design-tokens/icons/close.svg");
|
||||
mask-repeat: no-repeat;
|
||||
mask-position: center;
|
||||
mask-size: 16px;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
width: 16px;
|
||||
padding: 9px;
|
||||
background-color: var(--cpd-color-icon-secondary);
|
||||
|
||||
svg {
|
||||
height: inherit;
|
||||
width: inherit;
|
||||
color: var(--cpd-color-icon-secondary);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -223,14 +223,6 @@ Please see LICENSE files in the repository root for full details.
|
||||
margin-inline-start: auto;
|
||||
}
|
||||
|
||||
.mx_InviteDialog_userDirectoryIcon::before {
|
||||
mask-image: url("@vector-im/compound-design-tokens/icons/user-profile-solid.svg");
|
||||
}
|
||||
|
||||
.mx_InviteDialog_dialPadIcon::before {
|
||||
mask-image: url("@vector-im/compound-design-tokens/icons/dial-pad.svg");
|
||||
}
|
||||
|
||||
.mx_InviteDialog_tile {
|
||||
cursor: pointer;
|
||||
display: grid;
|
||||
|
||||
@@ -18,19 +18,14 @@ Please see LICENSE files in the repository root for full details.
|
||||
min-height: 32px;
|
||||
|
||||
> div {
|
||||
padding-left: 30px;
|
||||
position: relative;
|
||||
padding-left: var(--cpd-space-1-5x);
|
||||
|
||||
&::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
height: 16px;
|
||||
svg {
|
||||
width: 16px;
|
||||
left: 6px;
|
||||
top: 8px;
|
||||
mask-repeat: no-repeat;
|
||||
mask-position: center;
|
||||
background-color: $secondary-content;
|
||||
height: 16px;
|
||||
color: $secondary-content;
|
||||
vertical-align: -2px;
|
||||
margin-right: var(--cpd-space-1-5x);
|
||||
}
|
||||
|
||||
&.mx_JoinRuleDropdown_knock::before {
|
||||
@@ -39,22 +34,6 @@ Please see LICENSE files in the repository root for full details.
|
||||
}
|
||||
}
|
||||
|
||||
.mx_JoinRuleDropdown_invite::before {
|
||||
box-sizing: border-box;
|
||||
mask-image: url("@vector-im/compound-design-tokens/icons/lock-solid.svg");
|
||||
mask-size: contain;
|
||||
padding: 1px;
|
||||
}
|
||||
|
||||
.mx_JoinRuleDropdown_public::before {
|
||||
mask-image: url("@vector-im/compound-design-tokens/icons/public.svg");
|
||||
}
|
||||
|
||||
.mx_JoinRuleDropdown_restricted::before {
|
||||
mask-image: url("@vector-im/compound-design-tokens/icons/group.svg");
|
||||
mask-size: contain;
|
||||
}
|
||||
|
||||
.mx_JoinRuleDropdown_icon {
|
||||
color: $secondary-content;
|
||||
position: absolute;
|
||||
|
||||
@@ -25,28 +25,21 @@ Please see LICENSE files in the repository root for full details.
|
||||
overflow-y: auto;
|
||||
|
||||
.mx_LeaveSpaceDialog_section_warning {
|
||||
position: relative;
|
||||
border-radius: 8px;
|
||||
margin: 12px 0 0;
|
||||
padding: 12px 8px 12px 42px;
|
||||
padding: 12px 8px;
|
||||
background-color: $header-panel-bg-color;
|
||||
|
||||
font-size: $font-12px;
|
||||
line-height: $font-15px;
|
||||
color: $secondary-content;
|
||||
|
||||
&::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
left: 10px;
|
||||
top: calc(50% - 8px); /* vertical centering */
|
||||
svg {
|
||||
height: 16px;
|
||||
width: 16px;
|
||||
background-color: $secondary-content;
|
||||
mask-repeat: no-repeat;
|
||||
mask-size: contain;
|
||||
mask-image: url("@vector-im/compound-design-tokens/icons/info-solid.svg");
|
||||
mask-position: center;
|
||||
color: $secondary-content;
|
||||
vertical-align: middle;
|
||||
margin: 0 var(--cpd-space-1x);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -87,25 +87,19 @@ Please see LICENSE files in the repository root for full details.
|
||||
position: relative;
|
||||
border-radius: 8px;
|
||||
margin: 12px 0;
|
||||
padding: 8px 8px 8px 42px;
|
||||
padding: 8px;
|
||||
background-color: $header-panel-bg-color;
|
||||
|
||||
font-size: $font-12px;
|
||||
line-height: $font-15px;
|
||||
color: $secondary-content;
|
||||
|
||||
&::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
left: 10px;
|
||||
top: calc(50% - 8px); /* vertical centering */
|
||||
svg {
|
||||
height: 16px;
|
||||
width: 16px;
|
||||
background-color: $secondary-content;
|
||||
mask-repeat: no-repeat;
|
||||
mask-size: contain;
|
||||
mask-image: url("@vector-im/compound-design-tokens/icons/info-solid.svg");
|
||||
mask-position: center;
|
||||
color: $secondary-content;
|
||||
vertical-align: middle;
|
||||
margin: 0 var(--cpd-space-1x);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -5,46 +5,6 @@ SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Com
|
||||
Please see LICENSE files in the repository root for full details.
|
||||
*/
|
||||
|
||||
/* ICONS */
|
||||
/* ========================================================== */
|
||||
|
||||
.mx_RoomSettingsDialog_settingsIcon::before {
|
||||
mask-image: url("@vector-im/compound-design-tokens/icons/settings-solid.svg");
|
||||
}
|
||||
|
||||
.mx_RoomSettingsDialog_voiceIcon::before {
|
||||
mask-image: url("@vector-im/compound-design-tokens/icons/voice-call-solid.svg");
|
||||
}
|
||||
|
||||
.mx_RoomSettingsDialog_securityIcon::before {
|
||||
mask-image: url("@vector-im/compound-design-tokens/icons/lock-solid.svg");
|
||||
}
|
||||
|
||||
.mx_RoomSettingsDialog_rolesIcon::before {
|
||||
mask-image: url("@vector-im/compound-design-tokens/icons/admin.svg");
|
||||
}
|
||||
|
||||
.mx_RoomSettingsDialog_notificationsIcon::before {
|
||||
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");
|
||||
}
|
||||
|
||||
.mx_RoomSettingsDialog_pollsIcon::before {
|
||||
mask-image: url("@vector-im/compound-design-tokens/icons/polls.svg");
|
||||
}
|
||||
|
||||
.mx_RoomSettingsDialog_warningIcon::before {
|
||||
mask-image: url("$(res)/img/element-icons/room/settings/advanced.svg");
|
||||
}
|
||||
|
||||
.mx_RoomSettingsDialog_peopleIcon::before {
|
||||
mask-image: url("@vector-im/compound-design-tokens/icons/group.svg");
|
||||
}
|
||||
|
||||
.mx_RoomSettingsDialog .mx_Dialog_title {
|
||||
-ms-text-overflow: ellipsis;
|
||||
text-overflow: ellipsis;
|
||||
|
||||
@@ -26,7 +26,3 @@ Please see LICENSE files in the repository root for full details.
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.mx_SpacePreferencesDialog_appearanceIcon::before {
|
||||
mask-image: url("@vector-im/compound-design-tokens/icons/visibility-on.svg");
|
||||
}
|
||||
|
||||
@@ -71,14 +71,4 @@ Please see LICENSE files in the repository root for full details.
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.mx_TabbedView_tabLabel {
|
||||
.mx_SpaceSettingsDialog_generalIcon::before {
|
||||
mask-image: url("@vector-im/compound-design-tokens/icons/settings-solid.svg");
|
||||
}
|
||||
|
||||
.mx_SpaceSettingsDialog_visibilityIcon::before {
|
||||
mask-image: url("@vector-im/compound-design-tokens/icons/visibility-on.svg");
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -12,10 +12,6 @@ Please see LICENSE files in the repository root for full details.
|
||||
|
||||
.mx_ExternalLink_icon {
|
||||
display: inline-block;
|
||||
mask-image: url("@vector-im/compound-design-tokens/icons/pop-out.svg");
|
||||
background-color: currentColor;
|
||||
mask-repeat: no-repeat;
|
||||
mask-size: contain;
|
||||
width: $font-11px;
|
||||
height: $font-11px;
|
||||
margin-left: 0.3rem;
|
||||
|
||||
@@ -1,79 +0,0 @@
|
||||
/*
|
||||
Copyright 2024 New Vector Ltd.
|
||||
Copyright 2022 The Matrix.org Foundation C.I.C.
|
||||
|
||||
SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial
|
||||
Please see LICENSE files in the repository root for full details.
|
||||
*/
|
||||
|
||||
.mx_DecryptionFailureBar {
|
||||
--gap-row: $spacing-8;
|
||||
--gap-column: $spacing-12;
|
||||
--gap: var(--gap-row) var(--gap-column);
|
||||
--size-icon: 24px;
|
||||
|
||||
background-color: $system;
|
||||
padding: $spacing-12;
|
||||
margin-inline: $spacing-16;
|
||||
border-radius: 4px;
|
||||
|
||||
&.mx_DecryptionFailureBar--withEnd {
|
||||
display: flex;
|
||||
flex-flow: wrap;
|
||||
align-items: flex-start;
|
||||
justify-content: space-between;
|
||||
row-gap: calc(var(--gap-row) + $spacing-4); /* Increase spacing between the message and the buttons */
|
||||
|
||||
.mx_DecryptionFailureBar_end {
|
||||
display: flex;
|
||||
flex-wrap: wrap; /* Let the buttons wrapped on a narrow column */
|
||||
gap: var(--buttons-dialog-gap-row) var(--buttons-dialog-gap-column);
|
||||
margin-inline-start: calc(var(--size-icon) + var(--gap-column)); /* Align the button(s) and the message */
|
||||
}
|
||||
}
|
||||
|
||||
.mx_DecryptionFailureBar_start {
|
||||
display: grid;
|
||||
gap: var(--gap);
|
||||
grid-template-areas:
|
||||
"status headline"
|
||||
". message";
|
||||
grid-template-columns: var(--size-icon) auto;
|
||||
|
||||
.mx_DecryptionFailureBar_start_status {
|
||||
grid-area: status;
|
||||
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: var(--gap);
|
||||
|
||||
.mx_Spinner {
|
||||
height: unset; /* Unset height: 100% */
|
||||
}
|
||||
|
||||
.mx_DecryptionFailureBar_start_status_icon {
|
||||
min-width: var(--size-icon);
|
||||
height: var(--size-icon);
|
||||
mask-image: url("@vector-im/compound-design-tokens/icons/error-solid.svg");
|
||||
background-color: $e2e-warning-color;
|
||||
mask-repeat: no-repeat;
|
||||
mask-position: center;
|
||||
mask-size: contain;
|
||||
}
|
||||
}
|
||||
|
||||
.mx_DecryptionFailureBar_start_headline {
|
||||
grid-area: headline;
|
||||
|
||||
font-weight: var(--cpd-font-weight-semibold);
|
||||
font-size: $font-16px;
|
||||
align-self: center;
|
||||
}
|
||||
|
||||
.mx_DecryptionFailureBar_start_message {
|
||||
grid-area: message;
|
||||
|
||||
color: $secondary-content;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -29,16 +29,11 @@ Please see LICENSE files in the repository root for full details.
|
||||
font-weight: 400;
|
||||
opacity: 0.4;
|
||||
|
||||
.mx_ReplyPreview_header_cancel {
|
||||
background-color: $primary-content;
|
||||
mask-image: url("@vector-im/compound-design-tokens/icons/close.svg");
|
||||
mask-repeat: no-repeat;
|
||||
mask-position: center;
|
||||
mask-size: contain;
|
||||
.mx_ReplyPreview_header_cancel svg {
|
||||
color: $primary-content;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
min-width: 20px;
|
||||
min-height: 20px;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,3 +1,3 @@
|
||||
<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M17 13.89C17 15.0256 16.1603 16 14.9272 16H3.08038C1.83972 16 1 15.0256 1 13.89C1 13.5371 1.09078 13.1841 1.27234 12.8542L7.20331 2.08951C7.60426 1.36061 8.30024 1 9.00378 1C9.70733 1 10.3957 1.34527 10.7967 2.08951L16.7277 12.8542C16.9092 13.1841 17 13.5371 17 13.89ZM8.92011 5.00263C8.35011 5.04263 7.93011 5.54264 7.98011 6.11264L8.28011 9.85C8.31011 10.2 8.58011 10.47 8.93011 10.5H8.99011C9.36011 10.5 9.67011 10.22 9.70011 9.85L10.0401 6.11264V5.95264C9.98011 5.38264 9.48011 4.96263 8.92011 5.00263ZM10 12.5C10 13.0523 9.55229 13.5 9 13.5C8.44772 13.5 8 13.0523 8 12.5C8 11.9477 8.44772 11.5 9 11.5C9.55229 11.5 10 11.9477 10 12.5Z" fill="black"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M17 13.89C17 15.0256 16.1603 16 14.9272 16H3.08038C1.83972 16 1 15.0256 1 13.89C1 13.5371 1.09078 13.1841 1.27234 12.8542L7.20331 2.08951C7.60426 1.36061 8.30024 1 9.00378 1C9.70733 1 10.3957 1.34527 10.7967 2.08951L16.7277 12.8542C16.9092 13.1841 17 13.5371 17 13.89ZM8.92011 5.00263C8.35011 5.04263 7.93011 5.54264 7.98011 6.11264L8.28011 9.85C8.31011 10.2 8.58011 10.47 8.93011 10.5H8.99011C9.36011 10.5 9.67011 10.22 9.70011 9.85L10.0401 6.11264V5.95264C9.98011 5.38264 9.48011 4.96263 8.92011 5.00263ZM10 12.5C10 13.0523 9.55229 13.5 9 13.5C8.44772 13.5 8 13.0523 8 12.5C8 11.9477 8.44772 11.5 9 11.5C9.55229 11.5 10 11.9477 10 12.5Z" fill="currentColor"/>
|
||||
</svg>
|
||||
|
||||
|
Before Width: | Height: | Size: 807 B After Width: | Height: | Size: 814 B |
@@ -9,6 +9,7 @@ Please see LICENSE files in the repository root for full details.
|
||||
import React, { type JSX } from "react";
|
||||
import { createRef } from "react";
|
||||
import classNames from "classnames";
|
||||
import { ExploreIcon, DialPadIcon } from "@vector-im/compound-design-tokens/assets/web/icons";
|
||||
|
||||
import dis from "../../dispatcher/dispatcher";
|
||||
import { _t } from "../../languageHandler";
|
||||
@@ -347,7 +348,9 @@ export default class LeftPanel extends React.Component<IProps, IState> {
|
||||
className="mx_LeftPanel_dialPadButton"
|
||||
onClick={this.onDialPad}
|
||||
title={_t("left_panel|open_dial_pad")}
|
||||
/>
|
||||
>
|
||||
<DialPadIcon />
|
||||
</AccessibleButton>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -358,7 +361,9 @@ export default class LeftPanel extends React.Component<IProps, IState> {
|
||||
className="mx_LeftPanel_exploreButton"
|
||||
onClick={this.onExplore}
|
||||
title={_t("action|explore_rooms")}
|
||||
/>
|
||||
>
|
||||
<ExploreIcon />
|
||||
</AccessibleButton>
|
||||
);
|
||||
}
|
||||
|
||||
|
||||
@@ -17,7 +17,7 @@ import {
|
||||
type SyncState,
|
||||
type SyncStateData,
|
||||
} from "matrix-js-sdk/src/matrix";
|
||||
import { WarningIcon } from "@vector-im/compound-design-tokens/assets/web/icons";
|
||||
import { RestartIcon, WarningIcon, DeleteIcon } from "@vector-im/compound-design-tokens/assets/web/icons";
|
||||
|
||||
import { _t, _td } from "../../languageHandler";
|
||||
import Resend from "../../Resend";
|
||||
@@ -237,10 +237,12 @@ export default class RoomStatusBar extends React.PureComponent<IProps, IState> {
|
||||
|
||||
let buttonRow = (
|
||||
<>
|
||||
<AccessibleButton onClick={this.onCancelAllClick} className="mx_RoomStatusBar_unsentCancelAllBtn">
|
||||
<AccessibleButton onClick={this.onCancelAllClick}>
|
||||
<DeleteIcon />
|
||||
{_t("room|status_bar|delete_all")}
|
||||
</AccessibleButton>
|
||||
<AccessibleButton onClick={this.onResendAllClick} className="mx_RoomStatusBar_unsentRetry">
|
||||
<RestartIcon />
|
||||
{_t("room|status_bar|retry_all")}
|
||||
</AccessibleButton>
|
||||
</>
|
||||
|
||||
@@ -45,6 +45,7 @@ import { debounce, throttle } from "lodash";
|
||||
import { CryptoEvent } from "matrix-js-sdk/src/crypto-api";
|
||||
import { type ViewRoomOpts } from "@matrix-org/react-sdk-module-api/lib/lifecycles/RoomViewLifecycle";
|
||||
import { type RoomViewProps } from "@element-hq/element-web-module-api";
|
||||
import { RestartIcon } from "@vector-im/compound-design-tokens/assets/web/icons";
|
||||
|
||||
import shouldHideEvent from "../../shouldHideEvent";
|
||||
import { _t } from "../../languageHandler";
|
||||
@@ -330,7 +331,8 @@ function LocalRoomView(props: LocalRoomViewProps): ReactElement {
|
||||
|
||||
if (room.isError) {
|
||||
const buttons = (
|
||||
<AccessibleButton onClick={onRetryClicked} className="mx_RoomStatusBar_unsentRetry">
|
||||
<AccessibleButton onClick={onRetryClicked}>
|
||||
<RestartIcon />
|
||||
{_t("action|retry")}
|
||||
</AccessibleButton>
|
||||
);
|
||||
|
||||
@@ -10,6 +10,7 @@ Please see LICENSE files in the repository root for full details.
|
||||
import React, { createRef, type HTMLProps } from "react";
|
||||
import { throttle } from "lodash";
|
||||
import classNames from "classnames";
|
||||
import { CloseIcon } from "@vector-im/compound-design-tokens/assets/web/icons";
|
||||
|
||||
import AccessibleButton from "../../components/views/elements/AccessibleButton";
|
||||
import { getKeyBindingsManager } from "../../KeyBindingsManager";
|
||||
@@ -124,7 +125,9 @@ export default class SearchBox extends React.Component<IProps, IState> {
|
||||
onClick={() => {
|
||||
this.clearSearch("button");
|
||||
}}
|
||||
/>
|
||||
>
|
||||
<CloseIcon />
|
||||
</AccessibleButton>
|
||||
) : undefined;
|
||||
|
||||
// show a shorter placeholder when blurred, if requested
|
||||
|
||||
@@ -26,7 +26,7 @@ export class Tab<T extends string> {
|
||||
* Creates a new tab.
|
||||
* @param {string} id The tab's ID.
|
||||
* @param {string} label The untranslated tab label.
|
||||
* @param {string|JSX.Element} icon An SVG element to use for the tab icon. Can also be a string for legacy icons, in which case it is the class for the tab icon. This should be a simple mask.
|
||||
* @param {string|JSX.Element} icon An SVG element to use for the tab icon.
|
||||
* @param {JSX.Element} body The JSX for the tab container.
|
||||
* @param {string} screenName The screen name to report to Posthog.
|
||||
* @param {string} labelClassName Additional class to add to the tab label.
|
||||
@@ -34,7 +34,7 @@ export class Tab<T extends string> {
|
||||
public constructor(
|
||||
public readonly id: T,
|
||||
public readonly label: TranslationKey,
|
||||
public readonly icon: string | JSX.Element | null,
|
||||
public readonly icon: JSX.Element | null,
|
||||
public readonly body: JSX.Element,
|
||||
public readonly screenName?: ScreenName,
|
||||
public readonly labelClassName?: string,
|
||||
|
||||
@@ -13,6 +13,7 @@ import { type MatrixCall } from "matrix-js-sdk/src/webrtc/call";
|
||||
import { logger } from "matrix-js-sdk/src/logger";
|
||||
import { uniqBy } from "lodash";
|
||||
import { RichList, RichItem, PillInput, Pill } from "@element-hq/web-shared-components";
|
||||
import { DialPadIcon, UserProfileSolidIcon } from "@vector-im/compound-design-tokens/assets/web/icons";
|
||||
|
||||
import { Icon as EmailPillAvatarIcon } from "../../../../res/img/icon-email-pill-avatar.svg";
|
||||
import { _t, _td } from "../../../languageHandler";
|
||||
@@ -1400,7 +1401,7 @@ export default class InviteDialog extends React.PureComponent<Props, IInviteDial
|
||||
new Tab(
|
||||
TabId.UserDirectory,
|
||||
_td("invite|transfer_user_directory_tab"),
|
||||
"mx_InviteDialog_userDirectoryIcon",
|
||||
<UserProfileSolidIcon />,
|
||||
usersSection,
|
||||
),
|
||||
];
|
||||
@@ -1440,9 +1441,7 @@ export default class InviteDialog extends React.PureComponent<Props, IInviteDial
|
||||
<Dialpad hasDial={false} onDigitPress={this.onDigitPress} onDeletePress={this.onDeletePress} />
|
||||
</div>
|
||||
);
|
||||
tabs.push(
|
||||
new Tab(TabId.DialPad, _td("invite|transfer_dial_pad_tab"), "mx_InviteDialog_dialPadIcon", dialPadSection),
|
||||
);
|
||||
tabs.push(new Tab(TabId.DialPad, _td("invite|transfer_dial_pad_tab"), <DialPadIcon />, dialPadSection));
|
||||
|
||||
const consultConnectSection = (
|
||||
<div className="mx_InviteDialog_transferConsultConnect">
|
||||
|
||||
@@ -8,6 +8,7 @@ Please see LICENSE files in the repository root for full details.
|
||||
|
||||
import React, { useMemo, useState } from "react";
|
||||
import { type Room, JoinRule } from "matrix-js-sdk/src/matrix";
|
||||
import { InfoSolidIcon } from "@vector-im/compound-design-tokens/assets/web/icons";
|
||||
|
||||
import { _t } from "../../../languageHandler";
|
||||
import DialogButtons from "../elements/DialogButtons";
|
||||
@@ -88,7 +89,12 @@ const LeaveSpaceDialog: React.FC<IProps> = ({ space, onFinished }) => {
|
||||
/>
|
||||
)}
|
||||
|
||||
{onlyAdminWarning && <div className="mx_LeaveSpaceDialog_section_warning">{onlyAdminWarning}</div>}
|
||||
{onlyAdminWarning && (
|
||||
<div className="mx_LeaveSpaceDialog_section_warning">
|
||||
<InfoSolidIcon />
|
||||
{onlyAdminWarning}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
<DialogButtons
|
||||
primaryButton={_t("space|leave_dialog_action")}
|
||||
|
||||
@@ -9,6 +9,7 @@ Please see LICENSE files in the repository root for full details.
|
||||
import React, { useMemo, useState } from "react";
|
||||
import { Room } from "matrix-js-sdk/src/matrix";
|
||||
import { KnownMembership } from "matrix-js-sdk/src/types";
|
||||
import { InfoSolidIcon } from "@vector-im/compound-design-tokens/assets/web/icons";
|
||||
|
||||
import { _t } from "../../../languageHandler";
|
||||
import BaseDialog from "./BaseDialog";
|
||||
@@ -126,6 +127,7 @@ const ManageRestrictedJoinRuleDialog: React.FC<IProps> = ({ room, selected = [],
|
||||
if (newSelected.size < 1) {
|
||||
inviteOnlyWarning = (
|
||||
<div className="mx_ManageRestrictedJoinRuleDialog_section_info">
|
||||
<InfoSolidIcon />
|
||||
{_t("room_settings|security|join_rule_restricted_dialog_empty_warning")}
|
||||
</div>
|
||||
);
|
||||
@@ -183,7 +185,8 @@ const ManageRestrictedJoinRuleDialog: React.FC<IProps> = ({ room, selected = [],
|
||||
<div className="mx_ManageRestrictedJoinRuleDialog_section">
|
||||
<h3>{_t("room_settings|security|join_rule_restricted_dialog_heading_other")}</h3>
|
||||
<div className="mx_ManageRestrictedJoinRuleDialog_section_info">
|
||||
<div>{_t("room_settings|security|join_rule_restricted_dialog_heading_unknown")}</div>
|
||||
<InfoSolidIcon />
|
||||
{_t("room_settings|security|join_rule_restricted_dialog_heading_unknown")}
|
||||
</div>
|
||||
{filteredOtherEntries.map((space) => {
|
||||
return (
|
||||
|
||||
@@ -10,6 +10,14 @@ Please see LICENSE files in the repository root for full details.
|
||||
|
||||
import React from "react";
|
||||
import { RoomEvent, type Room, RoomStateEvent, type MatrixEvent, EventType } from "matrix-js-sdk/src/matrix";
|
||||
import {
|
||||
AdminIcon,
|
||||
GroupIcon,
|
||||
LockSolidIcon,
|
||||
PollsIcon,
|
||||
SettingsSolidIcon,
|
||||
VoiceCallSolidIcon,
|
||||
} from "@vector-im/compound-design-tokens/assets/web/icons";
|
||||
|
||||
import TabbedView, { Tab } from "../../structures/TabbedView";
|
||||
import { _t, _td } from "../../../languageHandler";
|
||||
@@ -31,6 +39,9 @@ import { type NonEmptyArray } from "../../../@types/common";
|
||||
import { PollHistoryTab } from "../settings/tabs/room/PollHistoryTab";
|
||||
import ErrorBoundary from "../elements/ErrorBoundary";
|
||||
import { PeopleRoomSettingsTab } from "../settings/tabs/room/PeopleRoomSettingsTab";
|
||||
import { Icon as AdvancedIcon } from "../../../../res/img/element-icons/room/settings/advanced.svg";
|
||||
import { Icon as NotificationsIcon } from "../../../../res/img/element-icons/notifications.svg";
|
||||
import { Icon as BridgeIcon } from "../../../../res/img/feather-customised/bridge.svg";
|
||||
|
||||
export const enum RoomSettingsTab {
|
||||
General = "ROOM_GENERAL_TAB",
|
||||
@@ -129,7 +140,7 @@ class RoomSettingsDialog extends React.Component<IProps, IState> {
|
||||
new Tab(
|
||||
RoomSettingsTab.General,
|
||||
_td("common|general"),
|
||||
"mx_RoomSettingsDialog_settingsIcon",
|
||||
<SettingsSolidIcon />,
|
||||
<GeneralRoomSettingsTab room={this.state.room} />,
|
||||
"RoomSettingsGeneral",
|
||||
),
|
||||
@@ -139,7 +150,7 @@ class RoomSettingsDialog extends React.Component<IProps, IState> {
|
||||
new Tab(
|
||||
RoomSettingsTab.People,
|
||||
_td("common|people"),
|
||||
"mx_RoomSettingsDialog_peopleIcon",
|
||||
<GroupIcon />,
|
||||
<PeopleRoomSettingsTab room={this.state.room} />,
|
||||
),
|
||||
);
|
||||
@@ -149,7 +160,7 @@ class RoomSettingsDialog extends React.Component<IProps, IState> {
|
||||
new Tab(
|
||||
RoomSettingsTab.Voip,
|
||||
_td("settings|voip|title"),
|
||||
"mx_RoomSettingsDialog_voiceIcon",
|
||||
<VoiceCallSolidIcon />,
|
||||
<VoipRoomSettingsTab room={this.state.room} />,
|
||||
),
|
||||
);
|
||||
@@ -158,7 +169,7 @@ class RoomSettingsDialog extends React.Component<IProps, IState> {
|
||||
new Tab(
|
||||
RoomSettingsTab.Security,
|
||||
_td("room_settings|security|title"),
|
||||
"mx_RoomSettingsDialog_securityIcon",
|
||||
<LockSolidIcon />,
|
||||
<SecurityRoomSettingsTab room={this.state.room} closeSettingsFn={() => this.props.onFinished(true)} />,
|
||||
"RoomSettingsSecurityPrivacy",
|
||||
),
|
||||
@@ -167,7 +178,7 @@ class RoomSettingsDialog extends React.Component<IProps, IState> {
|
||||
new Tab(
|
||||
RoomSettingsTab.Roles,
|
||||
_td("room_settings|permissions|title"),
|
||||
"mx_RoomSettingsDialog_rolesIcon",
|
||||
<AdminIcon />,
|
||||
<RolesRoomSettingsTab room={this.state.room} />,
|
||||
"RoomSettingsRolesPermissions",
|
||||
),
|
||||
@@ -176,7 +187,7 @@ class RoomSettingsDialog extends React.Component<IProps, IState> {
|
||||
new Tab(
|
||||
RoomSettingsTab.Notifications,
|
||||
_td("notifications|enable_prompt_toast_title"),
|
||||
"mx_RoomSettingsDialog_notificationsIcon",
|
||||
<NotificationsIcon />,
|
||||
<NotificationSettingsTab
|
||||
roomId={this.state.room.roomId}
|
||||
closeSettingsFn={() => this.props.onFinished(true)}
|
||||
@@ -190,7 +201,7 @@ class RoomSettingsDialog extends React.Component<IProps, IState> {
|
||||
new Tab(
|
||||
RoomSettingsTab.Bridges,
|
||||
_td("room_settings|bridges|title"),
|
||||
"mx_RoomSettingsDialog_bridgesIcon",
|
||||
<BridgeIcon />,
|
||||
<BridgeSettingsTab room={this.state.room} />,
|
||||
"RoomSettingsBridges",
|
||||
),
|
||||
@@ -201,7 +212,7 @@ class RoomSettingsDialog extends React.Component<IProps, IState> {
|
||||
new Tab(
|
||||
RoomSettingsTab.PollHistory,
|
||||
_td("right_panel|polls_button"),
|
||||
"mx_RoomSettingsDialog_pollsIcon",
|
||||
<PollsIcon />,
|
||||
<PollHistoryTab room={this.state.room} onFinished={() => this.props.onFinished(true)} />,
|
||||
),
|
||||
);
|
||||
@@ -211,7 +222,7 @@ class RoomSettingsDialog extends React.Component<IProps, IState> {
|
||||
new Tab(
|
||||
RoomSettingsTab.Advanced,
|
||||
_td("common|advanced"),
|
||||
"mx_RoomSettingsDialog_warningIcon",
|
||||
<AdvancedIcon />,
|
||||
<AdvancedRoomSettingsTab
|
||||
room={this.state.room}
|
||||
closeSettingsFn={() => this.props.onFinished(true)}
|
||||
|
||||
@@ -8,6 +8,7 @@ Please see LICENSE files in the repository root for full details.
|
||||
|
||||
import React, { type ChangeEvent } from "react";
|
||||
import { type Room } from "matrix-js-sdk/src/matrix";
|
||||
import { VisibilityOnIcon } from "@vector-im/compound-design-tokens/assets/web/icons";
|
||||
|
||||
import { _t, _td } from "../../../languageHandler";
|
||||
import BaseDialog from "../dialogs/BaseDialog";
|
||||
@@ -63,7 +64,7 @@ const SpacePreferencesDialog: React.FC<IProps> = ({ space, onFinished }) => {
|
||||
new Tab(
|
||||
SpacePreferenceTab.Appearance,
|
||||
_td("common|appearance"),
|
||||
"mx_SpacePreferencesDialog_appearanceIcon",
|
||||
<VisibilityOnIcon />,
|
||||
<SpacePreferencesAppearanceTab space={space} />,
|
||||
),
|
||||
];
|
||||
|
||||
@@ -8,6 +8,7 @@ Please see LICENSE files in the repository root for full details.
|
||||
|
||||
import React, { useMemo } from "react";
|
||||
import { type Room, type MatrixClient } from "matrix-js-sdk/src/matrix";
|
||||
import { AdminIcon, SettingsSolidIcon, VisibilityOnIcon } from "@vector-im/compound-design-tokens/assets/web/icons";
|
||||
|
||||
import { _t, _td } from "../../../languageHandler";
|
||||
import BaseDialog from "./BaseDialog";
|
||||
@@ -22,6 +23,7 @@ import AdvancedRoomSettingsTab from "../settings/tabs/room/AdvancedRoomSettingsT
|
||||
import RolesRoomSettingsTab from "../settings/tabs/room/RolesRoomSettingsTab";
|
||||
import { Action } from "../../../dispatcher/actions";
|
||||
import { type NonEmptyArray } from "../../../@types/common";
|
||||
import { Icon as AdvancedIcon } from "../../../../res/img/element-icons/room/settings/advanced.svg";
|
||||
|
||||
export enum SpaceSettingsTab {
|
||||
General = "SPACE_GENERAL_TAB",
|
||||
@@ -48,26 +50,26 @@ const SpaceSettingsDialog: React.FC<IProps> = ({ matrixClient: cli, space, onFin
|
||||
new Tab(
|
||||
SpaceSettingsTab.General,
|
||||
_td("common|general"),
|
||||
"mx_SpaceSettingsDialog_generalIcon",
|
||||
<SettingsSolidIcon />,
|
||||
<SpaceSettingsGeneralTab matrixClient={cli} space={space} />,
|
||||
),
|
||||
new Tab(
|
||||
SpaceSettingsTab.Visibility,
|
||||
_td("room_settings|visibility|title"),
|
||||
"mx_SpaceSettingsDialog_visibilityIcon",
|
||||
<VisibilityOnIcon />,
|
||||
<SpaceSettingsVisibilityTab matrixClient={cli} space={space} closeSettingsFn={onFinished} />,
|
||||
),
|
||||
new Tab(
|
||||
SpaceSettingsTab.Roles,
|
||||
_td("room_settings|permissions|title"),
|
||||
"mx_RoomSettingsDialog_rolesIcon",
|
||||
<AdminIcon />,
|
||||
<RolesRoomSettingsTab room={space} />,
|
||||
),
|
||||
SettingsStore.getValue(UIFeature.AdvancedSettings)
|
||||
? new Tab(
|
||||
SpaceSettingsTab.Advanced,
|
||||
_td("common|advanced"),
|
||||
"mx_RoomSettingsDialog_warningIcon",
|
||||
<AdvancedIcon />,
|
||||
<AdvancedRoomSettingsTab room={space} closeSettingsFn={onFinished} />,
|
||||
)
|
||||
: null,
|
||||
|
||||
@@ -8,6 +8,7 @@ Please see LICENSE files in the repository root for full details.
|
||||
|
||||
import React, { type DetailedHTMLProps, type AnchorHTMLAttributes } from "react";
|
||||
import classNames from "classnames";
|
||||
import PopOutIcon from "@vector-im/compound-design-tokens/assets/web/icons/pop-out";
|
||||
|
||||
interface Props extends DetailedHTMLProps<AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement> {}
|
||||
|
||||
@@ -17,7 +18,7 @@ interface Props extends DetailedHTMLProps<AnchorHTMLAttributes<HTMLAnchorElement
|
||||
const ExternalLink: React.FC<Props> = ({ children, className, ...rest }) => (
|
||||
<a target="_blank" rel="noreferrer noopener" {...rest} className={classNames("mx_ExternalLink", className)}>
|
||||
{children}
|
||||
<i className="mx_ExternalLink_icon" />
|
||||
<PopOutIcon className="mx_ExternalLink_icon" />
|
||||
</a>
|
||||
);
|
||||
|
||||
|
||||
@@ -8,6 +8,7 @@ Please see LICENSE files in the repository root for full details.
|
||||
|
||||
import React, { type ReactElement } from "react";
|
||||
import { JoinRule } from "matrix-js-sdk/src/matrix";
|
||||
import { GroupIcon, LockSolidIcon, PublicIcon } from "@vector-im/compound-design-tokens/assets/web/icons";
|
||||
|
||||
import Dropdown from "./Dropdown";
|
||||
import { type NonEmptyArray } from "../../../@types/common";
|
||||
@@ -36,6 +37,7 @@ const JoinRuleDropdown: React.FC<IProps> = ({
|
||||
}) => {
|
||||
const options = [
|
||||
<div key={JoinRule.Invite} className="mx_JoinRuleDropdown_invite">
|
||||
<LockSolidIcon />
|
||||
{labelInvite}
|
||||
</div>,
|
||||
] as NonEmptyArray<ReactElement & { key: string }>;
|
||||
@@ -44,6 +46,7 @@ const JoinRuleDropdown: React.FC<IProps> = ({
|
||||
options.push(
|
||||
(
|
||||
<div key={JoinRule.Public} className="mx_JoinRuleDropdown_public">
|
||||
<PublicIcon />
|
||||
{labelPublic}
|
||||
</div>
|
||||
) as ReactElement & { key: string },
|
||||
@@ -65,6 +68,7 @@ const JoinRuleDropdown: React.FC<IProps> = ({
|
||||
options.unshift(
|
||||
(
|
||||
<div key={JoinRule.Restricted} className="mx_JoinRuleDropdown_restricted">
|
||||
<GroupIcon />
|
||||
{labelRestricted}
|
||||
</div>
|
||||
) as ReactElement & { key: string },
|
||||
|
||||
@@ -8,6 +8,7 @@ Please see LICENSE files in the repository root for full details.
|
||||
|
||||
import React, { type JSX } from "react";
|
||||
import { type MatrixEvent } from "matrix-js-sdk/src/matrix";
|
||||
import { CloseIcon } from "@vector-im/compound-design-tokens/assets/web/icons";
|
||||
|
||||
import dis from "../../../dispatcher/dispatcher";
|
||||
import { _t } from "../../../languageHandler";
|
||||
@@ -44,7 +45,9 @@ export default class ReplyPreview extends React.Component<IProps> {
|
||||
<AccessibleButton
|
||||
className="mx_ReplyPreview_header_cancel"
|
||||
onClick={() => cancelQuoting(this.context.timelineRenderingType)}
|
||||
/>
|
||||
>
|
||||
<CloseIcon />
|
||||
</AccessibleButton>
|
||||
</div>
|
||||
<ReplyTile mxEvent={this.props.replyToEvent} permalinkCreator={this.props.permalinkCreator} />
|
||||
</div>
|
||||
|
||||
@@ -74,9 +74,21 @@ exports[`dialogTermsInteractionCallback should render a dialog with the expected
|
||||
target="_blank"
|
||||
>
|
||||
Terms
|
||||
<i
|
||||
<svg
|
||||
class="mx_ExternalLink_icon"
|
||||
/>
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="0 0 24 24"
|
||||
width="1em"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M5 3h6a1 1 0 1 1 0 2H5v14h14v-6a1 1 0 1 1 2 0v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2"
|
||||
/>
|
||||
<path
|
||||
d="M15 3h5a1 1 0 0 1 1 1v5a1 1 0 1 1-2 0V6.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L17.586 5H15a1 1 0 1 1 0-2"
|
||||
/>
|
||||
</svg>
|
||||
</a>
|
||||
</td>
|
||||
<td>
|
||||
|
||||
@@ -8,15 +8,16 @@ Please see LICENSE files in the repository root for full details.
|
||||
|
||||
import React from "react";
|
||||
import { act, fireEvent, render } from "jest-matrix-react";
|
||||
import { SettingsSolidIcon, VisibilityOnIcon, LabsIcon } from "@vector-im/compound-design-tokens/assets/web/icons";
|
||||
|
||||
import TabbedView, { Tab, TabLocation } from "../../../../src/components/structures/TabbedView";
|
||||
import { type NonEmptyArray } from "../../../../src/@types/common";
|
||||
import { _t } from "../../../../src/languageHandler";
|
||||
|
||||
describe("<TabbedView />", () => {
|
||||
const generalTab = new Tab("GENERAL", "common|general", "general", <div>general</div>);
|
||||
const labsTab = new Tab("LABS", "common|labs", "labs", <div>labs</div>);
|
||||
const appearanceTab = new Tab("APPEARANCE", "common|appearance", "appearance", <div>appearance</div>);
|
||||
const generalTab = new Tab("GENERAL", "common|general", <SettingsSolidIcon />, <div>general</div>);
|
||||
const labsTab = new Tab("LABS", "common|labs", <LabsIcon />, <div>labs</div>);
|
||||
const appearanceTab = new Tab("APPEARANCE", "common|appearance", <VisibilityOnIcon />, <div>appearance</div>);
|
||||
const defaultProps = {
|
||||
tabLocation: TabLocation.LEFT,
|
||||
tabs: [generalTab, labsTab, appearanceTab] as NonEmptyArray<Tab<any>>,
|
||||
|
||||
@@ -33,9 +33,21 @@ exports[`RoomStatusBar <RoomStatusBar /> unsent messages should render warning w
|
||||
target="_blank"
|
||||
>
|
||||
our terms and conditions
|
||||
<i
|
||||
<svg
|
||||
class="mx_ExternalLink_icon"
|
||||
/>
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="0 0 24 24"
|
||||
width="1em"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M5 3h6a1 1 0 1 1 0 2H5v14h14v-6a1 1 0 1 1 2 0v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2"
|
||||
/>
|
||||
<path
|
||||
d="M15 3h5a1 1 0 0 1 1 1v5a1 1 0 1 1-2 0V6.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L17.586 5H15a1 1 0 1 1 0-2"
|
||||
/>
|
||||
</svg>
|
||||
</a>
|
||||
.
|
||||
</span>
|
||||
@@ -50,10 +62,21 @@ exports[`RoomStatusBar <RoomStatusBar /> unsent messages should render warning w
|
||||
class="mx_RoomStatusBar_unsentButtonBar"
|
||||
>
|
||||
<div
|
||||
class="mx_AccessibleButton mx_RoomStatusBar_unsentCancelAllBtn"
|
||||
class="mx_AccessibleButton"
|
||||
role="button"
|
||||
tabindex="0"
|
||||
>
|
||||
<svg
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="0 0 24 24"
|
||||
width="1em"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M7 21q-.824 0-1.412-.587A1.93 1.93 0 0 1 5 19V6a.97.97 0 0 1-.713-.287A.97.97 0 0 1 4 5q0-.424.287-.713A.97.97 0 0 1 5 4h4q0-.424.287-.712A.97.97 0 0 1 10 3h4q.424 0 .713.288Q15 3.575 15 4h4q.424 0 .712.287Q20 4.576 20 5t-.288.713A.97.97 0 0 1 19 6v13q0 .824-.587 1.413A1.93 1.93 0 0 1 17 21zM7 6v13h10V6zm2 10q0 .424.287.712Q9.576 17 10 17t.713-.288A.97.97 0 0 0 11 16V9a.97.97 0 0 0-.287-.713A.97.97 0 0 0 10 8a.97.97 0 0 0-.713.287A.97.97 0 0 0 9 9zm4 0q0 .424.287.712.288.288.713.288.424 0 .713-.288A.97.97 0 0 0 15 16V9a.97.97 0 0 0-.287-.713A.97.97 0 0 0 14 8a.97.97 0 0 0-.713.287A.97.97 0 0 0 13 9z"
|
||||
/>
|
||||
</svg>
|
||||
Delete all
|
||||
</div>
|
||||
<div
|
||||
@@ -61,6 +84,17 @@ exports[`RoomStatusBar <RoomStatusBar /> unsent messages should render warning w
|
||||
role="button"
|
||||
tabindex="0"
|
||||
>
|
||||
<svg
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="0 0 24 24"
|
||||
width="1em"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M18.93 8A8 8 0 1 1 4 12a1 1 0 1 0-2 0c0 5.523 4.477 10 10 10s10-4.477 10-10a10 10 0 0 0-.832-4A10 10 0 0 0 12 2a9.99 9.99 0 0 0-8 3.999V4a1 1 0 0 0-2 0v4a1 1 0 0 0 1 1h4a1 1 0 0 0 0-2H5.755A7.99 7.99 0 0 1 12 4a8 8 0 0 1 6.93 4"
|
||||
/>
|
||||
</svg>
|
||||
Retry all
|
||||
</div>
|
||||
</div>
|
||||
@@ -106,10 +140,21 @@ exports[`RoomStatusBar <RoomStatusBar /> unsent messages should render warning w
|
||||
class="mx_RoomStatusBar_unsentButtonBar"
|
||||
>
|
||||
<div
|
||||
class="mx_AccessibleButton mx_RoomStatusBar_unsentCancelAllBtn"
|
||||
class="mx_AccessibleButton"
|
||||
role="button"
|
||||
tabindex="0"
|
||||
>
|
||||
<svg
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="0 0 24 24"
|
||||
width="1em"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M7 21q-.824 0-1.412-.587A1.93 1.93 0 0 1 5 19V6a.97.97 0 0 1-.713-.287A.97.97 0 0 1 4 5q0-.424.287-.713A.97.97 0 0 1 5 4h4q0-.424.287-.712A.97.97 0 0 1 10 3h4q.424 0 .713.288Q15 3.575 15 4h4q.424 0 .712.287Q20 4.576 20 5t-.288.713A.97.97 0 0 1 19 6v13q0 .824-.587 1.413A1.93 1.93 0 0 1 17 21zM7 6v13h10V6zm2 10q0 .424.287.712Q9.576 17 10 17t.713-.288A.97.97 0 0 0 11 16V9a.97.97 0 0 0-.287-.713A.97.97 0 0 0 10 8a.97.97 0 0 0-.713.287A.97.97 0 0 0 9 9zm4 0q0 .424.287.712.288.288.713.288.424 0 .713-.288A.97.97 0 0 0 15 16V9a.97.97 0 0 0-.287-.713A.97.97 0 0 0 14 8a.97.97 0 0 0-.713.287A.97.97 0 0 0 13 9z"
|
||||
/>
|
||||
</svg>
|
||||
Delete all
|
||||
</div>
|
||||
<div
|
||||
@@ -117,6 +162,17 @@ exports[`RoomStatusBar <RoomStatusBar /> unsent messages should render warning w
|
||||
role="button"
|
||||
tabindex="0"
|
||||
>
|
||||
<svg
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="0 0 24 24"
|
||||
width="1em"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M18.93 8A8 8 0 1 1 4 12a1 1 0 1 0-2 0c0 5.523 4.477 10 10 10s10-4.477 10-10a10 10 0 0 0-.832-4A10 10 0 0 0 12 2a9.99 9.99 0 0 0-8 3.999V4a1 1 0 0 0-2 0v4a1 1 0 0 0 1 1h4a1 1 0 0 0 0-2H5.755A7.99 7.99 0 0 1 12 4a8 8 0 0 1 6.93 4"
|
||||
/>
|
||||
</svg>
|
||||
Retry all
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -218,10 +218,21 @@ exports[`RoomView for a local room in state ERROR should match the snapshot 1`]
|
||||
class="mx_RoomStatusBar_unsentButtonBar"
|
||||
>
|
||||
<div
|
||||
class="mx_AccessibleButton mx_RoomStatusBar_unsentRetry"
|
||||
class="mx_AccessibleButton"
|
||||
role="button"
|
||||
tabindex="0"
|
||||
>
|
||||
<svg
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="0 0 24 24"
|
||||
width="1em"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M18.93 8A8 8 0 1 1 4 12a1 1 0 1 0-2 0c0 5.523 4.477 10 10 10s10-4.477 10-10a10 10 0 0 0-.832-4A10 10 0 0 0 12 2a9.99 9.99 0 0 0-8 3.999V4a1 1 0 0 0-2 0v4a1 1 0 0 0 1 1h4a1 1 0 0 0 0-2H5.755A7.99 7.99 0 0 1 12 4a8 8 0 0 1 6.93 4"
|
||||
/>
|
||||
</svg>
|
||||
Retry
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -17,7 +17,19 @@ exports[`SpaceHierarchy <SpaceHierarchy /> renders 1`] = `
|
||||
class="mx_AccessibleButton mx_SearchBox_closeButton"
|
||||
role="button"
|
||||
tabindex="-1"
|
||||
/>
|
||||
>
|
||||
<svg
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="0 0 24 24"
|
||||
width="1em"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M6.293 6.293a1 1 0 0 1 1.414 0L12 10.586l4.293-4.293a1 1 0 1 1 1.414 1.414L13.414 12l4.293 4.293a1 1 0 0 1-1.414 1.414L12 13.414l-4.293 4.293a1 1 0 0 1-1.414-1.414L10.586 12 6.293 7.707a1 1 0 0 1 0-1.414"
|
||||
/>
|
||||
</svg>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="mx_SpaceHierarchy_listHeader"
|
||||
@@ -594,7 +606,19 @@ exports[`SpaceHierarchy <SpaceHierarchy /> should not render cycles 1`] = `
|
||||
class="mx_AccessibleButton mx_SearchBox_closeButton"
|
||||
role="button"
|
||||
tabindex="-1"
|
||||
/>
|
||||
>
|
||||
<svg
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="0 0 24 24"
|
||||
width="1em"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M6.293 6.293a1 1 0 0 1 1.414 0L12 10.586l4.293-4.293a1 1 0 1 1 1.414 1.414L13.414 12l4.293 4.293a1 1 0 0 1-1.414 1.414L12 13.414l-4.293 4.293a1 1 0 0 1-1.414-1.414L10.586 12 6.293 7.707a1 1 0 0 1 0-1.414"
|
||||
/>
|
||||
</svg>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="mx_SpaceHierarchy_listHeader"
|
||||
|
||||
@@ -18,9 +18,17 @@ exports[`<TabbedView /> renders tabs 1`] = `
|
||||
role="tab"
|
||||
tabindex="0"
|
||||
>
|
||||
<span
|
||||
class="mx_TabbedView_maskedIcon general"
|
||||
/>
|
||||
<svg
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="0 0 24 24"
|
||||
width="1em"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M12.731 2C13.432 2 14 2.568 14 3.269c0 .578.396 1.074.935 1.286q.128.052.253.106c.531.23 1.162.16 1.572-.25a1.27 1.27 0 0 1 1.794 0l1.034 1.035a1.27 1.27 0 0 1 0 1.794c-.41.41-.48 1.04-.248 1.572l.105.253c.212.539.708.935 1.286.935.701 0 1.269.568 1.269 1.269v1.462c0 .701-.568 1.269-1.269 1.269-.578 0-1.074.396-1.287.935q-.05.128-.104.253c-.232.531-.161 1.162.248 1.572a1.27 1.27 0 0 1 0 1.794l-1.034 1.034a1.27 1.27 0 0 1-1.794 0c-.41-.41-1.04-.48-1.572-.248a8 8 0 0 1-.253.105c-.539.212-.935.708-.935 1.286 0 .701-.568 1.269-1.269 1.269H11.27c-.702 0-1.27-.568-1.27-1.269 0-.578-.396-1.074-.935-1.287a8 8 0 0 1-.253-.104c-.531-.232-1.162-.161-1.572.248a1.27 1.27 0 0 1-1.794 0l-1.034-1.034a1.27 1.27 0 0 1 0-1.794c.41-.41.48-1.04.249-1.572a8 8 0 0 1-.106-.253C4.343 14.396 3.847 14 3.27 14 2.568 14 2 13.432 2 12.731V11.27c0-.702.568-1.27 1.269-1.27.578 0 1.074-.396 1.286-.935q.052-.128.106-.253c.23-.531.16-1.162-.25-1.572a1.27 1.27 0 0 1 0-1.794l1.035-1.034a1.27 1.27 0 0 1 1.794 0c.41.41 1.04.48 1.572.249a8 8 0 0 1 .253-.106c.539-.212.935-.708.935-1.286C10 2.568 10.568 2 11.269 2zM12 16a4 4 0 1 0 0-8 4 4 0 0 0 0 8"
|
||||
/>
|
||||
</svg>
|
||||
<span
|
||||
class="mx_TabbedView_tabLabel_text"
|
||||
id="mx_tabpanel_GENERAL_label"
|
||||
@@ -36,9 +44,25 @@ exports[`<TabbedView /> renders tabs 1`] = `
|
||||
role="tab"
|
||||
tabindex="-1"
|
||||
>
|
||||
<span
|
||||
class="mx_TabbedView_maskedIcon labs"
|
||||
/>
|
||||
<svg
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="0 0 24 24"
|
||||
width="1em"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M12 5a1 1 0 0 1-1-1V3a1 1 0 1 1 2 0v1a1 1 0 0 1-1 1m-7.071-.071a1 1 0 0 1 1.414 0l.707.707A1 1 0 0 1 5.636 7.05l-.707-.707a1 1 0 0 1 0-1.414"
|
||||
/>
|
||||
<path
|
||||
clip-rule="evenodd"
|
||||
d="M15.734 15.325C15.316 15.795 15 16.371 15 17v2a2 2 0 0 1-2 2h-2a2 2 0 0 1-2-2v-2c0-.63-.316-1.205-.734-1.675a5 5 0 1 1 7.468 0m-1.493-1.33a3 3 0 1 0-4.482 0c.433.486.894 1.166 1.112 2.005h2.258c.218-.84.679-1.52 1.112-2.005M13 18h-2v1h2z"
|
||||
fill-rule="evenodd"
|
||||
/>
|
||||
<path
|
||||
d="M2 12a1 1 0 0 1 1-1h1a1 1 0 1 1 0 2H3a1 1 0 0 1-1-1m18-1a1 1 0 1 0 0 2h1a1 1 0 1 0 0-2zm-3.05-5.364a1 1 0 0 0 1.414 1.414l.707-.707a1 1 0 0 0-1.414-1.414z"
|
||||
/>
|
||||
</svg>
|
||||
<span
|
||||
class="mx_TabbedView_tabLabel_text"
|
||||
id="mx_tabpanel_LABS_label"
|
||||
@@ -54,9 +78,17 @@ exports[`<TabbedView /> renders tabs 1`] = `
|
||||
role="tab"
|
||||
tabindex="-1"
|
||||
>
|
||||
<span
|
||||
class="mx_TabbedView_maskedIcon appearance"
|
||||
/>
|
||||
<svg
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="0 0 24 24"
|
||||
width="1em"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M12 16q1.875 0 3.188-1.312Q16.5 13.375 16.5 11.5t-1.312-3.187T12 7 8.813 8.313 7.5 11.5t1.313 3.188T12 16m0-1.8q-1.125 0-1.912-.787A2.6 2.6 0 0 1 9.3 11.5q0-1.125.787-1.912A2.6 2.6 0 0 1 12 8.8q1.125 0 1.912.787.788.788.788 1.913t-.787 1.912A2.6 2.6 0 0 1 12 14.2m0 4.8q-3.475 0-6.35-1.837Q2.775 15.324 1.3 12.2a.8.8 0 0 1-.1-.312 3 3 0 0 1 0-.775.8.8 0 0 1 .1-.313q1.475-3.125 4.35-4.962Q8.525 4 12 4t6.35 1.838T22.7 10.8a.8.8 0 0 1 .1.313 3 3 0 0 1 0 .774.8.8 0 0 1-.1.313q-1.475 3.125-4.35 4.963Q15.475 19 12 19m0-2a9.54 9.54 0 0 0 5.188-1.488A9.77 9.77 0 0 0 20.8 11.5a9.77 9.77 0 0 0-3.613-4.012A9.54 9.54 0 0 0 12 6a9.55 9.55 0 0 0-5.187 1.487A9.77 9.77 0 0 0 3.2 11.5a9.77 9.77 0 0 0 3.613 4.012A9.54 9.54 0 0 0 12 17"
|
||||
/>
|
||||
</svg>
|
||||
<span
|
||||
class="mx_TabbedView_tabLabel_text"
|
||||
id="mx_tabpanel_APPEARANCE_label"
|
||||
|
||||
@@ -77,9 +77,21 @@ exports[`CompleteSecurity Allows verifying with another device if one is availab
|
||||
target="_blank"
|
||||
>
|
||||
Learn more
|
||||
<i
|
||||
<svg
|
||||
class="mx_ExternalLink_icon"
|
||||
/>
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="0 0 24 24"
|
||||
width="1em"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M5 3h6a1 1 0 1 1 0 2H5v14h14v-6a1 1 0 1 1 2 0v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2"
|
||||
/>
|
||||
<path
|
||||
d="M15 3h5a1 1 0 0 1 1 1v5a1 1 0 1 1-2 0V6.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L17.586 5H15a1 1 0 1 1 0-2"
|
||||
/>
|
||||
</svg>
|
||||
</a>
|
||||
</span>
|
||||
</div>
|
||||
@@ -245,9 +257,21 @@ exports[`CompleteSecurity Allows verifying with recovery key if one is available
|
||||
target="_blank"
|
||||
>
|
||||
Learn more
|
||||
<i
|
||||
<svg
|
||||
class="mx_ExternalLink_icon"
|
||||
/>
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="0 0 24 24"
|
||||
width="1em"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M5 3h6a1 1 0 1 1 0 2H5v14h14v-6a1 1 0 1 1 2 0v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2"
|
||||
/>
|
||||
<path
|
||||
d="M15 3h5a1 1 0 0 1 1 1v5a1 1 0 1 1-2 0V6.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L17.586 5H15a1 1 0 1 1 0-2"
|
||||
/>
|
||||
</svg>
|
||||
</a>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
@@ -83,6 +83,17 @@ exports[`<CreateRoomDialog /> for a private room should create a private room 1`
|
||||
<div
|
||||
class="mx_JoinRuleDropdown_invite"
|
||||
>
|
||||
<svg
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="0 0 24 24"
|
||||
width="1em"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M6 22q-.824 0-1.412-.587A1.93 1.93 0 0 1 4 20V10q0-.825.588-1.412A1.93 1.93 0 0 1 6 8h1V6q0-2.075 1.463-3.537Q9.926 1 12 1q2.075 0 3.537 1.463Q17 3.925 17 6v2h1q.824 0 1.413.588Q20 9.175 20 10v10q0 .824-.587 1.413A1.93 1.93 0 0 1 18 22zM9 8h6V6q0-1.25-.875-2.125A2.9 2.9 0 0 0 12 3q-1.25 0-2.125.875A2.9 2.9 0 0 0 9 6z"
|
||||
/>
|
||||
</svg>
|
||||
Private room (invite only)
|
||||
</div>
|
||||
</div>
|
||||
@@ -309,6 +320,17 @@ exports[`<CreateRoomDialog /> for a private room should render not the advanced
|
||||
<div
|
||||
class="mx_JoinRuleDropdown_invite"
|
||||
>
|
||||
<svg
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="0 0 24 24"
|
||||
width="1em"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M6 22q-.824 0-1.412-.587A1.93 1.93 0 0 1 4 20V10q0-.825.588-1.412A1.93 1.93 0 0 1 6 8h1V6q0-2.075 1.463-3.537Q9.926 1 12 1q2.075 0 3.537 1.463Q17 3.925 17 6v2h1q.824 0 1.413.588Q20 9.175 20 10v10q0 .824-.587 1.413A1.93 1.93 0 0 1 18 22zM9 8h6V6q0-1.25-.875-2.125A2.9 2.9 0 0 0 12 3q-1.25 0-2.125.875A2.9 2.9 0 0 0 9 6z"
|
||||
/>
|
||||
</svg>
|
||||
Private room (invite only)
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -45,9 +45,21 @@ exports[`FeedbackDialog should respect feedback config 1`] = `
|
||||
target="_blank"
|
||||
>
|
||||
existing bugs on Github
|
||||
<i
|
||||
<svg
|
||||
class="mx_ExternalLink_icon"
|
||||
/>
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="0 0 24 24"
|
||||
width="1em"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M5 3h6a1 1 0 1 1 0 2H5v14h14v-6a1 1 0 1 1 2 0v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2"
|
||||
/>
|
||||
<path
|
||||
d="M15 3h5a1 1 0 0 1 1 1v5a1 1 0 1 1-2 0V6.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L17.586 5H15a1 1 0 1 1 0-2"
|
||||
/>
|
||||
</svg>
|
||||
</a>
|
||||
first. No match?
|
||||
<a
|
||||
@@ -57,9 +69,21 @@ exports[`FeedbackDialog should respect feedback config 1`] = `
|
||||
target="_blank"
|
||||
>
|
||||
Start a new one
|
||||
<i
|
||||
<svg
|
||||
class="mx_ExternalLink_icon"
|
||||
/>
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="0 0 24 24"
|
||||
width="1em"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M5 3h6a1 1 0 1 1 0 2H5v14h14v-6a1 1 0 1 1 2 0v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2"
|
||||
/>
|
||||
<path
|
||||
d="M15 3h5a1 1 0 0 1 1 1v5a1 1 0 1 1-2 0V6.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L17.586 5H15a1 1 0 1 1 0-2"
|
||||
/>
|
||||
</svg>
|
||||
</a>
|
||||
.
|
||||
</span>
|
||||
|
||||
@@ -48,7 +48,19 @@ exports[`<ManageRestrictedJoinRuleDialog /> should list spaces which are not par
|
||||
class="mx_AccessibleButton mx_SearchBox_closeButton"
|
||||
role="button"
|
||||
tabindex="-1"
|
||||
/>
|
||||
>
|
||||
<svg
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="0 0 24 24"
|
||||
width="1em"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M6.293 6.293a1 1 0 0 1 1.414 0L12 10.586l4.293-4.293a1 1 0 1 1 1.414 1.414L13.414 12l4.293 4.293a1 1 0 0 1-1.414 1.414L12 13.414l-4.293 4.293a1 1 0 0 1-1.414-1.414L10.586 12 6.293 7.707a1 1 0 0 1 0-1.414"
|
||||
/>
|
||||
</svg>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="mx_AutoHideScrollbar mx_ManageRestrictedJoinRuleDialog_content"
|
||||
@@ -142,6 +154,17 @@ exports[`<ManageRestrictedJoinRuleDialog /> should list spaces which are not par
|
||||
<div
|
||||
class="mx_ManageRestrictedJoinRuleDialog_section_info"
|
||||
>
|
||||
<svg
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="0 0 24 24"
|
||||
width="1em"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M12 17q.424 0 .713-.288A.97.97 0 0 0 13 16v-4a.97.97 0 0 0-.287-.713A.97.97 0 0 0 12 11a.97.97 0 0 0-.713.287A.97.97 0 0 0 11 12v4q0 .424.287.712.288.288.713.288m0-8q.424 0 .713-.287A.97.97 0 0 0 13 8a.97.97 0 0 0-.287-.713A.97.97 0 0 0 12 7a.97.97 0 0 0-.713.287A.97.97 0 0 0 11 8q0 .424.287.713Q11.576 9 12 9m0 13a9.7 9.7 0 0 1-3.9-.788 10.1 10.1 0 0 1-3.175-2.137q-1.35-1.35-2.137-3.175A9.7 9.7 0 0 1 2 12q0-2.075.788-3.9a10.1 10.1 0 0 1 2.137-3.175q1.35-1.35 3.175-2.137A9.7 9.7 0 0 1 12 2q2.075 0 3.9.788a10.1 10.1 0 0 1 3.175 2.137q1.35 1.35 2.137 3.175A9.7 9.7 0 0 1 22 12a9.7 9.7 0 0 1-.788 3.9 10.1 10.1 0 0 1-2.137 3.175q-1.35 1.35-3.175 2.137A9.7 9.7 0 0 1 12 22"
|
||||
/>
|
||||
</svg>
|
||||
You're removing all spaces. Access will default to invite only
|
||||
</div>
|
||||
<div
|
||||
@@ -226,7 +249,19 @@ exports[`<ManageRestrictedJoinRuleDialog /> should render empty state 1`] = `
|
||||
class="mx_AccessibleButton mx_SearchBox_closeButton"
|
||||
role="button"
|
||||
tabindex="-1"
|
||||
/>
|
||||
>
|
||||
<svg
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="0 0 24 24"
|
||||
width="1em"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M6.293 6.293a1 1 0 0 1 1.414 0L12 10.586l4.293-4.293a1 1 0 1 1 1.414 1.414L13.414 12l4.293 4.293a1 1 0 0 1-1.414 1.414L12 13.414l-4.293 4.293a1 1 0 0 1-1.414-1.414L10.586 12 6.293 7.707a1 1 0 0 1 0-1.414"
|
||||
/>
|
||||
</svg>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="mx_AutoHideScrollbar mx_ManageRestrictedJoinRuleDialog_content"
|
||||
@@ -244,6 +279,17 @@ exports[`<ManageRestrictedJoinRuleDialog /> should render empty state 1`] = `
|
||||
<div
|
||||
class="mx_ManageRestrictedJoinRuleDialog_section_info"
|
||||
>
|
||||
<svg
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="0 0 24 24"
|
||||
width="1em"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M12 17q.424 0 .713-.288A.97.97 0 0 0 13 16v-4a.97.97 0 0 0-.287-.713A.97.97 0 0 0 12 11a.97.97 0 0 0-.713.287A.97.97 0 0 0 11 12v4q0 .424.287.712.288.288.713.288m0-8q.424 0 .713-.287A.97.97 0 0 0 13 8a.97.97 0 0 0-.287-.713A.97.97 0 0 0 12 7a.97.97 0 0 0-.713.287A.97.97 0 0 0 11 8q0 .424.287.713Q11.576 9 12 9m0 13a9.7 9.7 0 0 1-3.9-.788 10.1 10.1 0 0 1-3.175-2.137q-1.35-1.35-2.137-3.175A9.7 9.7 0 0 1 2 12q0-2.075.788-3.9a10.1 10.1 0 0 1 2.137-3.175q1.35-1.35 3.175-2.137A9.7 9.7 0 0 1 12 2q2.075 0 3.9.788a10.1 10.1 0 0 1 3.175 2.137q1.35 1.35 2.137 3.175A9.7 9.7 0 0 1 22 12a9.7 9.7 0 0 1-.788 3.9 10.1 10.1 0 0 1-2.137 3.175q-1.35 1.35-3.175 2.137A9.7 9.7 0 0 1 12 22"
|
||||
/>
|
||||
</svg>
|
||||
You're removing all spaces. Access will default to invite only
|
||||
</div>
|
||||
<div
|
||||
|
||||
@@ -10,9 +10,17 @@ NodeList [
|
||||
role="tab"
|
||||
tabindex="0"
|
||||
>
|
||||
<span
|
||||
class="mx_TabbedView_maskedIcon mx_RoomSettingsDialog_settingsIcon"
|
||||
/>
|
||||
<svg
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="0 0 24 24"
|
||||
width="1em"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M12.731 2C13.432 2 14 2.568 14 3.269c0 .578.396 1.074.935 1.286q.128.052.253.106c.531.23 1.162.16 1.572-.25a1.27 1.27 0 0 1 1.794 0l1.034 1.035a1.27 1.27 0 0 1 0 1.794c-.41.41-.48 1.04-.248 1.572l.105.253c.212.539.708.935 1.286.935.701 0 1.269.568 1.269 1.269v1.462c0 .701-.568 1.269-1.269 1.269-.578 0-1.074.396-1.287.935q-.05.128-.104.253c-.232.531-.161 1.162.248 1.572a1.27 1.27 0 0 1 0 1.794l-1.034 1.034a1.27 1.27 0 0 1-1.794 0c-.41-.41-1.04-.48-1.572-.248a8 8 0 0 1-.253.105c-.539.212-.935.708-.935 1.286 0 .701-.568 1.269-1.269 1.269H11.27c-.702 0-1.27-.568-1.27-1.269 0-.578-.396-1.074-.935-1.287a8 8 0 0 1-.253-.104c-.531-.232-1.162-.161-1.572.248a1.27 1.27 0 0 1-1.794 0l-1.034-1.034a1.27 1.27 0 0 1 0-1.794c.41-.41.48-1.04.249-1.572a8 8 0 0 1-.106-.253C4.343 14.396 3.847 14 3.27 14 2.568 14 2 13.432 2 12.731V11.27c0-.702.568-1.27 1.269-1.27.578 0 1.074-.396 1.286-.935q.052-.128.106-.253c.23-.531.16-1.162-.25-1.572a1.27 1.27 0 0 1 0-1.794l1.035-1.034a1.27 1.27 0 0 1 1.794 0c.41.41 1.04.48 1.572.249a8 8 0 0 1 .253-.106c.539-.212.935-.708.935-1.286C10 2.568 10.568 2 11.269 2zM12 16a4 4 0 1 0 0-8 4 4 0 0 0 0 8"
|
||||
/>
|
||||
</svg>
|
||||
<span
|
||||
class="mx_TabbedView_tabLabel_text"
|
||||
id="mx_tabpanel_ROOM_GENERAL_TAB_label"
|
||||
@@ -28,9 +36,17 @@ NodeList [
|
||||
role="tab"
|
||||
tabindex="-1"
|
||||
>
|
||||
<span
|
||||
class="mx_TabbedView_maskedIcon mx_RoomSettingsDialog_securityIcon"
|
||||
/>
|
||||
<svg
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="0 0 24 24"
|
||||
width="1em"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M6 22q-.824 0-1.412-.587A1.93 1.93 0 0 1 4 20V10q0-.825.588-1.412A1.93 1.93 0 0 1 6 8h1V6q0-2.075 1.463-3.537Q9.926 1 12 1q2.075 0 3.537 1.463Q17 3.925 17 6v2h1q.824 0 1.413.588Q20 9.175 20 10v10q0 .824-.587 1.413A1.93 1.93 0 0 1 18 22zM9 8h6V6q0-1.25-.875-2.125A2.9 2.9 0 0 0 12 3q-1.25 0-2.125.875A2.9 2.9 0 0 0 9 6z"
|
||||
/>
|
||||
</svg>
|
||||
<span
|
||||
class="mx_TabbedView_tabLabel_text"
|
||||
id="mx_tabpanel_ROOM_SECURITY_TAB_label"
|
||||
@@ -46,9 +62,19 @@ NodeList [
|
||||
role="tab"
|
||||
tabindex="-1"
|
||||
>
|
||||
<span
|
||||
class="mx_TabbedView_maskedIcon mx_RoomSettingsDialog_rolesIcon"
|
||||
/>
|
||||
<svg
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="0 0 24 24"
|
||||
width="1em"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
clip-rule="evenodd"
|
||||
d="m12 4.236-6 3V12c0 5.156 4.239 7.254 6 7.898 1.761-.644 6-2.742 6-7.898V7.236zm-.894-1.789a2 2 0 0 1 1.788 0l6 3A2 2 0 0 1 20 7.236V12c0 6.742-5.773 9.246-7.51 9.846-.32.111-.66.111-.98 0C9.774 21.246 4 18.743 4 12V7.236a2 2 0 0 1 1.106-1.789z"
|
||||
fill-rule="evenodd"
|
||||
/>
|
||||
</svg>
|
||||
<span
|
||||
class="mx_TabbedView_tabLabel_text"
|
||||
id="mx_tabpanel_ROOM_ROLES_TAB_label"
|
||||
@@ -64,9 +90,7 @@ NodeList [
|
||||
role="tab"
|
||||
tabindex="-1"
|
||||
>
|
||||
<span
|
||||
class="mx_TabbedView_maskedIcon mx_RoomSettingsDialog_notificationsIcon"
|
||||
/>
|
||||
<div />
|
||||
<span
|
||||
class="mx_TabbedView_tabLabel_text"
|
||||
id="mx_tabpanel_ROOM_NOTIFICATIONS_TAB_label"
|
||||
@@ -82,9 +106,17 @@ NodeList [
|
||||
role="tab"
|
||||
tabindex="-1"
|
||||
>
|
||||
<span
|
||||
class="mx_TabbedView_maskedIcon mx_RoomSettingsDialog_pollsIcon"
|
||||
/>
|
||||
<svg
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="0 0 24 24"
|
||||
width="1em"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M16 10q.424 0 .712-.287A.97.97 0 0 0 17 9a.97.97 0 0 0-.288-.713A.97.97 0 0 0 16 8h-3a.97.97 0 0 0-.713.287A.97.97 0 0 0 12 9q0 .424.287.713.288.287.713.287zm0 6q.424 0 .712-.287A.97.97 0 0 0 17 15a.97.97 0 0 0-.288-.713A.97.97 0 0 0 16 14h-3a.97.97 0 0 0-.713.287A.97.97 0 0 0 12 15q0 .424.287.713.288.287.713.287zm-7-5q.825 0 1.412-.588Q11 9.826 11 9t-.588-1.412A1.93 1.93 0 0 0 9 7q-.825 0-1.412.588A1.93 1.93 0 0 0 7 9q0 .825.588 1.412Q8.175 11 9 11m0 6q.825 0 1.412-.587Q11 15.825 11 15t-.588-1.412A1.93 1.93 0 0 0 9 13q-.825 0-1.412.588A1.93 1.93 0 0 0 7 15q0 .824.588 1.413Q8.175 17 9 17m-4 4q-.824 0-1.412-.587A1.93 1.93 0 0 1 3 19V5q0-.824.587-1.412A1.93 1.93 0 0 1 5 3h14q.824 0 1.413.587Q21 4.176 21 5v14q0 .824-.587 1.413A1.93 1.93 0 0 1 19 21zm0-2h14V5H5z"
|
||||
/>
|
||||
</svg>
|
||||
<span
|
||||
class="mx_TabbedView_tabLabel_text"
|
||||
id="mx_tabpanel_ROOM_POLL_HISTORY_TAB_label"
|
||||
|
||||
@@ -122,9 +122,21 @@ exports[`<ServerPickerDialog /> should render dialog 1`] = `
|
||||
target="_blank"
|
||||
>
|
||||
About homeservers
|
||||
<i
|
||||
<svg
|
||||
class="mx_ExternalLink_icon"
|
||||
/>
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="0 0 24 24"
|
||||
width="1em"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M5 3h6a1 1 0 1 1 0 2H5v14h14v-6a1 1 0 1 1 2 0v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2"
|
||||
/>
|
||||
<path
|
||||
d="M15 3h5a1 1 0 0 1 1 1v5a1 1 0 1 1-2 0V6.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L17.586 5H15a1 1 0 1 1 0-2"
|
||||
/>
|
||||
</svg>
|
||||
</a>
|
||||
</form>
|
||||
<div
|
||||
|
||||
@@ -15,9 +15,21 @@ exports[`<ExternalLink /> renders link correctly 1`] = `
|
||||
children
|
||||
</b>
|
||||
</span>
|
||||
<i
|
||||
<svg
|
||||
class="mx_ExternalLink_icon"
|
||||
/>
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="0 0 24 24"
|
||||
width="1em"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M5 3h6a1 1 0 1 1 0 2H5v14h14v-6a1 1 0 1 1 2 0v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2"
|
||||
/>
|
||||
<path
|
||||
d="M15 3h5a1 1 0 0 1 1 1v5a1 1 0 1 1-2 0V6.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L17.586 5H15a1 1 0 1 1 0-2"
|
||||
/>
|
||||
</svg>
|
||||
</a>
|
||||
</DocumentFragment>
|
||||
`;
|
||||
@@ -32,9 +44,21 @@ exports[`<ExternalLink /> renders plain text link correctly 1`] = `
|
||||
target="_blank"
|
||||
>
|
||||
test
|
||||
<i
|
||||
<svg
|
||||
class="mx_ExternalLink_icon"
|
||||
/>
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="0 0 24 24"
|
||||
width="1em"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M5 3h6a1 1 0 1 1 0 2H5v14h14v-6a1 1 0 1 1 2 0v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2"
|
||||
/>
|
||||
<path
|
||||
d="M15 3h5a1 1 0 0 1 1 1v5a1 1 0 1 1-2 0V6.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L17.586 5H15a1 1 0 1 1 0-2"
|
||||
/>
|
||||
</svg>
|
||||
</a>
|
||||
</DocumentFragment>
|
||||
`;
|
||||
|
||||
@@ -31,9 +31,21 @@ exports[`<EventIndexPanel /> when event indexing is not supported renders link t
|
||||
target="_blank"
|
||||
>
|
||||
Element Desktop
|
||||
<i
|
||||
<svg
|
||||
class="mx_ExternalLink_icon"
|
||||
/>
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="0 0 24 24"
|
||||
width="1em"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M5 3h6a1 1 0 1 1 0 2H5v14h14v-6a1 1 0 1 1 2 0v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2"
|
||||
/>
|
||||
<path
|
||||
d="M15 3h5a1 1 0 0 1 1 1v5a1 1 0 1 1-2 0V6.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L17.586 5H15a1 1 0 1 1 0-2"
|
||||
/>
|
||||
</svg>
|
||||
</a>
|
||||
for encrypted messages to appear in search results.
|
||||
</span>
|
||||
@@ -55,9 +67,21 @@ exports[`<EventIndexPanel /> when event indexing is supported but not installed
|
||||
target="_blank"
|
||||
>
|
||||
search components added
|
||||
<i
|
||||
<svg
|
||||
class="mx_ExternalLink_icon"
|
||||
/>
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="0 0 24 24"
|
||||
width="1em"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M5 3h6a1 1 0 1 1 0 2H5v14h14v-6a1 1 0 1 1 2 0v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2"
|
||||
/>
|
||||
<path
|
||||
d="M15 3h5a1 1 0 0 1 1 1v5a1 1 0 1 1-2 0V6.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L17.586 5H15a1 1 0 1 1 0-2"
|
||||
/>
|
||||
</svg>
|
||||
</a>
|
||||
.
|
||||
</span>
|
||||
|
||||
@@ -145,9 +145,21 @@ exports[`<SecurityUserSettingsTab /> renders security section 1`] = `
|
||||
target="_blank"
|
||||
>
|
||||
Element Desktop
|
||||
<i
|
||||
<svg
|
||||
class="mx_ExternalLink_icon"
|
||||
/>
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="0 0 24 24"
|
||||
width="1em"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M5 3h6a1 1 0 1 1 0 2H5v14h14v-6a1 1 0 1 1 2 0v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2"
|
||||
/>
|
||||
<path
|
||||
d="M15 3h5a1 1 0 0 1 1 1v5a1 1 0 1 1-2 0V6.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L17.586 5H15a1 1 0 1 1 0-2"
|
||||
/>
|
||||
</svg>
|
||||
</a>
|
||||
for encrypted messages to appear in search results.
|
||||
</span>
|
||||
|
||||
@@ -75,7 +75,19 @@ exports[`<AddExistingToSpaceDialog /> looks as expected 1`] = `
|
||||
class="mx_AccessibleButton mx_SearchBox_closeButton"
|
||||
role="button"
|
||||
tabindex="-1"
|
||||
/>
|
||||
>
|
||||
<svg
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="0 0 24 24"
|
||||
width="1em"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M6.293 6.293a1 1 0 0 1 1.414 0L12 10.586l4.293-4.293a1 1 0 1 1 1.414 1.414L13.414 12l4.293 4.293a1 1 0 0 1-1.414 1.414L12 13.414l-4.293 4.293a1 1 0 0 1-1.414-1.414L10.586 12 6.293 7.707a1 1 0 0 1 0-1.414"
|
||||
/>
|
||||
</svg>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="mx_AutoHideScrollbar mx_AddExistingToSpace_content"
|
||||
|
||||
@@ -12,9 +12,21 @@ exports[`messageForConnectionError should match snapshot for ConnectionError 1`]
|
||||
target="_blank"
|
||||
>
|
||||
homeserver's SSL certificate
|
||||
<i
|
||||
<svg
|
||||
class="mx_ExternalLink_icon"
|
||||
/>
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="0 0 24 24"
|
||||
width="1em"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M5 3h6a1 1 0 1 1 0 2H5v14h14v-6a1 1 0 1 1 2 0v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2"
|
||||
/>
|
||||
<path
|
||||
d="M15 3h5a1 1 0 0 1 1 1v5a1 1 0 1 1-2 0V6.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L17.586 5H15a1 1 0 1 1 0-2"
|
||||
/>
|
||||
</svg>
|
||||
</a>
|
||||
is trusted, and that a browser extension is not blocking requests.
|
||||
</span>
|
||||
|
||||