scandic/web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merged in feat/SW-3542-update-color-variables-to- (pull request #2970)

Browse Source 
feat(SW-3542): Updated the color variables for MVP

Approved-by: Joakim Jäderberg
This commit is contained in:
Hrishikesh Vaipurkar
2025-10-17 09:22:03 +00:00
parent bf19d3960b
commit c01f440651
17 changed files with 141 additions and 67 deletions
Download Patch File Download Diff File Expand all files Collapse all files

76
apps/partner-sas/globals.css
View File

@@ -38,12 +38,6 @@
--modal-box-shadow: 0px 4px 24px 0px rgba(38, 32, 30, 0.08);
--popup-box-shadow: 0 0 14px 6px rgba(0, 0, 0, 0.1);
--TEMP-sas-default: #000099;
--TEMP-sas-20: #00175c;
--TEMP-sas-40: #0030c2;
--Text-sas-20: #333;
--SAS-90: #e5e5e5;
@supports (interpolate-size: allow-keywords) {
interpolate-size: allow-keywords;
}
@@ -66,6 +60,76 @@ body.overflow-hidden {
overflow: hidden;
}
body.partner-sas {
/* Over-ride variables according to SAS theme / color scheme */
--SAS-Default: #009;
--SAS-20: #00175c;
--SAS-40: #0030c2;
--SAS-50: #003df5;
--SAS-90: #f0faff;
--SAS-Gray-20: #333;
--SAS-Gray-40: #666;
--SAS-Gray-90: #e5e5e5;
--SAS-Gray-100: #f5f5f5;
--Background-Primary: var(--SAS-Gray-100);
--Base-Border-Hover: var(--SAS-Gray-40);
--Base-Border-Subtle: var(--SAS-Gray-90);
--Base-Button-Primary-Fill-Normal: var(--SAS-50);
--Base-Button-Primary-Fill-Hover: var(--SAS-50);
--Base-Button-Tertiary-Fill-Normal: var(--SAS-50);
--Base-Button-Tertiary-Fill-Hover: var(--SAS-50);
--Base-Button-Secondary-On-Fill-Normal: var(--SAS-50);
--Base-Button-Secondary-Fill-Normal: var(--SAS-50);
--Base-Button-Secondary-Border-Normal: var(--SAS-50);
--Base-Surface-Subtle-Normal: var(--SAS-90);
--Base-Surface-Secondary-light-Normal: var(--SAS-Gray-100);
--Base-Text-Accent: var(--SAS-50);
--Base-Text-Medium-contrast: var(--SAS-40);
--Border-Intense: var(--SAS-Gray-40);
--Border-Interactive-Selected: var(--SAS-Gray-40);
--Border-Interactive-Default: var(--SAS-Gray-40);
--Component-Button-Brand-Primary-Fill-Default: var(--SAS-50);
--Component-Button-Brand-Primary-Fill-Hover: var(--SAS-50);
--Component-Button-Brand-Tertiary-Fill-Default: var(--SAS-50);
--Component-Button-Brand-Tertiary-Fill-Hover: var(--SAS-50);
--Component-Button-Inverted-On-fill-Default: var(--SAS-50);
--Component-Button-Inverted-On-fill-Hover: var(--SAS-50);
--Component-Button-Brand-Secondary-On-fill-Default: var(--SAS-40);
--Component-Button-Brand-Secondary-On-fill-Hover: var(--SAS-40);
--Component-Button-Brand-Secondary-On-fill-Hover-inverted: var(
--SAS-Gray-100
);
--Icon-Interactive-Default: var(--SAS-40);
--Primary-Dark-Surface-Normal: var(--SAS-Default);
--Primary-Light-Surface-Normal: var(--SAS-90);
--Surface-Brand-Primary-1-OnSurface-Default: var(--SAS-40);
--Surface-Brand-Primary-2-Default: var(--SAS-Default);
--Surface-Primary-Hover: var(--SAS-Gray-90);
--Surface-Primary-Hover-Accent: var(--SAS-90);
--Surface-Secondary-Default: var(--Base-Surface-Subtle-Normal);
--Surface-UI-Fill-Active-Hover: var(--Neutral-Opacity-White-100);
--Surface-UI-Fill-Active: var(--SAS-20);
--Surface-UI-Fill-Default: var(--Neutral-Opacity-White-100);
--Surface-UI-Fill-Disabled: var(--Neutral-15);
--Scandic-Brand-Warm-White: var(--Background-Primary);
--Text-Accent-Primary: var(--SAS-20);
--Text-Accent-Secondary: var(--SAS-40);
--Text-Heading: var(--SAS-Gray-20);
--Text-Interactive-Default: var(--SAS-40);
--Text-Interactive-Hover: var(--SAS-40);
--Text-Interactive-Secondary: var(--SAS-40);
--Scandic-Brand-Burgundy: var(--Text-Default);
--Scandic-Peach-80: var(--SAS-Gray-40);
--Scandic-Grey-00: var(--SAS-Gray-100);
--Scandic-Grey-10: var(--SAS-Gray-90);
}
/* From Tailwind */
.sr-only {
position: absolute;