Files
web/components/TempDesignSystem/Text/Caption/caption.module.css
Pontus Dreij 8616e4ab76 Merged in feat/SW-1276-implement-design (pull request #1348)
Feat/SW-1276 implement design

* feat(SW-1276) UI implementation Desktop part 1 for MyStay

* feat(SW-1276) UI implementation Desktop part 2 for MyStay

* feat(SW-1276) UI implementation Mobile part 1 for MyStay

* refactor: move files from MyStay/MyStay to MyStay

* feat(SW-1276) Sidepeek implementation

* feat(SW-1276): Refactoring

* feat(SW-1276) UI implementation Mobile part 2 for MyStay

* feat(SW-1276): translations

* feat(SW-1276) fixed skeleton

* feat(SW-1276): Added missing translations

* feat(SW-1276): Removed console log

* feat(SW-1276) fixed translations

* feat(SW-1276): Added translations

* feat(SW-1276) fix dynamic ID:s

* feat(SW-1276) removed createElement

* feat(SW-1276): Fixed build errors

* feat(SW-1276): Updated label

* feat(SW-1276): Rewrite SummaryCard


Approved-by: Niclas Edenvin
2025-02-18 14:20:54 +00:00

120 lines
2.8 KiB
CSS

p.caption {
margin: 0;
padding: 0;
}
.captionFontOnly {
font-style: normal;
}
.bold {
font-family: var(--typography-Caption-Bold-fontFamily);
font-size: var(--typography-Caption-Bold-fontSize);
font-weight: 500; /* var(--typography-Caption-Bold-fontWeight); /* Commented till figma values are fixed to 500 instead of medium */
letter-spacing: var(--typography-Caption-Bold-letterSpacing);
line-height: var(--typography-Caption-Bold-lineHeight);
text-decoration: var(--typography-Caption-Bold-textDecoration);
}
.labels {
font-family: var(--typography-Caption-Labels-fontFamily);
font-size: var(--typography-Caption-Labels-fontSize);
font-weight: var(--typography-Caption-Labels-fontWeight);
letter-spacing: var(--typography-Caption-Labels-letterSpacing);
line-height: var(--typography-Caption-Labels-lineHeight);
text-decoration: var(--typography-Caption-Labels-textDecoration);
}
.underline {
font-family: var(--typography-Caption-Underline-fontFamily);
font-size: var(--typography-Caption-Underline-fontSize);
font-weight: var(--typography-Caption-Underline-fontWeight);
letter-spacing: var(--typography-Caption-Underline-letterSpacing);
line-height: var(--typography-Caption-Underline-lineHeight);
text-decoration: underline; /* var(--typography-Caption-Underline-textDecoration) /* Commented till figma values are fixed to underline instead of "underline" */
}
.regular {
font-family: var(--typography-Caption-Regular-fontFamily);
font-size: var(--typography-Caption-Regular-fontSize);
font-weight: var(--typography-Caption-Regular-fontWeight);
letter-spacing: var(--typography-Caption-Regular-letterSpacing);
line-height: var(--typography-Caption-Regular-lineHeight);
text-decoration: var(--typography-Caption-Regular-textDecoration);
}
.uppercase {
text-transform: uppercase;
}
.baseTextAccent {
color: var(--Base-Text-Accent);
}
.black {
color: var(--Main-Grey-100);
}
.burgundy {
color: var(--Scandic-Brand-Burgundy);
}
.pale {
color: var(--Scandic-Brand-Pale-Peach);
}
.textMediumContrast {
color: var(--Base-Text-Medium-contrast);
}
.baseTextHighContrast {
color: var(--Base-Text-High-contrast);
}
.baseTextMediumContrast {
color: var(--Base-Text-Medium-contrast);
}
.red {
color: var(--Scandic-Brand-Scandic-Red);
}
.white {
color: var(--UI-Opacity-White-100);
}
.uiTextActive {
color: var(--UI-Text-Active);
}
.uiTextMediumContrast {
color: var(--UI-Text-Medium-contrast);
}
.uiTextHighContrast {
color: var(--UI-Text-High-contrast);
}
.uiTextPlaceholder {
color: var(--UI-Text-Placeholder);
}
.disabled {
color: var(--Base-Text-Disabled);
}
.center {
text-align: center;
}
.left {
text-align: left;
}
.green {
color: var(--UI-Semantic-Success);
}
.blue {
color: var(--UI-Semantic-Information);
}