PrivateCoffee/element-web
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 3

Use spacing variables on _BetaCard.pcss (#10291)

Browse source
This commit is contained in:
Suguru Hirahara 2023-03-06 16:25:10 +00:00 committed by GitHub
parent bda54a8b20
commit 4de9071934
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
1 changed files with 10 additions and 10 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

20
res/css/views/beta/_BetaCard.pcss
View file

@ -15,8 +15,8 @@ limitations under the License.
*/ */
.mx_BetaCard { .mx_BetaCard {
margin-bottom: 20px; margin-bottom: $spacing-20;
padding: 24px; padding: $spacing-24;
background-color: $system; background-color: $system;
border-radius: 8px; border-radius: 8px;
box-sizing: border-box; box-sizing: border-box;
@ -25,7 +25,7 @@ limitations under the License.
.mx_BetaCard_columns { .mx_BetaCard_columns {
display: flex; display: flex;
flex-flow: wrap; flex-flow: wrap;
gap: 20px; gap: $spacing-20;
justify-content: center; justify-content: center;
.mx_BetaCard_columns_description { .mx_BetaCard_columns_description {
@ -36,11 +36,11 @@ limitations under the License.
font-size: $font-18px; font-size: $font-18px;
line-height: $font-22px; line-height: $font-22px;
color: $primary-content; color: $primary-content;
margin: 4px 0 14px; margin: $spacing-4 0 14px; // TODO: use a spacing variable
display: flex; display: flex;
align-items: center; align-items: center;
column-gap: 12px; column-gap: $spacing-12;
} }
.mx_BetaCard_caption { .mx_BetaCard_caption {
@ -78,7 +78,7 @@ limitations under the License.
line-height: $font-15px; line-height: $font-15px;
> h4 { > h4 {
margin: 12px 0 0; margin: $spacing-12 0 0;
} }
> p { > p {
@ -102,13 +102,13 @@ limitations under the License.
.mx_BetaCard_relatedSettings { .mx_BetaCard_relatedSettings {
.mx_SettingsFlag { .mx_SettingsFlag {
margin: 16px 0 0; margin: $spacing-16 0 0;
font-size: $font-15px; font-size: $font-15px;
line-height: $font-24px; line-height: $font-24px;
color: $primary-content; color: $primary-content;
.mx_SettingsFlag_microcopy { .mx_SettingsFlag_microcopy {
margin-top: 4px; margin-top: $spacing-4;
font-size: $font-12px; font-size: $font-12px;
line-height: $font-15px; line-height: $font-15px;
} }
@ -122,10 +122,10 @@ limitations under the License.
.mx_BetaCard_betaPill { .mx_BetaCard_betaPill {
background-color: $accent-alt; background-color: $accent-alt;
padding: 4px 10px; padding: $spacing-4 10px; // TODO: use a spacing variable
border-radius: 8px; border-radius: 8px;
text-transform: uppercase; text-transform: uppercase;
font-size: 12px; font-size: $font-12px;
font-weight: $font-semi-bold; font-weight: $font-semi-bold;
line-height: 15px; line-height: 15px;
color: $button-primary-fg-color; color: $button-primary-fg-color;