8616e4ab76
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
150 lines
2.9 KiB
CSS
150 lines
2.9 KiB
CSS
.body {
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
|
|
.bodyFontOnly {
|
|
font-style: normal;
|
|
}
|
|
|
|
.bold {
|
|
font-family: var(--typography-Body-Bold-fontFamily);
|
|
font-size: var(--typography-Body-Bold-fontSize);
|
|
font-weight: 500;
|
|
letter-spacing: var(--typography-Body-Bold-letterSpacing);
|
|
line-height: var(--typography-Body-Bold-lineHeight);
|
|
text-decoration: var(--typography-Body-Bold-textDecoration);
|
|
}
|
|
|
|
.regular {
|
|
font-family: var(--typography-Body-Regular-fontFamily);
|
|
font-size: var(--typography-Body-Regular-fontSize);
|
|
font-weight: 400;
|
|
letter-spacing: var(--typography-Body-Regular-letterSpacing);
|
|
line-height: var(--typography-Body-Regular-lineHeight);
|
|
text-decoration: var(--typography-Body-Regular-textDecoration);
|
|
}
|
|
|
|
.underlined {
|
|
font-family: var(--typography-Body-Underline-fontFamily);
|
|
font-size: var(--typography-Body-Underline-fontSize);
|
|
font-weight: 500;
|
|
letter-spacing: var(--typography-Body-Underline-letterSpacing);
|
|
line-height: var(--typography-Body-Underline-lineHeight);
|
|
text-decoration: var(--typography-Body-Underline-textDecoration);
|
|
}
|
|
|
|
.uppercase {
|
|
font-family: var(--typography-Body-Regular-fontFamily);
|
|
font-size: var(--typography-Body-Regular-fontSize);
|
|
font-weight: var(--typography-Body-Bold-fontWeight);
|
|
letter-spacing: var(--typography-Body-Regular-letterSpacing);
|
|
line-height: var(--typography-Body-Regular-lineHeight);
|
|
text-decoration: var(--typography-Body-Regular-textDecoration);
|
|
text-transform: uppercase;
|
|
}
|
|
|
|
.textAlignCenter {
|
|
text-align: center;
|
|
}
|
|
|
|
.textAlignLeft {
|
|
text-align: left;
|
|
}
|
|
|
|
.textAlignRight {
|
|
text-align: right;
|
|
}
|
|
|
|
.black {
|
|
color: var(--Main-Grey-100);
|
|
}
|
|
|
|
.burgundy {
|
|
color: var(--Scandic-Brand-Burgundy);
|
|
}
|
|
|
|
.grey {
|
|
color: var(--UI-Grey-60);
|
|
}
|
|
|
|
.pale {
|
|
color: var(--Scandic-Brand-Pale-Peach);
|
|
}
|
|
|
|
.red {
|
|
color: var(--Scandic-Brand-Scandic-Red);
|
|
}
|
|
|
|
.textMediumContrast {
|
|
color: var(--Base-Text-Medium-contrast);
|
|
}
|
|
|
|
.baseTextHighContrast {
|
|
color: var(--Base-Text-High-contrast);
|
|
}
|
|
|
|
.baseTextMediumContrast {
|
|
color: var(--Base-Text-Medium-contrast);
|
|
}
|
|
|
|
.white {
|
|
color: var(--UI-Opacity-White-100);
|
|
}
|
|
|
|
.peach50 {
|
|
color: var(--Primary-Dark-On-Surface-Accent);
|
|
}
|
|
|
|
.baseTextMediumContrast {
|
|
color: var(--Base-Text-Medium-contrast);
|
|
}
|
|
|
|
.uiTextHighContrast {
|
|
color: var(--UI-Text-High-contrast);
|
|
}
|
|
|
|
.uiTextMediumContrast {
|
|
color: var(--UI-Text-Medium-contrast);
|
|
}
|
|
|
|
.uiTextPlaceholder {
|
|
color: var(--UI-Text-Placeholder);
|
|
}
|
|
|
|
.disabled {
|
|
color: var(--Base-Text-Disabled);
|
|
}
|
|
|
|
.primaryLight {
|
|
color: var(--Primary-Light-On-Surface-Text);
|
|
}
|
|
|
|
.secondaryLight {
|
|
color: var(--Secondary-Light-On-Surface-Text);
|
|
}
|
|
|
|
.tertiaryLight {
|
|
color: var(--Tertiary-Light-On-Surface-Text);
|
|
}
|
|
|
|
.primaryDark {
|
|
color: var(--Primary-Dark-On-Surface-Text);
|
|
}
|
|
|
|
.primaryDim {
|
|
color: var(--Primary-Dim-On-Surface-Text);
|
|
}
|
|
|
|
.primaryStrong {
|
|
color: var(--Primary-Strong-On-Surface-Text);
|
|
}
|
|
|
|
.baseText {
|
|
color: var(--Base-Text-Inverted);
|
|
}
|
|
|
|
.success {
|
|
color: var(--UI-Semantic-Success);
|
|
}
|