sorb/ThreadNet-Web
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases 4 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
31 changed files with 32 additions and 53 deletions
Download Patch File Download Diff File Expand all files Collapse all files
res/css/structures/_LeftPanel.pcss
+5 -5
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;
res/css/views/dialogs/_RoomSettingsDialog.pcss
+1 -1
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 {
res/css/views/dialogs/_SpaceSettingsDialog.pcss
+1 -1
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");
}
}
}
res/css/views/elements/_InviteReason.pcss
+1 -1
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;
res/css/views/messages/_CallEvent.pcss
+1 -1
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;
res/css/views/messages/_LegacyCallEvent.pcss
+4 -4
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");
}
}
res/css/views/messages/_MJitsiWidgetEvent.pcss
+1 -1
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");
}
}
res/css/views/rooms/_LiveContentSummary.pcss
+2 -2
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 {
res/css/views/rooms/_ReplyTile.pcss
+1 -1
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 {
res/css/views/rooms/_RoomCallBanner.pcss
+1 -1
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");
}
}
res/css/views/rooms/_RoomInfoLine.pcss
+1 -1
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 {
res/css/views/rooms/_RoomPreviewCard.pcss
+1 -1
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");
}
}
res/css/views/toasts/_IncomingLegacyCallToast.pcss
+3 -3
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;
res/css/views/toasts/_NonUrgentEchoFailureToast.pcss
+1 -1
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;
}
res/css/views/voip/LegacyCallView/_LegacyCallViewButtons.pcss
+1 -1
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 */
}
}
res/css/views/voip/_DialPad.pcss
+1 -1
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");
}
}
res/css/views/voip/_LegacyCallViewHeader.pcss
+1 -1
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");
}
}