mirrors/element-web
1
0
Fork 0
mirror of https://github.com/vector-im/element-web.git synced 2025-12-02 16:01:10 +01:00
Code Issues Projects Releases Wiki Activity

Replace batch of legacy icons with compound design tokens (#31360)

Browse Source 
* Replace element-icons/call/dialpad.svg with compound

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Replace element-icons/call/hangup.svg with compound

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Replace element-icons/call/video-call.svg with compound

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Replace element-icons/call/voice-call.svg with compound

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Replace element-icons/cloud-off.svg with compound

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Replace element-icons/eye.svg with compound

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Remove debug

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update snapshots

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-01 10:38:20 +00:00 committed by GitHub
parent 0c293bbbd0
commit f46869e114
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
31 changed files with 32 additions and 53 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
playwright/snapshots/settings/room-settings/room-video-tab.spec.ts/room-video-settings-linux.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 44 KiB

After

Width:  |  Height:  |  Size: 44 KiB

BIN
playwright/snapshots/voip/element-call.spec.ts/incoming-call-group-video-toast-checked-linux.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 13 KiB

After

Width:  |  Height:  |  Size: 13 KiB

BIN
playwright/snapshots/voip/element-call.spec.ts/incoming-call-group-video-toast-unchecked-linux.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 13 KiB

After

Width:  |  Height:  |  Size: 14 KiB

BIN
playwright/snapshots/voip/element-call.spec.ts/incoming-call-group-voice-toast-linux.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 11 KiB

After

Width:  |  Height:  |  Size: 11 KiB

BIN
playwright/snapshots/voip/pstn.spec.ts/dialpad-linux.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 13 KiB

After

Width:  |  Height:  |  Size: 13 KiB

10
res/css/structures/_LeftPanel.pcss
View File

@ -125,11 +125,11 @@ Please see LICENSE files in the repository root for full details.
&::before {
content: "";
position: absolute;
top: 8px;
left: 8px;
width: 16px;
height: 16px;
mask-image: url("$(res)/img/element-icons/call/dialpad.svg");
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;

2
res/css/views/dialogs/_RoomSettingsDialog.pcss
View File

@ -13,7 +13,7 @@ Please see LICENSE files in the repository root for full details.
}
.mx_RoomSettingsDialog_voiceIcon::before {
mask-image: url("$(res)/img/element-icons/call/voice-call.svg");
mask-image: url("@vector-im/compound-design-tokens/icons/voice-call-solid.svg");
}
.mx_RoomSettingsDialog_securityIcon::before {

2
res/css/views/dialogs/_SpaceSettingsDialog.pcss
View File

@ -78,7 +78,7 @@ Please see LICENSE files in the repository root for full details.
}
.mx_SpaceSettingsDialog_visibilityIcon::before {
mask-image: url("$(res)/img/element-icons/eye.svg");
mask-image: url("@vector-im/compound-design-tokens/icons/visibility-on.svg");
}
}
}

2
res/css/views/elements/_InviteReason.pcss
View File

@ -27,7 +27,7 @@ Please see LICENSE files in the repository root for full details.
content: "";
margin-right: 8px;
background-color: $secondary-content;
mask-image: url("$(res)/img/element-icons/eye.svg");
mask-image: url("@vector-im/compound-design-tokens/icons/visibility-on.svg");
display: inline-block;
width: 18px;
height: 14px;

2
res/css/views/messages/_CallEvent.pcss
View File

@ -51,7 +51,7 @@ Please see LICENSE files in the repository root for full details.
vertical-align: middle;
content: "";
background-color: $secondary-content;
mask-image: url("$(res)/img/element-icons/call/video-call.svg");
mask-image: url("@vector-im/compound-design-tokens/icons/video-call-solid.svg");
mask-size: 16px;
width: 16px;
height: 16px;

8
res/css/views/messages/_LegacyCallEvent.pcss
View File

@ -54,13 +54,13 @@ Please see LICENSE files in the repository root for full details.
.mx_LegacyCallEvent_type_icon::before,
.mx_LegacyCallEvent_content_button_callBack span::before,
.mx_LegacyCallEvent_content_button_answer span::before {
mask-image: url("$(res)/img/element-icons/call/voice-call.svg");
mask-image: url("@vector-im/compound-design-tokens/icons/voice-call-solid.svg");
}
&.mx_LegacyCallEvent_rejected,
&.mx_LegacyCallEvent_noAnswer {
.mx_LegacyCallEvent_type_icon::before {
mask-image: url("$(res)/img/element-icons/call/hangup.svg");
mask-image: url("@vector-im/compound-design-tokens/icons/end-call.svg");
}
}
}
@ -69,7 +69,7 @@ Please see LICENSE files in the repository root for full details.
.mx_LegacyCallEvent_type_icon::before,
.mx_LegacyCallEvent_content_button_callBack span::before,
.mx_LegacyCallEvent_content_button_answer span::before {
mask-image: url("$(res)/img/element-icons/call/video-call.svg");
mask-image: url("@vector-im/compound-design-tokens/icons/video-call-solid.svg");
}
&.mx_LegacyCallEvent_rejected,
@ -169,7 +169,7 @@ Please see LICENSE files in the repository root for full details.
.mx_LegacyCallEvent_content_button_reject {
span::before {
mask-image: url("$(res)/img/element-icons/call/hangup.svg");
mask-image: url("@vector-im/compound-design-tokens/icons/end-call.svg");
}
}

2
res/css/views/messages/_MJitsiWidgetEvent.pcss
View File

@ -9,6 +9,6 @@ Please see LICENSE files in the repository root for full details.
.mx_EventTileBubble.mx_MJitsiWidgetEvent {
&::before {
background-color: $header-panel-text-primary-color; /* XXX: Variable abuse */
mask-image: url("$(res)/img/element-icons/call/video-call.svg");
mask-image: url("@vector-im/compound-design-tokens/icons/video-call-solid.svg");
}
}

4
res/css/views/rooms/_LiveContentSummary.pcss
View File

@ -22,11 +22,11 @@ Please see LICENSE files in the repository root for full details.
}
&.mx_LiveContentSummary_text_video::before {
mask-image: url("$(res)/img/element-icons/call/video-call.svg");
mask-image: url("@vector-im/compound-design-tokens/icons/video-call-solid.svg");
}
&.mx_LiveContentSummary_text_voice::before {
mask-image: url("$(res)/img/element-icons/call/voice-call.svg");
mask-image: url("@vector-im/compound-design-tokens/icons/voice-call-solid.svg");
}
&.mx_LiveContentSummary_text_active {

2
res/css/views/rooms/_ReplyTile.pcss
View File

@ -16,7 +16,7 @@ Please see LICENSE files in the repository root for full details.
}
&.mx_ReplyTile_video .mx_MFileBody_info_icon::before {
mask-image: url("$(res)/img/element-icons/call/video-call.svg");
mask-image: url("@vector-im/compound-design-tokens/icons/video-call-solid.svg");
}
> a {

2
res/css/views/rooms/_RoomCallBanner.pcss
View File

@ -41,6 +41,6 @@ Please see LICENSE files in the repository root for full details.
width: 16px;
height: 1.2em; /* to match line height */
margin-right: 8px;
mask-image: url("$(res)/img/element-icons/call/video-call.svg");
mask-image: url("@vector-im/compound-design-tokens/icons/video-call-solid.svg");
}
}

2
res/css/views/rooms/_RoomInfoLine.pcss
View File

@ -36,7 +36,7 @@ Please see LICENSE files in the repository root for full details.
&.mx_RoomInfoLine_video::before {
width: 16px;
mask-size: 16px;
mask-image: url("$(res)/img/element-icons/call/video-call.svg");
mask-image: url("@vector-im/compound-design-tokens/icons/video-call-solid.svg");
}
.mx_RoomInfoLine_members {

2
res/css/views/rooms/_RoomPreviewCard.pcss
View File

@ -81,7 +81,7 @@ Please see LICENSE files in the repository root for full details.
mask-size: 22px;
mask-position: center;
mask-repeat: no-repeat;
mask-image: url("$(res)/img/element-icons/call/video-call.svg");
mask-image: url("@vector-im/compound-design-tokens/icons/video-call-solid.svg");
}
}

6
res/css/views/toasts/_IncomingLegacyCallToast.pcss
View File

@ -65,14 +65,14 @@ Please see LICENSE files in the repository root for full details.
&.mx_IncomingLegacyCallToast_content_voice {
.mx_LegacyCallEvent_type .mx_LegacyCallEvent_type_icon::before,
.mx_IncomingLegacyCallToast_buttons .mx_IncomingLegacyCallToast_button_accept span::before {
mask-image: url("$(res)/img/element-icons/call/voice-call.svg");
mask-image: url("@vector-im/compound-design-tokens/icons/voice-call-solid.svg");
}
}
&.mx_IncomingLegacyCallToast_content_video {
.mx_LegacyCallEvent_type .mx_LegacyCallEvent_type_icon::before,
.mx_IncomingLegacyCallToast_buttons .mx_IncomingLegacyCallToast_button_accept span::before {
mask-image: url("$(res)/img/element-icons/call/video-call.svg");
mask-image: url("@vector-im/compound-design-tokens/icons/video-call-solid.svg");
}
}
@ -100,7 +100,7 @@ Please see LICENSE files in the repository root for full details.
}
&.mx_IncomingLegacyCallToast_button_decline span::before {
mask-image: url("$(res)/img/element-icons/call/hangup.svg");
mask-image: url("@vector-im/compound-design-tokens/icons/end-call.svg");
mask-size: 16px;
width: 16px;
height: 16px;

2
res/css/views/toasts/_NonUrgentEchoFailureToast.pcss
View File

@ -15,7 +15,7 @@ Please see LICENSE files in the repository root for full details.
mask-size: contain;
mask-repeat: no-repeat;
background-color: #fff; /* we know that non-urgent toasts are always styled the same */
mask-image: url("$(res)/img/element-icons/cloud-off.svg");
mask-image: url("@vector-im/compound-design-tokens/icons/offline.svg");
margin-right: 8px;
}

2
res/css/views/voip/LegacyCallView/_LegacyCallViewButtons.pcss
View File

@ -155,7 +155,7 @@ Please see LICENSE files in the repository root for full details.
background-color: $alert;
&::before {
mask-image: url("$(res)/img/element-icons/call/hangup.svg");
mask-image: url("@vector-im/compound-design-tokens/icons/end-call.svg");
background-color: white; /* Same on both themes */
}
}

2
res/css/views/voip/_DialPad.pcss
View File

@ -54,6 +54,6 @@ Please see LICENSE files in the repository root for full details.
mask-size: 20px;
mask-position: center;
background-color: #fff; /* on all themes */
mask-image: url("$(res)/img/element-icons/call/voice-call.svg");
mask-image: url("@vector-im/compound-design-tokens/icons/voice-call-solid.svg");
}
}

2
res/css/views/voip/_LegacyCallViewHeader.pcss
View File

@ -116,6 +116,6 @@ Please see LICENSE files in the repository root for full details.
mask-repeat: no-repeat;
mask-size: contain;
mask-position: center;
mask-image: url("$(res)/img/element-icons/call/voice-call.svg");
mask-image: url("@vector-im/compound-design-tokens/icons/voice-call-solid.svg");
}
}

3
res/img/element-icons/call/dialpad.svg
View File

@ -1,3 +0,0 @@
<svg width="12" height="18" viewBox="0 0 12 18" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M6 14.25C5.175 14.25 4.5 14.925 4.5 15.75C4.5 16.575 5.175 17.25 6 17.25C6.825 17.25 7.5 16.575 7.5 15.75C7.5 14.925 6.825 14.25 6 14.25ZM1.5 0.75C0.675 0.75 0 1.425 0 2.25C0 3.075 0.675 3.75 1.5 3.75C2.325 3.75 3 3.075 3 2.25C3 1.425 2.325 0.75 1.5 0.75ZM1.5 5.25C0.675 5.25 0 5.925 0 6.75C0 7.575 0.675 8.25 1.5 8.25C2.325 8.25 3 7.575 3 6.75C3 5.925 2.325 5.25 1.5 5.25ZM1.5 9.75C0.675 9.75 0 10.425 0 11.25C0 12.075 0.675 12.75 1.5 12.75C2.325 12.75 3 12.075 3 11.25C3 10.425 2.325 9.75 1.5 9.75ZM10.5 3.75C11.325 3.75 12 3.075 12 2.25C12 1.425 11.325 0.75 10.5 0.75C9.675 0.75 9 1.425 9 2.25C9 3.075 9.675 3.75 10.5 3.75ZM6 9.75C5.175 9.75 4.5 10.425 4.5 11.25C4.5 12.075 5.175 12.75 6 12.75C6.825 12.75 7.5 12.075 7.5 11.25C7.5 10.425 6.825 9.75 6 9.75ZM10.5 9.75C9.675 9.75 9 10.425 9 11.25C9 12.075 9.675 12.75 10.5 12.75C11.325 12.75 12 12.075 12 11.25C12 10.425 11.325 9.75 10.5 9.75ZM10.5 5.25C9.675 5.25 9 5.925 9 6.75C9 7.575 9.675 8.25 10.5 8.25C11.325 8.25 12 7.575 12 6.75C12 5.925 11.325 5.25 10.5 5.25ZM6 5.25C5.175 5.25 4.5 5.925 4.5 6.75C4.5 7.575 5.175 8.25 6 8.25C6.825 8.25 7.5 7.575 7.5 6.75C7.5 5.925 6.825 5.25 6 5.25ZM6 0.75C5.175 0.75 4.5 1.425 4.5 2.25C4.5 3.075 5.175 3.75 6 3.75C6.825 3.75 7.5 3.075 7.5 2.25C7.5 1.425 6.825 0.75 6 0.75Z" fill="#737D8C"/>
</svg>
Side by Side

Before

Width:  |  Height:  |  Size: 1.4 KiB

4
res/img/element-icons/call/hangup.svg
View File

@ -1,4 +0,0 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M8.02698 15.9613C9.16801 17.1932 11.9148 19.3263 12.6635 19.7641C12.7078 19.79 12.7585 19.8201 12.8152 19.8538C13.9576 20.5329 17.5373 22.6609 20.1454 20.6694C22.1661 19.1266 21.5091 17.3909 20.8289 16.875C20.3633 16.5128 18.9914 15.5145 17.7006 14.6152C16.4331 13.7322 15.7268 14.4397 15.2492 14.918C15.2404 14.9268 15.2317 14.9355 15.2231 14.9442L14.2621 15.9051C14.0174 16.1498 13.6451 16.0605 13.2886 15.7804C12.0092 14.8061 11.0681 13.8659 10.5972 13.395L10.5933 13.391C10.1225 12.9202 9.19387 11.9908 8.21957 10.7114C7.93949 10.3548 7.85018 9.9826 8.09489 9.73789L9.05586 8.77693C9.06448 8.7683 9.0732 8.7596 9.08199 8.75082C9.56034 8.27321 10.2678 7.56684 9.38479 6.29937C8.48555 5.0086 7.4872 3.6367 7.125 3.17106C6.60907 2.49094 4.87345 1.83392 3.33056 3.85458C1.33907 6.46274 3.46708 10.0424 4.1462 11.1848C4.17991 11.2415 4.21005 11.2922 4.23593 11.3365C4.67367 12.0851 6.79507 14.8202 8.02698 15.9613Z" fill="currentColor"/>
<path d="M20.6971 3.07817C20.94 2.83153 20.94 2.43163 20.6971 2.18499C20.4542 1.93834 20.0603 1.93834 19.8174 2.18499L17 5.04555L14.1826 2.18499C13.9397 1.93834 13.5458 1.93834 13.3029 2.18499C13.06 2.43163 13.06 2.83153 13.3029 3.07817L16.1203 5.93873L13.1822 8.92183C12.9393 9.16847 12.9393 9.56837 13.1822 9.81501C13.4251 10.0617 13.819 10.0617 14.0619 9.81501L17 6.83192L19.9381 9.81501C20.181 10.0617 20.5749 10.0617 20.8178 9.81501C21.0607 9.56837 21.0607 9.16847 20.8178 8.92182L17.8797 5.93873L20.6971 3.07817Z" fill="currentColor"/>
</svg>
Side by Side

Before

Width:  |  Height:  |  Size: 1.6 KiB

4
res/img/element-icons/call/video-call.svg
View File

@ -1,4 +0,0 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M0 7C0 5.34315 1.34315 4 3 4H14C15.6569 4 17 5.34315 17 7V17C17 18.6569 15.6569 20 14 20H3C1.34315 20 0 18.6569 0 17V7Z" fill="currentColor"/>
<path d="M19 9L22.3753 6.29976C23.0301 5.77595 24 6.24212 24 7.08062V16.9194C24 17.7579 23.0301 18.2241 22.3753 17.7002L19 15V9Z" fill="currentColor"/>
</svg>
Side by Side

Before

Width:  |  Height:  |  Size: 407 B

3
res/img/element-icons/call/voice-call.svg
View File

@ -1,3 +0,0 @@
<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M6.02698 13.9613C7.16801 15.1932 9.91484 17.3263 10.6635 17.7641C10.7078 17.79 10.7585 17.8201 10.8152 17.8538C11.9576 18.5329 15.5373 20.6609 18.1454 18.6694C20.1661 17.1266 19.5091 15.3909 18.8289 14.875C18.3633 14.5128 16.9914 13.5145 15.7006 12.6152C14.4331 11.7322 13.7268 12.4397 13.2492 12.918C13.2404 12.9268 13.2317 12.9355 13.2231 12.9442L12.2621 13.9051C12.0174 14.1498 11.6451 14.0605 11.2886 13.7804C10.0092 12.8061 9.06809 11.8659 8.59723 11.395L8.59326 11.391C8.12246 10.9202 7.19387 9.99076 6.21957 8.7114C5.93949 8.35485 5.85018 7.9826 6.09489 7.73789L7.05586 6.77693C7.06448 6.7683 7.0732 6.7596 7.08199 6.75082C7.56034 6.27321 8.2678 5.56684 7.38479 4.29937C6.48555 3.0086 5.4872 1.6367 5.125 1.17106C4.60907 0.490937 2.87345 -0.166084 1.33056 1.85458C-0.660932 4.46274 1.46708 8.04241 2.1462 9.18482C2.17991 9.24152 2.21005 9.29221 2.23593 9.33649C2.67367 10.0851 4.79507 12.8203 6.02698 13.9613Z" fill="black"/>
</svg>
Side by Side

Before

Width:  |  Height:  |  Size: 1.0 KiB

3
res/img/element-icons/cloud-off.svg
View File

@ -1,3 +0,0 @@
<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="M1.53033 0.46967C1.23744 0.176777 0.762563 0.176777 0.46967 0.46967C0.176777 0.762563 0.176777 1.23744 0.46967 1.53033L4.3982 5.45886C3.81109 6.13809 3.38896 7.01315 3.21555 7.99387C1.96379 8.20624 1 9.465 1 10.981C1 12.6455 2.16209 14 3.59014 14H12.9393L16.4697 17.5303C16.7626 17.8232 17.2374 17.8232 17.5303 17.5303C17.8232 17.2374 17.8232 16.7626 17.5303 16.4697L1.53033 0.46967ZM17 10.9817C16.998 11.8303 16.6946 12.5985 16.2081 13.1475L7.07635 4.01569C7.18805 4.00529 7.30083 4 7.41451 4C8.75982 4 9.99711 4.71787 10.8072 5.94503C11.0993 5.85476 11.4011 5.80939 11.7058 5.80939C13.0303 5.80939 14.2138 6.65743 14.8199 8.00337C16.0519 8.23522 17 9.48685 17 10.9817Z" fill="black"/>
</svg>
Side by Side

Before

Width:  |  Height:  |  Size: 839 B

3
res/img/element-icons/eye.svg
View File

@ -1,3 +0,0 @@
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M14.3094 5.96587C15.3206 7.15704 15.3417 8.85457 14.3412 10.0548C13.0889 11.5571 10.9822 13.3332 8.02104 13.3332C5.05992 13.3332 2.9532 11.5571 1.70087 10.0548C0.700398 8.85457 0.721506 7.15704 1.7327 5.96587C3.01174 4.45918 5.1391 2.6665 8.02104 2.6665C10.903 2.6665 13.0303 4.45918 14.3094 5.96587ZM11.5556 7.99984C11.5556 9.96352 9.96369 11.5554 8.00001 11.5554C6.03633 11.5554 4.44446 9.96352 4.44446 7.99984C4.44446 6.03616 6.03633 4.44428 8.00001 4.44428C9.96369 4.44428 11.5556 6.03616 11.5556 7.99984ZM8.00001 9.77761C8.98185 9.77761 9.77779 8.98168 9.77779 7.99984C9.77779 7.018 8.98185 6.22206 8.00001 6.22206C7.01817 6.22206 6.22224 7.018 6.22224 7.99984C6.22224 8.98168 7.01817 9.77761 8.00001 9.77761Z" fill="white"/>
</svg>
Side by Side

Before

Width:  |  Height:  |  Size: 887 B

2
src/components/structures/LeftPanel.tsx
View File

@ -344,7 +344,7 @@ export default class LeftPanel extends React.Component<IProps, IState> {
if (this.state.supportsPstnProtocol) {
dialPadButton = (
<AccessibleButton
className={classNames("mx_LeftPanel_dialPadButton", {})}
className="mx_LeftPanel_dialPadButton"
onClick={this.onDialPad}
title={_t("left_panel|open_dial_pad")}
/>

7
src/components/views/pips/WidgetPip.tsx
View File

@ -8,7 +8,7 @@ Please see LICENSE files in the repository root for full details.
import React, { type FC, type RefObject, useCallback, useMemo } from "react";
import { type Room, RoomEvent } from "matrix-js-sdk/src/matrix";
import BackIcon from "@vector-im/compound-design-tokens/assets/web/icons/arrow-left";
import { ArrowLeftIcon, EndCallIcon } from "@vector-im/compound-design-tokens/assets/web/icons";
import PersistentApp from "../elements/PersistentApp";
import defaultDispatcher from "../../../dispatcher/dispatcher";
@ -20,7 +20,6 @@ import { Container, WidgetLayoutStore } from "../../../stores/widgets/WidgetLayo
import { useTypedEventEmitterState } from "../../../hooks/useEventEmitter";
import Toolbar from "../../../accessibility/Toolbar";
import { RovingAccessibleButton } from "../../../accessibility/RovingTabIndex";
import { Icon as HangupIcon } from "../../../../res/img/element-icons/call/hangup.svg";
import { _t } from "../../../languageHandler";
import { WidgetType } from "../../../widgets/WidgetType";
import { WidgetMessagingStore } from "../../../stores/widgets/WidgetMessagingStore";
@ -112,7 +111,7 @@ export const WidgetPip: FC<Props> = ({ widgetId, room, viewingRoom, onStartMovin
className="mx_WidgetPip_backButton"
aria-label={_t("action|back")}
>
<BackIcon className="mx_Icon mx_Icon_16" />
<ArrowLeftIcon className="mx_Icon mx_Icon_16" />
{roomName}
</RovingAccessibleButton>
</Toolbar>
@ -124,7 +123,7 @@ export const WidgetPip: FC<Props> = ({ widgetId, room, viewingRoom, onStartMovin
aria-label={_t("action|leave")}
placement="top"
>
<HangupIcon className="mx_Icon mx_Icon_24" />
<EndCallIcon className="mx_Icon mx_Icon_24" />
</RovingAccessibleButton>
</Toolbar>
)}

2
src/vector/jitsi/index.pcss
View File

@ -99,7 +99,7 @@ html {
background-color: $dark-fg;
mask-repeat: no-repeat;
mask-position: center;
mask-image: url("$(res)/img/element-icons/call/video-call.svg");
mask-image: url("@vector-im/compound-design-tokens/icons/video-call-solid.svg");
mask-size: $icon-size;
display: block;
width: $icon-size;