From b3b3704c86d3e2228cd5d3b01d99f37317872c2b Mon Sep 17 00:00:00 2001 From: Christian Andolf Date: Tue, 27 May 2025 16:54:09 +0200 Subject: [PATCH] feat: update links default color to match design documents --- .../sas-x-scandic/link/LinkAccountForm.tsx | 5 +- .../(protected)/sas-x-scandic/login/page.tsx | 1 - .../sas-x-scandic/otp/OneTimePasswordForm.tsx | 1 - .../JobylonFeed/JobylonCard/index.tsx | 2 +- .../JourneyTable/ClientTable/Row/index.tsx | 2 +- .../Stays/EmptyUpcomingStays/index.tsx | 6 +- .../Blocks/UspGrid/renderOptions.tsx | 7 +- .../HotelListItem/hotelListItem.module.css | 2 +- .../DestinationsList/Destination/index.tsx | 4 +- .../hotelListingItem.module.css | 2 +- .../IntroSection/TripAdvisorLink/index.tsx | 3 +- .../ContactInformation/index.tsx | 6 +- .../HotelPage/SidePeeks/Activities/index.tsx | 2 +- .../RestaurantBar/RestaurantBarItem/index.tsx | 3 +- .../HotelSubpage/HtmlContent/index.tsx | 2 +- .../Sidebar/RestaurantSidebar.tsx | 3 +- .../Header/MyPagesMobileDropdown/index.tsx | 7 +- .../Current/Header/TopMenu/index.tsx | 2 - .../DeprecatedJsonToHtml/renderOptions.tsx | 6 +- .../Footer/Navigation/MainNav/index.tsx | 1 - .../Footer/Navigation/SecondaryNav/index.tsx | 1 - .../components/Forms/Signup/index.tsx | 8 +- .../MainMenu/MyPagesMenuContent/index.tsx | 2 +- .../NavigationMenu/MegaMenu/index.tsx | 2 - .../NavigationMenuItem/index.tsx | 4 +- .../HotelDetails/index.tsx | 4 +- .../Receipt/Room/index.tsx | 3 +- .../RoomOne/JoinScandicFriendsCard/index.tsx | 3 - .../PaymentCallback/TimeoutSpinner/index.tsx | 2 +- .../Payment/TermsAndConditions/index.tsx | 8 +- .../HotelReservation/FindMyBooking/index.tsx | 1 - .../HotelReservation/HotelCard/index.tsx | 3 +- .../Steps/ConfirmationStep/index.tsx | 9 +- .../BookingSummary/SummaryCard/index.tsx | 1 - .../GuaranteeLateArrival/Form/index.tsx | 8 +- .../MobileMapButtonContainer/index.tsx | 1 - .../HotelReservation/SelectHotel/index.tsx | 7 +- .../hotelDescription.module.css | 2 +- .../components/JsonToHtml/renderOptions.tsx | 8 +- .../LanguageSwitcherContent/index.tsx | 38 +- .../languageSwitcherContent.module.css | 15 - .../languageSwitcher.module.css | 4 +- .../MyPages/Profile/MembershipCards/index.tsx | 2 +- .../components/MyPages/Sidebar/index.tsx | 9 +- .../components/MyPages/Surprises/Client.tsx | 2 +- .../components/SasTierComparison/index.tsx | 2 +- .../components/Section/Link/index.tsx | 7 +- .../JoinLoyalty/Contact/ContactRow/index.tsx | 3 +- .../Sidebar/JoinLoyalty/ReadMore/index.tsx | 8 +- .../components/Sidebar/JoinLoyalty/index.tsx | 1 - .../TempDesignSystem/Alert/index.tsx | 2 - .../Breadcrumbs/breadcrumbs.module.css | 2 +- .../TempDesignSystem/Breadcrumbs/index.tsx | 1 - .../TempDesignSystem/Link/link.module.css | 340 +++++------- .../TempDesignSystem/Link/variants.ts | 21 +- .../TempDesignSystem/LoyaltyCard/index.tsx | 3 +- .../design-system/generate/variables.json | 516 ++++++++++-------- packages/design-system/lib/styles/base.css | 3 +- packages/design-system/lib/styles/base.js | 3 +- .../lib/styles/downtown-camper.css | 7 +- .../lib/styles/downtown-camper.js | 5 +- .../design-system/lib/styles/grand-hotel.css | 7 +- .../design-system/lib/styles/grand-hotel.js | 5 +- .../design-system/lib/styles/haymarket.css | 7 +- .../design-system/lib/styles/haymarket.js | 5 +- .../design-system/lib/styles/hotel-norge.css | 5 +- .../design-system/lib/styles/hotel-norge.js | 9 +- packages/design-system/lib/styles/marski.css | 5 +- packages/design-system/lib/styles/marski.js | 5 +- .../design-system/lib/styles/scandic-go.css | 7 +- .../design-system/lib/styles/scandic-go.js | 5 +- packages/design-system/lib/styles/scandic.css | 7 +- packages/design-system/lib/styles/scandic.js | 7 +- packages/design-system/lib/tokens/index.ts | 110 ++-- 74 files changed, 623 insertions(+), 699 deletions(-) diff --git a/apps/scandic-web/app/[lang]/(partner)/(sas)/(protected)/sas-x-scandic/link/LinkAccountForm.tsx b/apps/scandic-web/app/[lang]/(partner)/(sas)/(protected)/sas-x-scandic/link/LinkAccountForm.tsx index 4a10fdf8c..f712fcd3b 100644 --- a/apps/scandic-web/app/[lang]/(partner)/(sas)/(protected)/sas-x-scandic/link/LinkAccountForm.tsx +++ b/apps/scandic-web/app/[lang]/(partner)/(sas)/(protected)/sas-x-scandic/link/LinkAccountForm.tsx @@ -97,8 +97,8 @@ export function LinkAccountForm({ {intl.formatMessage({ defaultMessage: "Edit your personal details", @@ -140,7 +140,6 @@ export function LinkAccountForm({ {str} diff --git a/apps/scandic-web/app/[lang]/(partner)/(sas)/(protected)/sas-x-scandic/login/page.tsx b/apps/scandic-web/app/[lang]/(partner)/(sas)/(protected)/sas-x-scandic/login/page.tsx index 8ce0db21e..f5973c4e2 100644 --- a/apps/scandic-web/app/[lang]/(partner)/(sas)/(protected)/sas-x-scandic/login/page.tsx +++ b/apps/scandic-web/app/[lang]/(partner)/(sas)/(protected)/sas-x-scandic/login/page.tsx @@ -97,7 +97,6 @@ export default async function SASxScandicLoginPage(props: PageArgs & diff --git a/apps/scandic-web/app/[lang]/(partner)/(sas)/(protected)/sas-x-scandic/otp/OneTimePasswordForm.tsx b/apps/scandic-web/app/[lang]/(partner)/(sas)/(protected)/sas-x-scandic/otp/OneTimePasswordForm.tsx index cbe1353d7..c92ef0f47 100644 --- a/apps/scandic-web/app/[lang]/(partner)/(sas)/(protected)/sas-x-scandic/otp/OneTimePasswordForm.tsx +++ b/apps/scandic-web/app/[lang]/(partner)/(sas)/(protected)/sas-x-scandic/otp/OneTimePasswordForm.tsx @@ -115,7 +115,6 @@ export default function OneTimePasswordForm({ href="#" onClick={handleRequestNewOtp} color="red" - variant="default" size="small" className={disableResend ? styles["disabled-link"] : ""} > diff --git a/apps/scandic-web/components/Blocks/DynamicContent/JobylonFeed/JobylonCard/index.tsx b/apps/scandic-web/components/Blocks/DynamicContent/JobylonFeed/JobylonCard/index.tsx index 5e9a2daf7..d84573432 100644 --- a/apps/scandic-web/components/Blocks/DynamicContent/JobylonFeed/JobylonCard/index.tsx +++ b/apps/scandic-web/components/Blocks/DynamicContent/JobylonFeed/JobylonCard/index.tsx @@ -40,7 +40,7 @@ export default function JobylonCard({ job }: JobylonCardProps) {
-
+
{job.categories.map((cat) => cat.text).join(", ")} {job.locations diff --git a/apps/scandic-web/components/Blocks/DynamicContent/Points/EarnAndBurn/JourneyTable/ClientTable/Row/index.tsx b/apps/scandic-web/components/Blocks/DynamicContent/Points/EarnAndBurn/JourneyTable/ClientTable/Row/index.tsx index 6528c87f3..f97cec20f 100644 --- a/apps/scandic-web/components/Blocks/DynamicContent/Points/EarnAndBurn/JourneyTable/ClientTable/Row/index.tsx +++ b/apps/scandic-web/components/Blocks/DynamicContent/Points/EarnAndBurn/JourneyTable/ClientTable/Row/index.tsx @@ -89,7 +89,7 @@ export default function Row({ transaction }: RowProps) { transaction.type === Transactions.rewardType.rewardNight) ) { return ( - + {transaction.confirmationNumber} ) diff --git a/apps/scandic-web/components/Blocks/DynamicContent/Stays/EmptyUpcomingStays/index.tsx b/apps/scandic-web/components/Blocks/DynamicContent/Stays/EmptyUpcomingStays/index.tsx index c54bb55e6..b9cc8281c 100644 --- a/apps/scandic-web/components/Blocks/DynamicContent/Stays/EmptyUpcomingStays/index.tsx +++ b/apps/scandic-web/components/Blocks/DynamicContent/Stays/EmptyUpcomingStays/index.tsx @@ -39,7 +39,11 @@ export default async function EmptyUpcomingStaysBlock() {
- + {intl.formatMessage({ defaultMessage: "Get inspired", })} diff --git a/apps/scandic-web/components/Blocks/UspGrid/renderOptions.tsx b/apps/scandic-web/components/Blocks/UspGrid/renderOptions.tsx index 83cc60e4b..982008f85 100644 --- a/apps/scandic-web/components/Blocks/UspGrid/renderOptions.tsx +++ b/apps/scandic-web/components/Blocks/UspGrid/renderOptions.tsx @@ -20,12 +20,7 @@ export const renderOptions: RenderOptions = { : node.attrs.href return ( - + {next(node.children, embeds, fullRenderOptions)} ) diff --git a/apps/scandic-web/components/ContentType/DestinationPage/DestinationCityPage/CityMap/HotelListItem/hotelListItem.module.css b/apps/scandic-web/components/ContentType/DestinationPage/DestinationCityPage/CityMap/HotelListItem/hotelListItem.module.css index 9b92c7999..a1338e301 100644 --- a/apps/scandic-web/components/ContentType/DestinationPage/DestinationCityPage/CityMap/HotelListItem/hotelListItem.module.css +++ b/apps/scandic-web/components/ContentType/DestinationPage/DestinationCityPage/CityMap/HotelListItem/hotelListItem.module.css @@ -58,7 +58,7 @@ cursor: pointer; &:hover { - color: var(--Text-Interactive-Hover-Secondary); + color: var(--Text-Interactive-Secondary-Hover); } } diff --git a/apps/scandic-web/components/ContentType/DestinationPage/DestinationOverviewPage/HotelsSection/DestinationsList/Destination/index.tsx b/apps/scandic-web/components/ContentType/DestinationPage/DestinationOverviewPage/HotelsSection/DestinationsList/Destination/index.tsx index 91de22340..a658ff385 100644 --- a/apps/scandic-web/components/ContentType/DestinationPage/DestinationOverviewPage/HotelsSection/DestinationsList/Destination/index.tsx +++ b/apps/scandic-web/components/ContentType/DestinationPage/DestinationOverviewPage/HotelsSection/DestinationsList/Destination/index.tsx @@ -33,7 +33,7 @@ export default async function Destination({
  • {/* eslint-disable-next-line formatjs/no-literal-string-in-jsx */} @@ -44,7 +44,7 @@ export default async function Destination({ )} {countryUrl && ( - + {intl.formatMessage( { defaultMessage: "View all hotels in {country}", diff --git a/apps/scandic-web/components/ContentType/DestinationPage/HotelListing/HotelListingItem/hotelListingItem.module.css b/apps/scandic-web/components/ContentType/DestinationPage/HotelListing/HotelListingItem/hotelListingItem.module.css index d1ae96b35..abfb0ff50 100644 --- a/apps/scandic-web/components/ContentType/DestinationPage/HotelListing/HotelListingItem/hotelListingItem.module.css +++ b/apps/scandic-web/components/ContentType/DestinationPage/HotelListing/HotelListingItem/hotelListingItem.module.css @@ -50,7 +50,7 @@ color: var(--Text-Interactive-Secondary); &:hover { - color: var(--Text-Interactive-Hover-Secondary); + color: var(--Text-Interactive-Secondary-Hover); } } diff --git a/apps/scandic-web/components/ContentType/HotelPage/IntroSection/TripAdvisorLink/index.tsx b/apps/scandic-web/components/ContentType/HotelPage/IntroSection/TripAdvisorLink/index.tsx index dc42589f9..2c9443e09 100644 --- a/apps/scandic-web/components/ContentType/HotelPage/IntroSection/TripAdvisorLink/index.tsx +++ b/apps/scandic-web/components/ContentType/HotelPage/IntroSection/TripAdvisorLink/index.tsx @@ -46,9 +46,8 @@ export default async function TripAdvisorLink({ return ( diff --git a/apps/scandic-web/components/ContentType/HotelPage/SidePeeks/AboutTheHotel/ContactInformation/index.tsx b/apps/scandic-web/components/ContentType/HotelPage/SidePeeks/AboutTheHotel/ContactInformation/index.tsx index aa58baea4..a922da14b 100644 --- a/apps/scandic-web/components/ContentType/HotelPage/SidePeeks/AboutTheHotel/ContactInformation/index.tsx +++ b/apps/scandic-web/components/ContentType/HotelPage/SidePeeks/AboutTheHotel/ContactInformation/index.tsx @@ -55,7 +55,7 @@ export default async function ContactInformation({ {intl.formatMessage({ @@ -72,7 +72,7 @@ export default async function ContactInformation({ {contact.phoneNumber} @@ -113,7 +113,7 @@ export default async function ContactInformation({ {contact.email} diff --git a/apps/scandic-web/components/ContentType/HotelPage/SidePeeks/Activities/index.tsx b/apps/scandic-web/components/ContentType/HotelPage/SidePeeks/Activities/index.tsx index 572857549..af79ae40d 100644 --- a/apps/scandic-web/components/ContentType/HotelPage/SidePeeks/Activities/index.tsx +++ b/apps/scandic-web/components/ContentType/HotelPage/SidePeeks/Activities/index.tsx @@ -25,7 +25,7 @@ export default async function ActivitiesSidePeek({ {preamble}
    diff --git a/apps/scandic-web/components/ContentType/HotelPage/SidePeeks/RestaurantBar/RestaurantBarItem/index.tsx b/apps/scandic-web/components/ContentType/HotelPage/SidePeeks/RestaurantBar/RestaurantBarItem/index.tsx index dd622ff43..adbb504e2 100644 --- a/apps/scandic-web/components/ContentType/HotelPage/SidePeeks/RestaurantBar/RestaurantBarItem/index.tsx +++ b/apps/scandic-web/components/ContentType/HotelPage/SidePeeks/RestaurantBar/RestaurantBarItem/index.tsx @@ -77,8 +77,7 @@ export default async function RestaurantBarItem({ href={url} target="_blank" textDecoration="underline" - variant="icon" - color="baseTextMediumContrast" + color="Text/Interactive/Secondary" > {name} {name} void }) { {link.text} @@ -108,9 +107,8 @@ function SecondaryLinks({ handleOnClick }: { handleOnClick: () => void }) { {link.text} @@ -122,7 +120,6 @@ function SecondaryLinks({ handleOnClick }: { handleOnClick: () => void }) { href={logout[lang]} prefetch={false} size="small" - color="burgundy" variant="myPageMobileDropdown" > {intl.formatMessage({ diff --git a/apps/scandic-web/components/Current/Header/TopMenu/index.tsx b/apps/scandic-web/components/Current/Header/TopMenu/index.tsx index 853cd1eae..2b6a40d31 100644 --- a/apps/scandic-web/components/Current/Header/TopMenu/index.tsx +++ b/apps/scandic-web/components/Current/Header/TopMenu/index.tsx @@ -73,7 +73,6 @@ export default async function TopMenu({ position="hamburger menu" trackingId="loginStartTopMenu" className={`${styles.sessionLink} ${styles.loginLink}`} - variant="default" size="small" > {intl.formatMessage({ @@ -105,7 +104,6 @@ export async function TopMenuSkeleton() { position="hamburger menu" trackingId="loginStartTopMenu" className={`${styles.sessionLink} ${styles.loginLink}`} - variant="default" size="small" > {intl.formatMessage({ diff --git a/apps/scandic-web/components/DeprecatedJsonToHtml/renderOptions.tsx b/apps/scandic-web/components/DeprecatedJsonToHtml/renderOptions.tsx index 148993ded..b39be95c5 100644 --- a/apps/scandic-web/components/DeprecatedJsonToHtml/renderOptions.tsx +++ b/apps/scandic-web/components/DeprecatedJsonToHtml/renderOptions.tsx @@ -73,8 +73,7 @@ export const renderOptions: RenderOptions = { href={node.attrs.url} key={node.uid} target={node.attrs.target ?? "_blank"} - variant="underscored" - color="burgundy" + textDecoration="underline" > {next(node.children, embeds, fullRenderOptions)} @@ -359,8 +358,7 @@ export const renderOptions: RenderOptions = { {...props} href={href} key={node.uid} - variant="underscored" - color="burgundy" + textDecoration="underline" > {next(node.children, embeds, fullRenderOptions)} diff --git a/apps/scandic-web/components/Footer/Navigation/MainNav/index.tsx b/apps/scandic-web/components/Footer/Navigation/MainNav/index.tsx index 7cb8672ab..8b101a4e1 100644 --- a/apps/scandic-web/components/Footer/Navigation/MainNav/index.tsx +++ b/apps/scandic-web/components/Footer/Navigation/MainNav/index.tsx @@ -22,7 +22,6 @@ export default function FooterMainNav({ mainLinks }: FooterMainNavProps) {
  • trackFooterClick(group.title, link.title)} > {link.title} diff --git a/apps/scandic-web/components/Forms/Signup/index.tsx b/apps/scandic-web/components/Forms/Signup/index.tsx index f1b52d317..3211cade1 100644 --- a/apps/scandic-web/components/Forms/Signup/index.tsx +++ b/apps/scandic-web/components/Forms/Signup/index.tsx @@ -210,8 +210,8 @@ export default function SignupForm({ title }: SignUpFormProps) { { termsAndConditionsLink: (str) => ( @@ -220,8 +220,8 @@ export default function SignupForm({ title }: SignUpFormProps) { ), privacyPolicy: (str) => ( diff --git a/apps/scandic-web/components/Header/MainMenu/MyPagesMenuContent/index.tsx b/apps/scandic-web/components/Header/MainMenu/MyPagesMenuContent/index.tsx index 75a2fcb73..fdcfa8750 100644 --- a/apps/scandic-web/components/Header/MainMenu/MyPagesMenuContent/index.tsx +++ b/apps/scandic-web/components/Header/MainMenu/MyPagesMenuContent/index.tsx @@ -101,7 +101,7 @@ function PrimaryLinks({ href={link.href} onClick={toggleOpenStateFn} variant="menu" - weight={"bold"} + weight="bold" className={styles.link} > {link.text} diff --git a/apps/scandic-web/components/Header/MainMenu/NavigationMenu/MegaMenu/index.tsx b/apps/scandic-web/components/Header/MainMenu/NavigationMenu/MegaMenu/index.tsx index d276071e4..184cb42ac 100644 --- a/apps/scandic-web/components/Header/MainMenu/NavigationMenu/MegaMenu/index.tsx +++ b/apps/scandic-web/components/Header/MainMenu/NavigationMenu/MegaMenu/index.tsx @@ -60,8 +60,6 @@ export default function MegaMenu({ {seeAllLink?.link ? ( diff --git a/apps/scandic-web/components/Header/MainMenu/NavigationMenu/NavigationMenuItem/index.tsx b/apps/scandic-web/components/Header/MainMenu/NavigationMenu/NavigationMenuItem/index.tsx index d579da9e9..bac83149b 100644 --- a/apps/scandic-web/components/Header/MainMenu/NavigationMenu/NavigationMenuItem/index.tsx +++ b/apps/scandic-web/components/Header/MainMenu/NavigationMenu/NavigationMenuItem/index.tsx @@ -46,7 +46,7 @@ export default function MenuItem({ item, isMobile }: NavigationMenuItemProps) { <> toggleMegaMenu(megaMenuTitle)} - className={`${styles.navigationMenuItem} ${isMobile ? styles.mobile : styles.desktop}`} + className={`${styles.navigationMenuItem} ${isMobile ? styles.mobile : ""}`} > {title} {isMobile ? ( @@ -81,7 +81,7 @@ export default function MenuItem({ item, isMobile }: NavigationMenuItemProps) { ) : ( {hotel.contactInformation.email} {hotel.contactInformation.websiteUrl} diff --git a/apps/scandic-web/components/HotelReservation/BookingConfirmation/Receipt/Room/index.tsx b/apps/scandic-web/components/HotelReservation/BookingConfirmation/Receipt/Room/index.tsx index 467a3d732..24bb3b91b 100644 --- a/apps/scandic-web/components/HotelReservation/BookingConfirmation/Receipt/Room/index.tsx +++ b/apps/scandic-web/components/HotelReservation/BookingConfirmation/Receipt/Room/index.tsx @@ -96,11 +96,10 @@ export default function ReceiptRoom({ trigger={