diff --git a/package.json b/package.json index baa721dadb..f38df33e4e 100644 --- a/package.json +++ b/package.json @@ -92,7 +92,7 @@ "@matrix-org/spec": "^1.7.0", "@sentry/browser": "^10.0.0", "@types/png-chunks-extract": "^1.0.2", - "@vector-im/compound-design-tokens": "6.4.3", + "@vector-im/compound-design-tokens": "6.6.0", "@vector-im/compound-web": "^8.3.4", "@vector-im/matrix-wysiwyg": "2.40.0", "@zxcvbn-ts/core": "^3.0.4", diff --git a/playwright/snapshots/settings/general-room-settings-tab.spec.ts/General-room-settings-tab-should-be-rendered-properly-1-linux.png b/playwright/snapshots/settings/general-room-settings-tab.spec.ts/General-room-settings-tab-should-be-rendered-properly-1-linux.png index c2d1cc52a0..4f5ed98c6e 100644 Binary files a/playwright/snapshots/settings/general-room-settings-tab.spec.ts/General-room-settings-tab-should-be-rendered-properly-1-linux.png and b/playwright/snapshots/settings/general-room-settings-tab.spec.ts/General-room-settings-tab-should-be-rendered-properly-1-linux.png differ diff --git a/playwright/snapshots/settings/room-settings/room-security-tab.spec.ts/room-security-settings-linux.png b/playwright/snapshots/settings/room-settings/room-security-tab.spec.ts/room-security-settings-linux.png index d06cf34517..f3bd63e1d2 100644 Binary files a/playwright/snapshots/settings/room-settings/room-security-tab.spec.ts/room-security-settings-linux.png and b/playwright/snapshots/settings/room-settings/room-security-tab.spec.ts/room-security-settings-linux.png differ diff --git a/playwright/snapshots/settings/room-settings/room-security-tab.spec.ts/room-security-settings-world-readable-linux.png b/playwright/snapshots/settings/room-settings/room-security-tab.spec.ts/room-security-settings-world-readable-linux.png index 216af8f7e1..bb9b2c49a5 100644 Binary files a/playwright/snapshots/settings/room-settings/room-security-tab.spec.ts/room-security-settings-world-readable-linux.png and b/playwright/snapshots/settings/room-settings/room-security-tab.spec.ts/room-security-settings-world-readable-linux.png differ diff --git a/playwright/snapshots/settings/room-settings/room-video-tab.spec.ts/room-video-settings-linux.png b/playwright/snapshots/settings/room-settings/room-video-tab.spec.ts/room-video-settings-linux.png index 37303257b7..aca5393f02 100644 Binary files a/playwright/snapshots/settings/room-settings/room-video-tab.spec.ts/room-video-settings-linux.png and b/playwright/snapshots/settings/room-settings/room-video-tab.spec.ts/room-video-settings-linux.png differ diff --git a/res/css/views/dialogs/security/_CreateSecretStorageDialog.pcss b/res/css/views/dialogs/security/_CreateSecretStorageDialog.pcss index e40458f48f..727558d274 100644 --- a/res/css/views/dialogs/security/_CreateSecretStorageDialog.pcss +++ b/res/css/views/dialogs/security/_CreateSecretStorageDialog.pcss @@ -57,14 +57,7 @@ Please see LICENSE files in the repository root for full details. position: relative; top: 5px; background-color: $primary-content; -} - -.mx_CreateSecretStorageDialog_secureBackupTitle::before { - mask-image: url("$(res)/img/feather-customised/secure-backup.svg"); -} - -.mx_CreateSecretStorageDialog_securePhraseTitle::before { - mask-image: url("$(res)/img/feather-customised/secure-phrase.svg"); + mask-image: url("@vector-im/compound-design-tokens/icons/key-solid.svg"); } .mx_CreateSecretStorageDialog_centeredTitle, @@ -100,24 +93,6 @@ Please see LICENSE files in the repository root for full details. padding-bottom: 10px; } -.mx_CreateSecretStorageDialog_optionIcon { - display: inline-block; - width: 24px; - height: 24px; - margin-right: 8px; - position: relative; - top: 5px; - background-color: $primary-content; -} - -.mx_CreateSecretStorageDialog_optionIcon_securePhrase { - mask-image: url("$(res)/img/feather-customised/secure-phrase.svg"); -} - -.mx_CreateSecretStorageDialog_optionIcon_secureBackup { - mask-image: url("$(res)/img/feather-customised/secure-backup.svg"); -} - .mx_CreateSecretStorageDialog_passPhraseContainer { display: flex; align-items: flex-start; diff --git a/res/css/views/elements/_ImageView.pcss b/res/css/views/elements/_ImageView.pcss index d6649d15da..9e82446ae1 100644 --- a/res/css/views/elements/_ImageView.pcss +++ b/res/css/views/elements/_ImageView.pcss @@ -7,7 +7,7 @@ Please see LICENSE files in the repository root for full details. */ $button-size: 32px; -$icon-size: 22px; +$icon-size: 24px; $button-gap: 24px; :root { @@ -109,19 +109,19 @@ $button-gap: 24px; } .mx_ImageView_button_rotateCW::before { - mask-image: url("$(res)/img/image-view/rotate-cw.svg"); + mask-image: url("@vector-im/compound-design-tokens/icons/rotate-right.svg"); } .mx_ImageView_button_rotateCCW::before { - mask-image: url("$(res)/img/image-view/rotate-ccw.svg"); + mask-image: url("@vector-im/compound-design-tokens/icons/rotate-left.svg"); } .mx_ImageView_button_zoomOut::before { - mask-image: url("$(res)/img/image-view/zoom-out.svg"); + mask-image: url("@vector-im/compound-design-tokens/icons/zoom-out.svg"); } .mx_ImageView_button_zoomIn::before { - mask-image: url("$(res)/img/image-view/zoom-in.svg"); + mask-image: url("@vector-im/compound-design-tokens/icons/zoom-in.svg"); } .mx_ImageView_button_download::before { diff --git a/res/css/views/messages/_LegacyCallEvent.pcss b/res/css/views/messages/_LegacyCallEvent.pcss index 449268c678..48fb197575 100644 --- a/res/css/views/messages/_LegacyCallEvent.pcss +++ b/res/css/views/messages/_LegacyCallEvent.pcss @@ -83,7 +83,7 @@ Please see LICENSE files in the repository root for full details. &.mx_LegacyCallEvent_missed { &.mx_LegacyCallEvent_voice { .mx_LegacyCallEvent_type_icon::before { - mask-image: url("$(res)/img/voip/missed-voice.svg"); + mask-image: url("@vector-im/compound-design-tokens/icons/voice-call-missed-solid.svg"); } } diff --git a/res/css/views/voip/LegacyCallView/_LegacyCallViewButtons.pcss b/res/css/views/voip/LegacyCallView/_LegacyCallViewButtons.pcss index ab0146fadc..023f941e71 100644 --- a/res/css/views/voip/LegacyCallView/_LegacyCallViewButtons.pcss +++ b/res/css/views/voip/LegacyCallView/_LegacyCallViewButtons.pcss @@ -105,7 +105,7 @@ Please see LICENSE files in the repository root for full details. } &.mx_LegacyCallViewButtons_button_sidebar::before { - mask-image: url("$(res)/img/voip/call-view/sidebar-on.svg"); + mask-image: url("@vector-im/compound-design-tokens/icons/list-view.svg"); } } @@ -139,7 +139,7 @@ Please see LICENSE files in the repository root for full details. background-color: $call-view-button-on-background; &::before { - mask-image: url("$(res)/img/voip/call-view/sidebar-off.svg"); + mask-image: url("@vector-im/compound-design-tokens/icons/spotlight-view.svg"); background-color: $call-view-button-on-foreground; } } diff --git a/res/img/element-icons/child-relationship.svg b/res/img/element-icons/child-relationship.svg deleted file mode 100644 index 5a848c0d97..0000000000 --- a/res/img/element-icons/child-relationship.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/res/img/element-icons/room/settings/advanced.svg b/res/img/element-icons/room/settings/advanced.svg deleted file mode 100644 index 2adbc7d3de..0000000000 --- a/res/img/element-icons/room/settings/advanced.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/res/img/element-icons/view-in-room.svg b/res/img/element-icons/view-in-room.svg deleted file mode 100644 index abaee191f4..0000000000 --- a/res/img/element-icons/view-in-room.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/res/img/feather-customised/bridge.svg b/res/img/feather-customised/bridge.svg deleted file mode 100644 index f8f3468155..0000000000 --- a/res/img/feather-customised/bridge.svg +++ /dev/null @@ -1,50 +0,0 @@ - - - - - - - image/svg+xml - - - - - - - - - - - diff --git a/res/img/feather-customised/bug.svg b/res/img/feather-customised/bug.svg deleted file mode 100644 index ea2e4222aa..0000000000 --- a/res/img/feather-customised/bug.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/res/img/feather-customised/secure-backup.svg b/res/img/feather-customised/secure-backup.svg deleted file mode 100644 index c06f93c1fe..0000000000 --- a/res/img/feather-customised/secure-backup.svg +++ /dev/null @@ -1,11 +0,0 @@ - - - - - - - - - - - diff --git a/res/img/feather-customised/secure-phrase.svg b/res/img/feather-customised/secure-phrase.svg deleted file mode 100644 index eb13d3f048..0000000000 --- a/res/img/feather-customised/secure-phrase.svg +++ /dev/null @@ -1,11 +0,0 @@ - - - - - - - - - - - diff --git a/res/img/image-view/rotate-ccw.svg b/res/img/image-view/rotate-ccw.svg deleted file mode 100644 index 85ea3198de..0000000000 --- a/res/img/image-view/rotate-ccw.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/res/img/image-view/rotate-cw.svg b/res/img/image-view/rotate-cw.svg deleted file mode 100644 index e337f3420e..0000000000 --- a/res/img/image-view/rotate-cw.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/res/img/image-view/zoom-in.svg b/res/img/image-view/zoom-in.svg deleted file mode 100644 index c0816d489e..0000000000 --- a/res/img/image-view/zoom-in.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/res/img/image-view/zoom-out.svg b/res/img/image-view/zoom-out.svg deleted file mode 100644 index 0539e8c81a..0000000000 --- a/res/img/image-view/zoom-out.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/res/img/voip/call-view/sidebar-off.svg b/res/img/voip/call-view/sidebar-off.svg deleted file mode 100644 index 86aae6a05a..0000000000 --- a/res/img/voip/call-view/sidebar-off.svg +++ /dev/null @@ -1,6 +0,0 @@ - - - - - - diff --git a/res/img/voip/call-view/sidebar-on.svg b/res/img/voip/call-view/sidebar-on.svg deleted file mode 100644 index 535b589098..0000000000 --- a/res/img/voip/call-view/sidebar-on.svg +++ /dev/null @@ -1,5 +0,0 @@ - - - - - diff --git a/res/img/voip/missed-voice.svg b/res/img/voip/missed-voice.svg deleted file mode 100644 index 5e3993584e..0000000000 --- a/res/img/voip/missed-voice.svg +++ /dev/null @@ -1,4 +0,0 @@ - - - - diff --git a/src/async-components/views/dialogs/security/CreateSecretStorageDialog.tsx b/src/async-components/views/dialogs/security/CreateSecretStorageDialog.tsx index ed2fbe87a5..902bf4d780 100644 --- a/src/async-components/views/dialogs/security/CreateSecretStorageDialog.tsx +++ b/src/async-components/views/dialogs/security/CreateSecretStorageDialog.tsx @@ -351,7 +351,6 @@ export default class CreateSecretStorageDialog extends React.PureComponent
- {_t("settings|key_backup|setup_secure_backup|generate_security_key_title")}
{_t("settings|key_backup|setup_secure_backup|generate_security_key_description")}
@@ -370,7 +369,6 @@ export default class CreateSecretStorageDialog extends React.PureComponent
- {_t("settings|key_backup|setup_secure_backup|enter_phrase_title")}
{_t("settings|key_backup|setup_secure_backup|use_phrase_only_you_know")}
@@ -696,16 +694,10 @@ export default class CreateSecretStorageDialog extends React.PureComponent if (relatedEventId && SettingsStore.getValue("developerMode")) { jumpToRelatedEventButton = ( } + icon={} label={_t("timeline|context_menu|view_related_event")} onClick={() => this.onJumpToRelatedEventClick(relatedEventId)} /> @@ -691,7 +690,7 @@ export default class MessageContextMenu extends React.Component if (isThreadRootEvent) { viewInRoomButton = ( } + icon={} label={_t("timeline|mab|view_in_room")} onClick={this.viewInRoom} /> diff --git a/src/components/views/context_menus/ThreadListContextMenu.tsx b/src/components/views/context_menus/ThreadListContextMenu.tsx index 4820c2a9e9..2b3ee57653 100644 --- a/src/components/views/context_menus/ThreadListContextMenu.tsx +++ b/src/components/views/context_menus/ThreadListContextMenu.tsx @@ -8,7 +8,7 @@ Please see LICENSE files in the repository root for full details. import React, { useCallback, useEffect } from "react"; import { type MatrixEvent } from "matrix-js-sdk/src/matrix"; -import { LinkIcon, OverflowHorizontalIcon } from "@vector-im/compound-design-tokens/assets/web/icons"; +import { LinkIcon, OverflowHorizontalIcon, VisibilityOnIcon } from "@vector-im/compound-design-tokens/assets/web/icons"; import { type ButtonEvent } from "../elements/AccessibleButton"; import dis from "../../../dispatcher/dispatcher"; @@ -21,7 +21,6 @@ import IconizedContextMenu, { IconizedContextMenuOption, IconizedContextMenuOpti import { WidgetLayoutStore } from "../../../stores/widgets/WidgetLayoutStore"; import { MatrixClientPeg } from "../../../MatrixClientPeg"; import { type ViewRoomPayload } from "../../../dispatcher/payloads/ViewRoomPayload"; -import { Icon as ViewInRoomIcon } from "../../../../res/img/element-icons/view-in-room.svg"; export interface ThreadListContextMenuProps { mxEvent: MatrixEvent; @@ -106,7 +105,7 @@ const ThreadListContextMenu: React.FC = ({ viewInRoom(e)} label={_t("timeline|mab|view_in_room")} - icon={} + icon={} /> )} {permalinkCreator && ( diff --git a/src/components/views/dialogs/FeedbackDialog.tsx b/src/components/views/dialogs/FeedbackDialog.tsx index 1775e9667a..72321eeba1 100644 --- a/src/components/views/dialogs/FeedbackDialog.tsx +++ b/src/components/views/dialogs/FeedbackDialog.tsx @@ -6,7 +6,7 @@ Please see LICENSE files in the repository root for full details. */ import React, { type JSX, useEffect, useRef, useState } from "react"; -import { ChatSolidIcon } from "@vector-im/compound-design-tokens/assets/web/icons"; +import { ChatSolidIcon, BugIcon } from "@vector-im/compound-design-tokens/assets/web/icons"; import QuestionDialog from "./QuestionDialog"; import { _t } from "../../../languageHandler"; @@ -20,7 +20,6 @@ import { submitFeedback } from "../../../rageshake/submit-rageshake"; import { useStateToggle } from "../../../hooks/useStateToggle"; import StyledCheckbox from "../elements/StyledCheckbox"; import ExternalLink from "../elements/ExternalLink"; -import { Icon as BugIcon } from "../../../../res/img/feather-customised/bug.svg"; interface IProps { feature?: string; diff --git a/src/components/views/dialogs/RoomSettingsDialog.tsx b/src/components/views/dialogs/RoomSettingsDialog.tsx index 5e9e660967..10e4a3e428 100644 --- a/src/components/views/dialogs/RoomSettingsDialog.tsx +++ b/src/components/views/dialogs/RoomSettingsDialog.tsx @@ -18,6 +18,8 @@ import { SettingsIcon, VoiceCallIcon, NotificationsIcon, + AdvancedSettingsIcon, + TreeIcon, } from "@vector-im/compound-design-tokens/assets/web/icons"; import TabbedView, { Tab } from "../../structures/TabbedView"; @@ -40,8 +42,6 @@ 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 BridgeIcon } from "../../../../res/img/feather-customised/bridge.svg"; export const enum RoomSettingsTab { General = "ROOM_GENERAL_TAB", @@ -201,7 +201,7 @@ class RoomSettingsDialog extends React.Component { new Tab( RoomSettingsTab.Bridges, _td("room_settings|bridges|title"), - , + , , "RoomSettingsBridges", ), @@ -222,7 +222,7 @@ class RoomSettingsDialog extends React.Component { new Tab( RoomSettingsTab.Advanced, _td("common|advanced"), - , + , this.props.onFinished(true)} diff --git a/src/components/views/dialogs/SpaceSettingsDialog.tsx b/src/components/views/dialogs/SpaceSettingsDialog.tsx index 336dee0c87..7566cbb9c8 100644 --- a/src/components/views/dialogs/SpaceSettingsDialog.tsx +++ b/src/components/views/dialogs/SpaceSettingsDialog.tsx @@ -8,7 +8,12 @@ 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 { + AdminIcon, + AdvancedSettingsIcon, + SettingsSolidIcon, + VisibilityOnIcon, +} from "@vector-im/compound-design-tokens/assets/web/icons"; import { _t, _td } from "../../../languageHandler"; import BaseDialog from "./BaseDialog"; @@ -23,7 +28,6 @@ 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", @@ -69,7 +73,7 @@ const SpaceSettingsDialog: React.FC = ({ matrixClient: cli, space, onFin ? new Tab( SpaceSettingsTab.Advanced, _td("common|advanced"), - , + , , ) : null, diff --git a/src/components/views/rooms/EventTile/EventTileThreadToolbar.tsx b/src/components/views/rooms/EventTile/EventTileThreadToolbar.tsx index e587f73598..bd29b53fb7 100644 --- a/src/components/views/rooms/EventTile/EventTileThreadToolbar.tsx +++ b/src/components/views/rooms/EventTile/EventTileThreadToolbar.tsx @@ -7,12 +7,11 @@ Please see LICENSE files in the repository root for full details. */ import React, { type JSX } from "react"; -import LinkIcon from "@vector-im/compound-design-tokens/assets/web/icons/link"; +import { LinkIcon, VisibilityOnIcon } from "@vector-im/compound-design-tokens/assets/web/icons"; import { RovingAccessibleButton } from "../../../../accessibility/RovingTabIndex"; import Toolbar from "../../../../accessibility/Toolbar"; import { _t } from "../../../../languageHandler"; -import { Icon as ViewInRoomIcon } from "../../../../../res/img/element-icons/view-in-room.svg"; import { type ButtonEvent } from "../../elements/AccessibleButton"; export function EventTileThreadToolbar({ @@ -30,7 +29,7 @@ export function EventTileThreadToolbar({ title={_t("timeline|mab|view_in_room")} key="view_in_room" > - + should match snapshot 1`] = ` > diff --git a/test/unit-tests/components/views/dialogs/__snapshots__/FeedbackDialog-test.tsx.snap b/test/unit-tests/components/views/dialogs/__snapshots__/FeedbackDialog-test.tsx.snap index 8ef822dfc4..a5625236c4 100644 --- a/test/unit-tests/components/views/dialogs/__snapshots__/FeedbackDialog-test.tsx.snap +++ b/test/unit-tests/components/views/dialogs/__snapshots__/FeedbackDialog-test.tsx.snap @@ -32,7 +32,17 @@ exports[`FeedbackDialog should respect feedback config 1`] = `
-
+ + +

Report a bug

diff --git a/test/unit-tests/components/views/dialogs/security/__snapshots__/CreateSecretStorageDialog-test.tsx.snap b/test/unit-tests/components/views/dialogs/security/__snapshots__/CreateSecretStorageDialog-test.tsx.snap index 138b79a609..5f0d265a2a 100644 --- a/test/unit-tests/components/views/dialogs/security/__snapshots__/CreateSecretStorageDialog-test.tsx.snap +++ b/test/unit-tests/components/views/dialogs/security/__snapshots__/CreateSecretStorageDialog-test.tsx.snap @@ -53,9 +53,6 @@ exports[`CreateSecretStorageDialog handles the happy path 1`] = `
- Generate a Recovery Key
@@ -83,9 +80,6 @@ exports[`CreateSecretStorageDialog handles the happy path 1`] = `
- Enter a Security Phrase
@@ -147,7 +141,7 @@ exports[`CreateSecretStorageDialog handles the happy path 2`] = ` class="mx_Dialog_header" >

Save your Recovery Key diff --git a/test/unit-tests/components/views/rooms/EventTile/__snapshots__/EventTileThreadToolbar-test.tsx.snap b/test/unit-tests/components/views/rooms/EventTile/__snapshots__/EventTileThreadToolbar-test.tsx.snap index 0a6c0aeba5..7c1a4ed772 100644 --- a/test/unit-tests/components/views/rooms/EventTile/__snapshots__/EventTileThreadToolbar-test.tsx.snap +++ b/test/unit-tests/components/views/rooms/EventTile/__snapshots__/EventTileThreadToolbar-test.tsx.snap @@ -14,7 +14,17 @@ exports[`EventTileThreadToolbar renders 1`] = ` role="button" tabindex="0" > -
+ + +
diff --git a/yarn.lock b/yarn.lock index be6638ee5d..5e64107fd4 100644 --- a/yarn.lock +++ b/yarn.lock @@ -4161,10 +4161,10 @@ resolved "https://registry.yarnpkg.com/@unrs/resolver-binding-win32-x64-msvc/-/resolver-binding-win32-x64-msvc-1.11.1.tgz#538b1e103bf8d9864e7b85cc96fa8d6fb6c40777" integrity sha512-lrW200hZdbfRtztbygyaq/6jP6AKE8qQN2KvPcJ+x7wiD038YtnYtZ82IMNJ69GJibV7bwL3y9FgK+5w/pYt6g== -"@vector-im/compound-design-tokens@6.4.3": - version "6.4.3" - resolved "https://registry.yarnpkg.com/@vector-im/compound-design-tokens/-/compound-design-tokens-6.4.3.tgz#f8a98308650e841ffba6ca0820055e2bfe2b8af1" - integrity sha512-Zyqag2QCAfpRipLHSX/LEXj6OGFgBpilMQvNdr3a0iXeGASfkM3HZGid077kMRp9lvyHiQfPIs1BdllENwDSNQ== +"@vector-im/compound-design-tokens@6.6.0": + version "6.6.0" + resolved "https://registry.yarnpkg.com/@vector-im/compound-design-tokens/-/compound-design-tokens-6.6.0.tgz#deac29620caa4c3c6e6669e1392acf40c5ca8eed" + integrity sha512-IqHldApA5nG3US8bsbH/W2cHx2a7lOF7sOE1HQRAUxLP1B3yfIo8sgw1u6g2kvj8DM4sFIZoKcQ3Lvwym+AsYw== "@vector-im/compound-design-tokens@^6.4.3": version "6.5.0"