diff --git a/playwright/snapshots/crypto/crypto.spec.ts/composer-e2e-icon-linux.png b/playwright/snapshots/crypto/crypto.spec.ts/composer-e2e-icon-linux.png index 05f5af8507a..f954734eb1e 100644 Binary files a/playwright/snapshots/crypto/crypto.spec.ts/composer-e2e-icon-linux.png and b/playwright/snapshots/crypto/crypto.spec.ts/composer-e2e-icon-linux.png differ diff --git a/playwright/snapshots/crypto/device-verification.spec.ts/device-verified-e2eIcon-linux.png b/playwright/snapshots/crypto/device-verification.spec.ts/device-verified-e2eIcon-linux.png index 479a8c17bb7..bd282ff485d 100644 Binary files a/playwright/snapshots/crypto/device-verification.spec.ts/device-verified-e2eIcon-linux.png and b/playwright/snapshots/crypto/device-verification.spec.ts/device-verified-e2eIcon-linux.png differ diff --git a/playwright/snapshots/crypto/event-shields.spec.ts/event-shield-warning-linux.png b/playwright/snapshots/crypto/event-shields.spec.ts/event-shield-warning-linux.png index ef893148ad1..eacd2a78035 100644 Binary files a/playwright/snapshots/crypto/event-shields.spec.ts/event-shield-warning-linux.png and b/playwright/snapshots/crypto/event-shields.spec.ts/event-shield-warning-linux.png differ diff --git a/playwright/snapshots/crypto/history-sharing.spec.ts/shared-history-invite-accepted-linux.png b/playwright/snapshots/crypto/history-sharing.spec.ts/shared-history-invite-accepted-linux.png index 691e7cdb0a8..ce1708e097d 100644 Binary files a/playwright/snapshots/crypto/history-sharing.spec.ts/shared-history-invite-accepted-linux.png and b/playwright/snapshots/crypto/history-sharing.spec.ts/shared-history-invite-accepted-linux.png differ diff --git a/playwright/snapshots/crypto/toasts.spec.ts/key-storage-out-of-sync-toast-linux.png b/playwright/snapshots/crypto/toasts.spec.ts/key-storage-out-of-sync-toast-linux.png index 9579ed87a55..fc6fab4e7b3 100644 Binary files a/playwright/snapshots/crypto/toasts.spec.ts/key-storage-out-of-sync-toast-linux.png and b/playwright/snapshots/crypto/toasts.spec.ts/key-storage-out-of-sync-toast-linux.png differ diff --git a/playwright/snapshots/invite/invite-dialog.spec.ts/send-your-first-message-view-linux.png b/playwright/snapshots/invite/invite-dialog.spec.ts/send-your-first-message-view-linux.png index 42fd8cfca22..89ea77f8766 100644 Binary files a/playwright/snapshots/invite/invite-dialog.spec.ts/send-your-first-message-view-linux.png and b/playwright/snapshots/invite/invite-dialog.spec.ts/send-your-first-message-view-linux.png differ diff --git a/res/css/structures/_ToastContainer.pcss b/res/css/structures/_ToastContainer.pcss index 4129ec77497..5735d74e14b 100644 --- a/res/css/structures/_ToastContainer.pcss +++ b/res/css/structures/_ToastContainer.pcss @@ -56,7 +56,7 @@ Please see LICENSE files in the repository root for full details. } &.mx_Toast_icon_verification::after { - mask-image: url("$(res)/img/e2e/normal.svg"); + mask-image: url("@vector-im/compound-design-tokens/icons/lock-solid.svg"); background-color: $primary-content; } @@ -64,12 +64,12 @@ Please see LICENSE files in the repository root for full details. /* white infill for the hollow svg mask */ &::before { background-color: #ffffff; - mask-image: url("$(res)/img/e2e/normal.svg"); + mask-image: url("@vector-im/compound-design-tokens/icons/lock-solid.svg"); mask-size: 80%; } &::after { - mask-image: url("$(res)/img/e2e/warning.svg"); + mask-image: url("@vector-im/compound-design-tokens/icons/error-solid.svg"); background-color: $e2e-warning-color; } } diff --git a/res/css/views/dialogs/_InviteDialog.pcss b/res/css/views/dialogs/_InviteDialog.pcss index fc13023f662..4abb4a677cb 100644 --- a/res/css/views/dialogs/_InviteDialog.pcss +++ b/res/css/views/dialogs/_InviteDialog.pcss @@ -224,11 +224,11 @@ Please see LICENSE files in the repository root for full details. } .mx_InviteDialog_userDirectoryIcon::before { - mask-image: url("$(res)/img/voip/tab-userdirectory.svg"); + mask-image: url("@vector-im/compound-design-tokens/icons/user-profile-solid.svg"); } .mx_InviteDialog_dialPadIcon::before { - mask-image: url("$(res)/img/voip/tab-dialpad.svg"); + mask-image: url("@vector-im/compound-design-tokens/icons/dial-pad.svg"); } .mx_InviteDialog_tile { diff --git a/res/css/views/dialogs/security/_KeyBackupFailedDialog.pcss b/res/css/views/dialogs/security/_KeyBackupFailedDialog.pcss index b02964f64ba..d4596dd5010 100644 --- a/res/css/views/dialogs/security/_KeyBackupFailedDialog.pcss +++ b/res/css/views/dialogs/security/_KeyBackupFailedDialog.pcss @@ -15,7 +15,7 @@ Please see LICENSE files in the repository root for full details. padding-bottom: 10px; &::before { - mask: url("$(res)/img/e2e/lock-warning-filled.svg"); + mask-image: url("@vector-im/compound-design-tokens/icons/error.svg"); mask-repeat: no-repeat; background-color: $primary-content; content: ""; diff --git a/res/css/views/messages/_LegacyCallEvent.pcss b/res/css/views/messages/_LegacyCallEvent.pcss index 12004bbdcf8..449268c678c 100644 --- a/res/css/views/messages/_LegacyCallEvent.pcss +++ b/res/css/views/messages/_LegacyCallEvent.pcss @@ -43,11 +43,11 @@ Please see LICENSE files in the repository root for full details. } .mx_LegacyCallEvent_silence::before { - mask-image: url("$(res)/img/voip/silence.svg"); + mask-image: url("@vector-im/compound-design-tokens/icons/volume-on-solid.svg"); } .mx_LegacyCallEvent_unSilence::before { - mask-image: url("$(res)/img/voip/un-silence.svg"); + mask-image: url("@vector-im/compound-design-tokens/icons/volume-off-solid.svg"); } &.mx_LegacyCallEvent_voice { diff --git a/res/css/views/messages/_common_CryptoEvent.pcss b/res/css/views/messages/_common_CryptoEvent.pcss index ba18f4f2ae3..5f2e26fd1c8 100644 --- a/res/css/views/messages/_common_CryptoEvent.pcss +++ b/res/css/views/messages/_common_CryptoEvent.pcss @@ -12,24 +12,24 @@ Please see LICENSE files in the repository root for full details. /* white infill for the transparency */ &.mx_cryptoEvent_icon::before { background-color: #ffffff; - mask-image: url("$(res)/img/e2e/normal.svg"); + mask-image: url("@vector-im/compound-design-tokens/icons/lock-solid.svg"); mask-repeat: no-repeat; mask-position: center; mask-size: 80%; } &.mx_cryptoEvent_icon::after { - mask-image: url("$(res)/img/e2e/normal.svg"); + mask-image: url("@vector-im/compound-design-tokens/icons/lock-solid.svg"); background-color: $header-panel-text-primary-color; } &.mx_cryptoEvent_icon_verified::after { - mask-image: url("$(res)/img/e2e/verified.svg"); + mask-image: url("@vector-im/compound-design-tokens/icons/shield.svg"); background-color: $accent; } &.mx_cryptoEvent_icon_warning::after { - mask-image: url("$(res)/img/e2e/warning.svg"); + mask-image: url("@vector-im/compound-design-tokens/icons/error-solid.svg"); background-color: $e2e-warning-color; } diff --git a/res/css/views/rooms/_DecryptionFailureBar.pcss b/res/css/views/rooms/_DecryptionFailureBar.pcss index ca6709b24b7..b8d425bf957 100644 --- a/res/css/views/rooms/_DecryptionFailureBar.pcss +++ b/res/css/views/rooms/_DecryptionFailureBar.pcss @@ -54,7 +54,7 @@ Please see LICENSE files in the repository root for full details. .mx_DecryptionFailureBar_start_status_icon { min-width: var(--size-icon); height: var(--size-icon); - mask-image: url("$(res)/img/e2e/decryption-failure.svg"); + mask-image: url("@vector-im/compound-design-tokens/icons/error-solid.svg"); background-color: $e2e-warning-color; mask-repeat: no-repeat; mask-position: center; diff --git a/res/css/views/rooms/_E2EIcon.pcss b/res/css/views/rooms/_E2EIcon.pcss index 97db1959a48..7f399ab45f8 100644 --- a/res/css/views/rooms/_E2EIcon.pcss +++ b/res/css/views/rooms/_E2EIcon.pcss @@ -34,7 +34,7 @@ Please see LICENSE files in the repository root for full details. /* transparent-looking border surrounding the shield for when overlain over avatars */ .mx_E2EIcon_bordered { - mask-image: url("$(res)/img/e2e/normal.svg"); + mask-image: url("@vector-im/compound-design-tokens/icons/lock-solid.svg"); background-color: $header-panel-bg-color; mask-size: 100%; @@ -50,12 +50,12 @@ Please see LICENSE files in the repository root for full details. } .mx_E2EIcon_warning::after { - mask-image: url("$(res)/img/e2e/warning.svg"); + mask-image: url("@vector-im/compound-design-tokens/icons/error-solid.svg"); background-color: $e2e-warning-color; } .mx_E2EIcon_normal::after { - mask-image: url("$(res)/img/e2e/normal.svg"); + mask-image: url("@vector-im/compound-design-tokens/icons/lock-solid.svg"); background-color: var(--cpd-color-icon-tertiary); } @@ -67,6 +67,6 @@ Please see LICENSE files in the repository root for full details. } .mx_E2EIcon_verified::after { - mask-image: url("$(res)/img/e2e/verified.svg"); + mask-image: url("@vector-im/compound-design-tokens/icons/shield.svg"); background-color: $e2e-verified-color; } diff --git a/res/css/views/rooms/_EventTile.pcss b/res/css/views/rooms/_EventTile.pcss index c4348a12459..d8a05fd6ce9 100644 --- a/res/css/views/rooms/_EventTile.pcss +++ b/res/css/views/rooms/_EventTile.pcss @@ -849,17 +849,17 @@ $left-gutter: 64px; } &.mx_EventTile_e2eIcon_warning::after { - mask-image: url("$(res)/img/e2e/warning.svg"); /* (!) in a shield */ + mask-image: url("@vector-im/compound-design-tokens/icons/error-solid.svg"); background-color: $e2e-warning-color; /* red */ } &.mx_EventTile_e2eIcon_normal::after { - mask-image: url("$(res)/img/e2e/normal.svg"); /* regular shield */ + mask-image: url("@vector-im/compound-design-tokens/icons/lock-solid.svg"); background-color: var(--cpd-color-icon-tertiary); /* grey */ } &.mx_EventTile_e2eIcon_decryption_failure::after { - mask-image: url("$(res)/img/e2e/decryption-failure.svg"); /* key in a circle */ + mask-image: url("@vector-im/compound-design-tokens/icons/error-solid.svg"); background-color: var(--cpd-color-icon-tertiary); } } diff --git a/res/css/views/toasts/_IncomingLegacyCallToast.pcss b/res/css/views/toasts/_IncomingLegacyCallToast.pcss index a90e36bbda9..667dd110d16 100644 --- a/res/css/views/toasts/_IncomingLegacyCallToast.pcss +++ b/res/css/views/toasts/_IncomingLegacyCallToast.pcss @@ -127,10 +127,10 @@ Please see LICENSE files in the repository root for full details. } .mx_IncomingLegacyCallToast_silence::before { - mask-image: url("$(res)/img/voip/silence.svg"); + mask-image: url("@vector-im/compound-design-tokens/icons/volume-on-solid.svg"); } .mx_IncomingLegacyCallToast_unSilence::before { - mask-image: url("$(res)/img/voip/un-silence.svg"); + mask-image: url("@vector-im/compound-design-tokens/icons/volume-off-solid.svg"); } } diff --git a/res/css/views/voip/LegacyCallView/_LegacyCallViewButtons.pcss b/res/css/views/voip/LegacyCallView/_LegacyCallViewButtons.pcss index e7bd4c3281f..ab0146fadcd 100644 --- a/res/css/views/voip/LegacyCallView/_LegacyCallViewButtons.pcss +++ b/res/css/views/voip/LegacyCallView/_LegacyCallViewButtons.pcss @@ -148,7 +148,7 @@ Please see LICENSE files in the repository root for full details. /* Stateless buttons */ &.mx_LegacyCallViewButtons_dialpad::before { - mask-image: url("$(res)/img/voip/call-view/dialpad.svg"); + mask-image: url("@vector-im/compound-design-tokens/icons/dial-pad.svg"); } &.mx_LegacyCallViewButtons_button_hangup { diff --git a/res/img/e2e/decryption-failure.svg b/res/img/e2e/decryption-failure.svg deleted file mode 100644 index 244e5d28160..00000000000 --- a/res/img/e2e/decryption-failure.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/res/img/e2e/lock-warning-filled.svg b/res/img/e2e/lock-warning-filled.svg deleted file mode 100644 index a984ed85a09..00000000000 --- a/res/img/e2e/lock-warning-filled.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/res/img/e2e/normal.svg b/res/img/e2e/normal.svg deleted file mode 100644 index 83b544a326d..00000000000 --- a/res/img/e2e/normal.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/res/img/e2e/verified-deprecated.svg b/res/img/e2e/verified-deprecated.svg deleted file mode 100644 index f90d9db554c..00000000000 --- a/res/img/e2e/verified-deprecated.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/res/img/e2e/verified.svg b/res/img/e2e/verified.svg deleted file mode 100644 index 9213d2b05d9..00000000000 --- a/res/img/e2e/verified.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/res/img/e2e/warning-deprecated.svg b/res/img/e2e/warning-deprecated.svg deleted file mode 100644 index 58f5c3b7d1c..00000000000 --- a/res/img/e2e/warning-deprecated.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/res/img/e2e/warning.svg b/res/img/e2e/warning.svg deleted file mode 100644 index 1acbb53bb71..00000000000 --- a/res/img/e2e/warning.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/res/img/voip/call-view/dialpad.svg b/res/img/voip/call-view/dialpad.svg deleted file mode 100644 index 68f1c71b6dc..00000000000 --- a/res/img/voip/call-view/dialpad.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/res/img/voip/silence.svg b/res/img/voip/silence.svg deleted file mode 100644 index 332932dfff8..00000000000 --- a/res/img/voip/silence.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/res/img/voip/tab-dialpad.svg b/res/img/voip/tab-dialpad.svg deleted file mode 100644 index b7add0addb0..00000000000 --- a/res/img/voip/tab-dialpad.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/res/img/voip/tab-userdirectory.svg b/res/img/voip/tab-userdirectory.svg deleted file mode 100644 index 792ded7be40..00000000000 --- a/res/img/voip/tab-userdirectory.svg +++ /dev/null @@ -1,7 +0,0 @@ - - - - - - - diff --git a/res/img/voip/un-silence.svg b/res/img/voip/un-silence.svg deleted file mode 100644 index c00b366f848..00000000000 --- a/res/img/voip/un-silence.svg +++ /dev/null @@ -1,4 +0,0 @@ - - - - diff --git a/src/components/views/right_panel/EncryptionPanel.tsx b/src/components/views/right_panel/EncryptionPanel.tsx index 32fc2137dcc..53cea715e51 100644 --- a/src/components/views/right_panel/EncryptionPanel.tsx +++ b/src/components/views/right_panel/EncryptionPanel.tsx @@ -10,6 +10,9 @@ import React, { useCallback, useEffect, useRef, useState } from "react"; import { VerificationPhase, type VerificationRequest, VerificationRequestEvent } from "matrix-js-sdk/src/crypto-api"; import { type RoomMember, type User } from "matrix-js-sdk/src/matrix"; import { logger } from "matrix-js-sdk/src/logger"; +// ErrorDialog needs path to the image, not the image node +// eslint-disable-next-line no-restricted-imports +import ErrorSolidIcon from "@vector-im/compound-design-tokens/icons/error-solid.svg"; import EncryptionInfo from "./EncryptionInfo"; import VerificationPanel from "./VerificationPanel"; @@ -21,8 +24,6 @@ import { RightPanelPhases } from "../../../stores/right-panel/RightPanelStorePha import RightPanelStore from "../../../stores/right-panel/RightPanelStore"; import ErrorDialog from "../dialogs/ErrorDialog"; import { useMatrixClientContext } from "../../../contexts/MatrixClientContext"; -import WarningDeprecatedSvg from "../../../../res/img/e2e/warning-deprecated.svg"; -import WarningSvg from "../../../../res/img/e2e/warning.svg"; // cancellation codes which constitute a key mismatch const MISMATCHES = ["m.key_mismatch", "m.user_error", "m.mismatched_sas"]; @@ -81,7 +82,7 @@ const EncryptionPanel: React.FC = (props: IProps) => { ) { isShowingMismatchModal.current = true; Modal.createDialog(ErrorDialog, { - headerImage: WarningDeprecatedSvg, + headerImage: ErrorSolidIcon, title: _t("encryption|messages_not_secure|title"), description: (
@@ -120,7 +121,7 @@ const EncryptionPanel: React.FC = (props: IProps) => { setRequesting(false); Modal.createDialog(ErrorDialog, { - headerImage: WarningSvg, + headerImage: ErrorSolidIcon, title: _t("encryption|verification|error_starting_title"), description: _t("encryption|verification|error_starting_description"), }); diff --git a/src/components/views/settings/devices/DeviceSecurityCard.tsx b/src/components/views/settings/devices/DeviceSecurityCard.tsx index 2de343d51be..61d527e60f5 100644 --- a/src/components/views/settings/devices/DeviceSecurityCard.tsx +++ b/src/components/views/settings/devices/DeviceSecurityCard.tsx @@ -8,11 +8,11 @@ Please see LICENSE files in the repository root for full details. import classNames from "classnames"; import React from "react"; +import { ShieldIcon, ErrorSolidIcon } from "@vector-im/compound-design-tokens/assets/web/icons"; -import { Icon as VerifiedIcon } from "../../../../../res/img/e2e/verified.svg"; -import { Icon as UnverifiedIcon } from "../../../../../res/img/e2e/warning.svg"; import { Icon as InactiveIcon } from "../../../../../res/img/element-icons/settings/inactive.svg"; import { DeviceSecurityVariation } from "./types"; + interface Props { variation: DeviceSecurityVariation; heading: string; @@ -22,9 +22,9 @@ interface Props { const VariationIcon: Record>> = { [DeviceSecurityVariation.Inactive]: InactiveIcon, - [DeviceSecurityVariation.Verified]: VerifiedIcon, - [DeviceSecurityVariation.Unverified]: UnverifiedIcon, - [DeviceSecurityVariation.Unverifiable]: UnverifiedIcon, + [DeviceSecurityVariation.Verified]: ShieldIcon, + [DeviceSecurityVariation.Unverified]: ErrorSolidIcon, + [DeviceSecurityVariation.Unverifiable]: ErrorSolidIcon, }; const DeviceSecurityIcon: React.FC<{ variation: DeviceSecurityVariation }> = ({ variation }) => { diff --git a/src/components/views/settings/devices/DeviceTypeIcon.tsx b/src/components/views/settings/devices/DeviceTypeIcon.tsx index 994a40f250f..8b716af1ee9 100644 --- a/src/components/views/settings/devices/DeviceTypeIcon.tsx +++ b/src/components/views/settings/devices/DeviceTypeIcon.tsx @@ -8,13 +8,12 @@ Please see LICENSE files in the repository root for full details. import React from "react"; import classNames from "classnames"; +import { ShieldIcon, ErrorSolidIcon } from "@vector-im/compound-design-tokens/assets/web/icons"; import { Icon as UnknownDeviceIcon } from "../../../../../res/img/element-icons/settings/unknown-device.svg"; import { Icon as DesktopIcon } from "../../../../../res/img/element-icons/settings/desktop.svg"; import { Icon as WebIcon } from "../../../../../res/img/element-icons/settings/web.svg"; import { Icon as MobileIcon } from "../../../../../res/img/element-icons/settings/mobile.svg"; -import { Icon as VerifiedIcon } from "../../../../../res/img/e2e/verified.svg"; -import { Icon as UnverifiedIcon } from "../../../../../res/img/e2e/warning.svg"; import { _t, _td, type TranslationKey } from "../../../../languageHandler"; import { type ExtendedDevice } from "./types"; import { DeviceType } from "../../../../utils/device/parseUserAgent"; @@ -51,13 +50,13 @@ export const DeviceTypeIcon: React.FC = ({ isVerified, isSelected, device
{isVerified ? ( - ) : ( - - diff --git a/test/unit-tests/components/views/settings/devices/__snapshots__/CurrentDeviceSection-test.tsx.snap b/test/unit-tests/components/views/settings/devices/__snapshots__/CurrentDeviceSection-test.tsx.snap index 6b95eebd657..47558388b69 100644 --- a/test/unit-tests/components/views/settings/devices/__snapshots__/CurrentDeviceSection-test.tsx.snap +++ b/test/unit-tests/components/views/settings/devices/__snapshots__/CurrentDeviceSection-test.tsx.snap @@ -33,10 +33,17 @@ HTMLCollection [
-
+ xmlns="http://www.w3.org/2000/svg" + > + +
renders device and correct security card when role="img" />
-
renders device and correct security card when
-
+ xmlns="http://www.w3.org/2000/svg" + > + +
renders device and correct security card when role="img" />
-
renders device and correct security card when
-
+ xmlns="http://www.w3.org/2000/svg" + > + +
renders a verified device 1`] = `
-
+ xmlns="http://www.w3.org/2000/svg" + > + +
renders device with metadata 1`] = `
-
+ xmlns="http://www.w3.org/2000/svg" + > + +
renders device without metadata 1`] = `
-
+ xmlns="http://www.w3.org/2000/svg" + > + +
renders basic card 1`] = `
-
+ xmlns="http://www.w3.org/2000/svg" + > + +
renders with children 1`] = `
-
+ xmlns="http://www.w3.org/2000/svg" + > + +
renders a device with no metadata 1`] = ` role="img" />
-
renders a verified device with no metadata 1`] = ` role="img" />
-
renders display name with a tooltip 1`] = ` role="img" />
-
separates metadata with a dot 1`] = ` role="img" />
-
renders a verified device 1`] = ` role="img" />
-
`; @@ -37,11 +48,20 @@ exports[` renders an unverified device 1`] = ` role="img" />
-
`; @@ -60,11 +80,20 @@ exports[` renders correctly when selected 1`] = ` role="img" />
-
`; diff --git a/test/unit-tests/components/views/settings/devices/__snapshots__/DeviceVerificationStatusCard-test.tsx.snap b/test/unit-tests/components/views/settings/devices/__snapshots__/DeviceVerificationStatusCard-test.tsx.snap index 89c35ef6c32..933bdade5aa 100644 --- a/test/unit-tests/components/views/settings/devices/__snapshots__/DeviceVerificationStatusCard-test.tsx.snap +++ b/test/unit-tests/components/views/settings/devices/__snapshots__/DeviceVerificationStatusCard-test.tsx.snap @@ -8,10 +8,19 @@ exports[` renders a verified device 1`] = `
-
+ xmlns="http://www.w3.org/2000/svg" + > + +
renders an unverifiable device 1`] = `
-
+ xmlns="http://www.w3.org/2000/svg" + > + +
renders an unverified device 1`] = `
-
+ xmlns="http://www.w3.org/2000/svg" + > + +
-
+ xmlns="http://www.w3.org/2000/svg" + > + +
-
+ xmlns="http://www.w3.org/2000/svg" + > + +
renders both cards when user has both unver
-
+ xmlns="http://www.w3.org/2000/svg" + > + +
renders inactive devices section when user
-
+ xmlns="http://www.w3.org/2000/svg" + > + +
renders unverified devices section when use
-
+ xmlns="http://www.w3.org/2000/svg" + > + +
renders unselected device tile with checkbox 1 role="img" />
-
-
+ xmlns="http://www.w3.org/2000/svg" + > + +
current session section renders current session s role="img" />
-
current session section renders current session s
-
+ xmlns="http://www.w3.org/2000/svg" + > + +
current session section renders current session s role="img" />
-
current session section renders current session s
-
+ xmlns="http://www.w3.org/2000/svg" + > + +