From 753f8ebd5c42e9bb0ead206f59b1afd57bcee59a Mon Sep 17 00:00:00 2001 From: Pontus Dreij Date: Mon, 26 Aug 2024 10:22:44 +0200 Subject: [PATCH] feat(SW-185): Added correct tokens --- components/Footer/Details/details.module.css | 9 ++++----- components/Footer/Details/index.tsx | 3 +-- components/Footer/Navigation/MainNav/mainnav.module.css | 2 +- .../Navigation/SecondaryNav/secondarynav.module.css | 4 ++-- components/Footer/Navigation/navigation.module.css | 3 +-- components/TempDesignSystem/Text/Body/body.module.css | 4 ++-- .../TempDesignSystem/Text/Footnote/footnote.module.css | 2 +- 7 files changed, 12 insertions(+), 15 deletions(-) diff --git a/components/Footer/Details/details.module.css b/components/Footer/Details/details.module.css index 6b1ef6c05..adbf86603 100644 --- a/components/Footer/Details/details.module.css +++ b/components/Footer/Details/details.module.css @@ -1,6 +1,6 @@ .details { - background: var(--Main-Red-100); - color: var(--Main-Brand-PalePeach); + background: var(--Base-Text-High-contrast); + color: var(--Primary-Dark-On-Surface-Text); padding: var(--Spacing-x3) var(--Spacing-x2) var(--Spacing-x6); } @@ -27,7 +27,7 @@ justify-content: space-between; margin-bottom: var(--Spacing-x2); padding-bottom: var(--Spacing-x2); - border-bottom: 1px solid var(--Scandic-Peach-80); + border-bottom: 1px solid var(--Base-Text-Medium-contrast); } .navigation { @@ -54,11 +54,10 @@ @media screen and (min-width: 1367px) { .details { - color: var(--Main-Grey-White); padding: var(--Spacing-x6) var(--Spacing-x5) var(--Spacing-x4); } .bottomContainer { - border-top: 1px solid var(--Scandic-Peach-80); + border-top: 1px solid var(--Base-Text-Medium-contrast); padding-top: var(--Spacing-x2); flex-direction: row; } diff --git a/components/Footer/Details/index.tsx b/components/Footer/Details/index.tsx index a218da71e..830abfb2c 100644 --- a/components/Footer/Details/index.tsx +++ b/components/Footer/Details/index.tsx @@ -2,7 +2,6 @@ import LanguageSwitcher from "@/components/Current/Header/LanguageSwitcher" import { getIconByIconName } from "@/components/Icons/get-icon-by-icon-name" import Image from "@/components/Image" import Link from "@/components/TempDesignSystem/Link" -import Body from "@/components/TempDesignSystem/Text/Body" import Footnote from "@/components/TempDesignSystem/Text/Footnote" import { getLang } from "@/i18n/serverContext" @@ -10,7 +9,7 @@ import { footer } from "../mockedData" import styles from "./details.module.css" -import { IconName } from "@/types/components/icon" +import type { IconName } from "@/types/components/icon" function socialIcon(iconName: string): JSX.Element | null { const SocialIcon = getIconByIconName(iconName as IconName) diff --git a/components/Footer/Navigation/MainNav/mainnav.module.css b/components/Footer/Navigation/MainNav/mainnav.module.css index aff66a524..933c9e774 100644 --- a/components/Footer/Navigation/MainNav/mainnav.module.css +++ b/components/Footer/Navigation/MainNav/mainnav.module.css @@ -8,7 +8,7 @@ .mainNavigationItem { padding: var(--Spacing-x3) 0; - border-bottom: 1px solid var(--Scandic-Peach-20); + border-bottom: 1px solid var(--Primary-Light-On-Surface-Divider); &:first-child { padding-top: 0; } diff --git a/components/Footer/Navigation/SecondaryNav/secondarynav.module.css b/components/Footer/Navigation/SecondaryNav/secondarynav.module.css index 0ef64b087..3f47d32c7 100644 --- a/components/Footer/Navigation/SecondaryNav/secondarynav.module.css +++ b/components/Footer/Navigation/SecondaryNav/secondarynav.module.css @@ -19,8 +19,8 @@ } .secondaryNavigationGroupTitle { - color: var(--Scandic-Peach-80); - font-weight: 500; + color: var(--Base-Text-Medium-contrast); + font-weight: var(--typography-Body-Bold-fontWeight); font-family: var(--typography-Body-Bold-fontFamily); margin: 0; } diff --git a/components/Footer/Navigation/navigation.module.css b/components/Footer/Navigation/navigation.module.css index 4d5598cc4..df5dfbcf5 100644 --- a/components/Footer/Navigation/navigation.module.css +++ b/components/Footer/Navigation/navigation.module.css @@ -1,7 +1,6 @@ .section { - background: var(--Scandic-Brand-Pale-Peach); + background: var(--Primary-Light-Surface-Normal); padding: var(--Spacing-x7) var(--Spacing-x2); - color: var(--Scandic-Brand-Burgundy); } .maxWidth { diff --git a/components/TempDesignSystem/Text/Body/body.module.css b/components/TempDesignSystem/Text/Body/body.module.css index 4f661bbd5..d13de5b44 100644 --- a/components/TempDesignSystem/Text/Body/body.module.css +++ b/components/TempDesignSystem/Text/Body/body.module.css @@ -37,7 +37,7 @@ .uppercase { font-family: var(--typography-Body-Regular-fontFamily); font-size: var(--typography-Body-Regular-fontSize); - font-weight: 450; + 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); @@ -85,5 +85,5 @@ } .peach80 { - color: var(--Scandic-Peach-80); + color: var(--Base-Text-Medium-contrast); } diff --git a/components/TempDesignSystem/Text/Footnote/footnote.module.css b/components/TempDesignSystem/Text/Footnote/footnote.module.css index 20f73c04d..7c24a8ddc 100644 --- a/components/TempDesignSystem/Text/Footnote/footnote.module.css +++ b/components/TempDesignSystem/Text/Footnote/footnote.module.css @@ -28,7 +28,7 @@ .uppercase { font-family: var(--typography-Footnote-Regular-fontFamily); font-size: var(--typography-Footnote-Regular-fontSize); - font-weight: 450; + font-weight: var(--typography-Footnote-Bold-fontWeight); letter-spacing: var(--typography-Footnote-Regular-letterSpacing); line-height: var(--typography-Footnote-Regular-lineHeight); text-decoration: var(--typography-Footnote-Regular-textDecoration);