Replace legacy $spacing-X vars with Compound Design Tokens (#34380)

* Replace legacy `$spacing-X` vars with Compound Design Tokens

* Remove unused font size vars

* Use calc to get negative spacing vars
This commit is contained in:
Michael Telatynski
2026-07-22 10:10:57 +00:00
committed by GitHub
parent ef8cfda6fe
commit 49a2bdd7e4
87 changed files with 343 additions and 380 deletions
@@ -11,7 +11,7 @@ Please see LICENSE files in the repository root for full details.
}
.mx_AutocompleteInput_search_icon {
margin-left: $spacing-8;
margin-left: var(--cpd-space-2x);
fill: $secondary-content;
}
@@ -32,7 +32,7 @@ Please see LICENSE files in the repository root for full details.
resize: none;
/* `!important` is required to bypass global input styles. */
margin: 0 !important;
padding: $spacing-8 9px;
padding: var(--cpd-space-2x) 9px;
border: none !important;
color: $primary-content !important;
font-weight: normal !important;
@@ -55,15 +55,15 @@ Please see LICENSE files in the repository root for full details.
.mx_AutocompleteInput_editor_selection {
display: flex;
margin-left: $spacing-8;
margin-left: var(--cpd-space-2x);
}
.mx_AutocompleteInput_editor_selection_pill {
display: flex;
align-items: center;
border-radius: 12px;
padding-left: $spacing-8;
padding-right: $spacing-8;
padding-left: var(--cpd-space-2x);
padding-right: var(--cpd-space-2x);
background-color: $username-variant1-color;
color: #ffffff;
font-size: $font-12px;
@@ -88,7 +88,7 @@ Please see LICENSE files in the repository root for full details.
.mx_AutocompleteInput_suggestion {
display: flex;
align-items: center;
padding: $spacing-8;
padding: var(--cpd-space-2x);
cursor: pointer;
> * {
@@ -112,7 +112,7 @@ Please see LICENSE files in the repository root for full details.
}
.mx_AutocompleteInput_suggestion_title {
margin-right: $spacing-8;
margin-right: var(--cpd-space-2x);
}
.mx_AutocompleteInput_suggestion_description {
@@ -11,7 +11,7 @@ Please see LICENSE files in the repository root for full details.
color: $alert;
display: flex;
font-size: $font-12px;
gap: $spacing-8;
gap: var(--cpd-space-2x);
line-height: 1.2em;
min-height: 2.4em;
}
+4 -4
View File
@@ -17,8 +17,8 @@ Please see LICENSE files in the repository root for full details.
.mx_ViewSource_header {
border-bottom: 1px solid $quinary-content;
padding-bottom: $spacing-12;
margin-bottom: $spacing-12;
padding-bottom: var(--cpd-space-3x);
margin-bottom: var(--cpd-space-3x);
font-family: monospace;
.mx_CopyableText {
@@ -30,11 +30,11 @@ Please see LICENSE files in the repository root for full details.
font-size: $font-17px;
font-weight: 400;
color: $primary-content;
margin-top: $spacing-12;
margin-top: var(--cpd-space-3x);
}
.mx_ViewSource_details {
margin-top: $spacing-12;
margin-top: var(--cpd-space-3x);
}
.mx_CopyableText_border {