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>
This commit is contained in:
Michael Telatynski
2025-12-15 09:52:50 +00:00
committed by GitHub
parent ef63661cb0
commit 1d3421417f
50 changed files with 558 additions and 375 deletions

Binary file not shown.

Before

Width:  |  Height:  |  Size: 29 KiB

After

Width:  |  Height:  |  Size: 29 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 33 KiB

After

Width:  |  Height:  |  Size: 33 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 30 KiB

After

Width:  |  Height:  |  Size: 30 KiB

View File

@@ -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";

View File

@@ -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;
}

View File

@@ -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;
}
}

View File

@@ -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);
}
}
}

View File

@@ -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;

View File

@@ -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;

View File

@@ -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);
}
}

View File

@@ -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);
}
}

View File

@@ -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;

View File

@@ -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");
}

View File

@@ -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");
}
}
}

View File

@@ -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;

View File

@@ -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;
}
}
}

View File

@@ -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;
}
}
}

View File

@@ -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

View File

@@ -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>
);
}

View File

@@ -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>
</>

View File

@@ -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>
);

View File

@@ -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

View File

@@ -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,

View File

@@ -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">

View File

@@ -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")}

View File

@@ -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 (

View File

@@ -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)}

View File

@@ -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} />,
),
];

View File

@@ -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,

View File

@@ -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>
);

View File

@@ -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 },

View File

@@ -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>

View File

@@ -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>

View File

@@ -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>>,

View File

@@ -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>

View File

@@ -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>

View File

@@ -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"

View File

@@ -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"

View File

@@ -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>

View File

@@ -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>

View File

@@ -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>

View File

@@ -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

View File

@@ -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"

View File

@@ -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

View File

@@ -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>
`;

View File

@@ -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>

View File

@@ -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>

View File

@@ -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"

View File

@@ -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>