Merged in chore/sw-3145-move-caption (pull request #2503)

chore(SW-3145): Move Caption to design-system * Move Caption to design-system * Mark Caption as deprecated Approved-by: Linus Flood Approved-by: Joakim Jäderberg
2025-07-03 07:48:24 +00:00
parent c7d40fd173
commit a7ac79e429
66 changed files with 93 additions and 90 deletions
--- a/packages/design-system/lib/components/Caption/caption.module.css
+++ b/packages/design-system/lib/components/Caption/caption.module.css
@@ -0,0 +1,127 @@
+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;
+}
+
+.striked {
+  text-decoration: line-through;
+}
+
+.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;
+}
+
+.right {
+  text-align: right;
+}
+
+.green {
+  color: var(--UI-Semantic-Success);
+}
+.blue {
+  color: var(--UI-Semantic-Information);
+}