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

feat(BOOK-391): Added theme and logos for Bassin Seven

Browse Source 
* chore: Updated border-radius variables after import change

Approved-by: Linus Flood
This commit is contained in:
Erik Tiekstra
2026-01-22 07:03:25 +00:00
parent ef98c4b552
commit 4de24e9f2a
297 changed files with 5252 additions and 648 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/design-system/.storybook/content/colors/bassinSeven.mdx
+11
View File
@@ -0,0 +1,11 @@
import { Meta } from "@storybook/addon-docs/blocks"
import { Colors } from "../Colors"
import { bassinSeven } from "../../../lib/tokens"
<Meta title="Tokens/Colors/Bassin Seven" />
# Colors: Bassin Seven
<Colors theme={bassinSeven} />
packages/design-system/.storybook/preview.tsx
+1
View File
@@ -18,6 +18,7 @@ export const themes = {
"Hotel Norge": "hotel-norge",
Marski: "marski",
"The Dock": "the-dock",
"Bassin Seven": "bassin-seven",
},
defaultTheme: "Scandic",
}
packages/design-system/generate/variables.json
+2832 -149
View File
File diff suppressed because it is too large Load Diff
packages/design-system/lib/components/Accordion/AccordionItem/accordionItem.module.css
+1 -1
View File
@@ -44,7 +44,7 @@
cursor: pointer;
color: var(--Text-Interactive-Default);
transition: background-color 0.3s;
border-radius: var(--Corner-radius-md);
border-radius: var(--Corner-Radius-md);
list-style: none;
&::-webkit-details-marker {
packages/design-system/lib/components/Accordion/accordion.module.css
+1 -1
View File
@@ -2,7 +2,7 @@
list-style: none;
&.card {
border-radius: var(--Corner-radius-md);
border-radius: var(--Corner-Radius-md);
li:last-child {
border-width: 0;
packages/design-system/lib/components/Alert/alert.module.css
+1 -1
View File
@@ -40,7 +40,7 @@
/* Intent: inline */
.inline {
border-radius: var(--Corner-radius-lg);
border-radius: var(--Corner-Radius-lg);
border: 1px solid var(--Base-Border-Subtle);
background-color: var(--Base-Surface-Primary-light-Normal);
}
packages/design-system/lib/components/Avatar/avatar.module.css
+1 -1
View File
@@ -3,7 +3,7 @@
justify-content: center;
align-items: center;
overflow: hidden;
border-radius: var(--Corner-radius-rounded);
border-radius: var(--Corner-Radius-Rounded);
background-color: var(--Overlay-40);
}
packages/design-system/lib/components/BackToTopButton/backToTopButton.module.css
+1 -1
View File
@@ -1,5 +1,5 @@
.backToTopButton {
border-radius: var(--Corner-radius-rounded);
border-radius: var(--Corner-Radius-Rounded);
cursor: pointer;
display: inline-flex;
align-items: center;
packages/design-system/lib/components/Badge/badge.module.css
+1 -1
View File
@@ -1,5 +1,5 @@
.badge {
border-radius: var(--Corner-radius-xl);
border-radius: var(--Corner-Radius-xl);
display: flex;
align-items: center;
justify-content: center;
packages/design-system/lib/components/Breadcrumbs/breadcrumbs.module.css
+3 -3
View File
@@ -67,7 +67,7 @@
display: flex;
flex-direction: column;
gap: var(--Space-x05);
border-radius: var(--Corner-radius-md);
border-radius: var(--Corner-Radius-md);
min-width: 169px;
outline: none;
box-shadow: 0 0 4px 2px rgb(0 0 0 / 10%);
@@ -75,7 +75,7 @@
.dialogLink {
display: block;
border-radius: var(--Corner-radius-md);
border-radius: var(--Corner-Radius-md);
padding: var(--Space-x1);
color: var(--Text-Default);
@@ -95,7 +95,7 @@
.tooltip {
background-color: var(--Surface-UI-Fill-Intense);
padding: var(--Space-x05) var(--Space-x1);
border-radius: var(--Corner-radius-sm);
border-radius: var(--Corner-Radius-sm);
color: var(--Text-Inverted);
outline: none;
}
packages/design-system/lib/components/Button/button.module.css
+1 -1
View File
@@ -1,6 +1,6 @@
.button {
position: relative;
border-radius: var(--Corner-radius-rounded);
border-radius: var(--Corner-Radius-Rounded);
border-width: 2px;
border-style: solid;
cursor: pointer;
packages/design-system/lib/components/Card/card.module.css
+2 -2
View File
@@ -10,13 +10,13 @@
.Default {
border: solid 1px var(--Border-Default);
background-color: var(--Surface-Secondary-Default);
border-radius: var(--Corner-radius-md);
border-radius: var(--Corner-Radius-md);
color: var(--Text-Default);
}
.Featured {
border: solid 1px var(--Border-Default);
background-color: var(--Surface-Primary-Default);
border-radius: var(--Corner-radius-md);
border-radius: var(--Corner-Radius-md);
color: var(--Text-Default);
}
packages/design-system/lib/components/ChipButton/chip-button.module.css
+2 -2
View File
@@ -1,6 +1,6 @@
.chip {
background-color: var(--Component-Button-Inverted-Fill-Default);
border-radius: var(--Corner-radius-sm);
border-radius: var(--Corner-Radius-sm);
padding: 6px var(--Space-x15);
color: var(--Text-Interactive-Default);
display: inline-flex;
@@ -43,7 +43,7 @@
.FilterRounded {
background-color: transparent;
border: 1px solid var(--Border-Interactive-Active);
border-radius: var(--Corner-radius-rounded);
border-radius: var(--Corner-Radius-Rounded);
padding: var(--Space-x025) var(--Space-x2);
color: var(--Text-Default);
}
packages/design-system/lib/components/ChipLink/chip-link.module.css
+1 -1
View File
@@ -1,7 +1,7 @@
.chip {
background-color: var(--Component-Button-Inverted-Fill-Default);
border: 1px solid var(--Component-Button-Inverted-Border-Default);
border-radius: var(--Corner-radius-sm);
border-radius: var(--Corner-Radius-sm);
padding: var(--Space-x1) var(--Space-x15);
color: var(--Text-Interactive-Default);
display: inline-flex;
packages/design-system/lib/components/ChipStatic/chip-static.module.css
+1 -1
View File
@@ -1,5 +1,5 @@
.chip {
border-radius: var(--Corner-radius-sm);
border-radius: var(--Corner-Radius-sm);
padding: 0 var(--Space-x1);
display: inline-flex;
align-items: center;
packages/design-system/lib/components/ContentCard/contentCard.module.css
+3 -3
View File
@@ -4,7 +4,7 @@
&:hover {
.imageContainer,
.image {
border-radius: var(--Corner-radius-lg);
border-radius: var(--Corner-Radius-lg);
}
.image {
transform: scale(1.05);
@@ -16,13 +16,13 @@
position: relative;
width: 100%;
height: 250px;
border-radius: var(--Corner-radius-md);
border-radius: var(--Corner-Radius-md);
overflow: hidden;
transition: border-radius 0.3s ease-in-out;
}
.image {
border-radius: var(--Corner-radius-md);
border-radius: var(--Corner-Radius-md);
width: 100%;
height: 100%;
object-fit: cover;
packages/design-system/lib/components/DeprecatedSelect/select.module.css
+4 -4
View File
@@ -4,7 +4,7 @@
.select {
border: 1px solid var(--Base-Border-Normal);
border-radius: var(--Corner-radius-md);
border-radius: var(--Corner-Radius-md);
display: flex;
flex-direction: column;
gap: var(--Space-x05);
@@ -49,7 +49,7 @@
align-items: center;
background-color: var(--UI-Opacity-White-100);
border: none;
border-radius: var(--Corner-radius-md);
border-radius: var(--Corner-Radius-md);
color: var(--UI-Text-High-contrast);
display: flex;
gap: var(--Space-x05);
@@ -77,7 +77,7 @@
.popover {
background-color: var(--Main-Grey-White);
border-radius: var(--Corner-radius-md);
border-radius: var(--Corner-Radius-md);
box-shadow: 0px 4px 24px 0px rgba(0, 0, 0, 0.08);
display: inline-flex;
flex-direction: column;
@@ -100,7 +100,7 @@
.listBoxItem[data-focused="true"],
.listBoxItem[data-selected="true"] {
background: var(--UI-Input-Controls-Surface-Hover);
border-radius: var(--Corner-radius-md);
border-radius: var(--Corner-Radius-md);
outline: none;
}
packages/design-system/lib/components/Form/Country/country.module.css
+4 -4
View File
@@ -1,7 +1,7 @@
.select {
background-color: var(--Surface-UI-Fill-Default);
border: 1px solid var(--Border-Interactive-Default);
border-radius: var(--Corner-radius-md);
border-radius: var(--Corner-Radius-md);
position: relative;
height: 56px;
@@ -59,7 +59,7 @@
.inner {
align-items: center;
box-sizing: border-box;
border-radius: var(--Corner-radius-md);
border-radius: var(--Corner-Radius-md);
display: flex;
gap: var(--Space-x1);
padding: var(--Space-x15);
@@ -129,7 +129,7 @@
.popover {
background-color: var(--Surface-Primary-Default);
border-radius: var(--Corner-radius-md);
border-radius: var(--Corner-Radius-md);
box-shadow: 0 0 14px 6px rgb(0 0 0 / 10%);
display: inline-flex;
flex-direction: column;
@@ -151,7 +151,7 @@
.listBoxItem {
align-items: center;
border-radius: var(--Corner-radius-md);
border-radius: var(--Corner-Radius-md);
color: var(--Text-Default);
display: flex;
gap: var(--Space-x1);
packages/design-system/lib/components/Form/PaymentOption/paymentOption.module.css
+1 -1
View File
@@ -3,7 +3,7 @@
background-color: var(--UI-Input-Controls-Surface-Normal);
padding: var(--Space-x15) var(--Space-x2);
border: 1px solid var(--Base-Border-Normal);
border-radius: var(--Corner-radius-md);
border-radius: var(--Corner-Radius-md);
display: flex;
align-items: center;
justify-content: space-between;
packages/design-system/lib/components/Form/Phone/phone.module.css
+3 -3
View File
@@ -39,7 +39,7 @@
.phone :global(.react-international-phone-country-selector-dropdown) {
background: var(--Main-Grey-White);
border-radius: var(--Corner-radius-md);
border-radius: var(--Corner-Radius-md);
box-shadow: 0px 4px 24px 0px rgba(0, 0, 0, 0.08);
gap: var(--Space-x1);
outline: none;
@@ -48,7 +48,7 @@
.phone
:global(.react-international-phone-country-selector-dropdown__list-item) {
border-radius: var(--Corner-radius-md);
border-radius: var(--Corner-Radius-md);
padding: var(--Space-x1) var(--Space-x1) var(--Space-x1) var(--Space-x15);
font-family: var(--Body-Paragraph-Font-family);
}
@@ -64,7 +64,7 @@
border-color: var(--Border-Interactive-Default);
border-style: solid;
border-width: 1px;
border-radius: var(--Corner-radius-md);
border-radius: var(--Corner-Radius-md);
display: grid;
gap: var(--Space-x05);
grid-template-rows: auto auto;
packages/design-system/lib/components/Form/RadioButtonsGroup/radioButtonsGroup.module.css
+1 -1
View File
@@ -9,7 +9,7 @@
background: var(--Surface-Primary-Default);
padding: var(--Space-x15) var(--Space-x2);
outline: 1px solid var(--Border-Interactive-Default);
border-radius: var(--Corner-radius-md);
border-radius: var(--Corner-Radius-md);
display: flex;
align-items: center;
justify-content: space-between;
packages/design-system/lib/components/Form/RadioCard/radioCard.module.css
+2 -2
View File
@@ -7,7 +7,7 @@
grid-template-areas:
"icon subtitleSecondary"
"title subtitle";
border-radius: var(--Corner-radius-md);
border-radius: var(--Corner-Radius-md);
border: 1px solid var(--Border-Strong);
background: var(--Surface-Primary-Default);
padding: var(--Space-x2) var(--Space-x3);
@@ -46,7 +46,7 @@
width: 32px;
height: 32px;
border: 2px solid var(--Base-Border-Inverted);
border-radius: var(--Corner-radius-rounded);
border-radius: var(--Corner-Radius-Rounded);
background-color: var(--Surface-Feedback-Succes);
}
packages/design-system/lib/components/HotelCard/HotelCardDialogImage/hotelCardDialogImage.module.css
+2 -2
View File
@@ -18,7 +18,7 @@
.imageContainer {
position: relative;
min-width: 177px;
border-radius: var(--Corner-radius-md) 0 0 var(--Corner-radius-md);
border-radius: var(--Corner-Radius-md) 0 0 var(--Corner-Radius-md);
overflow: hidden;
}
@@ -26,7 +26,7 @@
width: 80px;
min-width: 80px;
height: 90px;
border-radius: var(--Corner-radius-md);
border-radius: var(--Corner-Radius-md);
}
.imageContainer img {
packages/design-system/lib/components/HotelCard/HotelCardSkeleton.module.css
+1 -1
View File
@@ -3,7 +3,7 @@
display: flex;
flex-direction: column;
background-color: #fff;
border-radius: var(--Corner-radius-lg);
border-radius: var(--Corner-Radius-lg);
border: 1px solid var(--Base-Border-Subtle);
position: relative;
height: 100%;
packages/design-system/lib/components/HotelCard/HotelChequeCard/hotelChequeCard.module.css
+1 -1
View File
@@ -1,7 +1,7 @@
.chequeCard {
padding: var(--Space-x15);
background-color: var(--Base-Surface-Secondary-light-Normal);
border-radius: var(--Corner-radius-md);
border-radius: var(--Corner-Radius-md);
margin: 0;
width: 100%;
display: grid;
packages/design-system/lib/components/HotelCard/HotelDialogCard/StandaloneHotelCardDialog/standaloneHotelCardDialog.module.css
+2 -2
View File
@@ -41,7 +41,7 @@
}
.priceCard {
border-radius: var(--Corner-radius-md);
border-radius: var(--Corner-Radius-md);
padding: var(--Space-x05) var(--Space-x1);
background: var(--Base-Surface-Secondary-light-Normal);
}
@@ -55,7 +55,7 @@
}
.notEnoughPointsButton {
border-radius: var(--Corner-radius-rounded);
border-radius: var(--Corner-Radius-Rounded);
border-width: 2px;
border-style: solid;
display: flex;
packages/design-system/lib/components/HotelCard/HotelPriceCard/hotelPriceCard.module.css
+1 -1
View File
@@ -1,7 +1,7 @@
.priceCard {
padding: var(--Space-x15);
background-color: var(--Base-Surface-Secondary-light-Normal);
border-radius: var(--Corner-radius-md);
border-radius: var(--Corner-Radius-md);
margin: 0;
width: 100%;
}
packages/design-system/lib/components/HotelCard/HotelVoucherCard/hotelVoucherCard.module.css
+1 -1
View File
@@ -1,7 +1,7 @@
.voucherCard {
padding: var(--Space-x15);
background-color: var(--Base-Surface-Secondary-light-Normal);
border-radius: var(--Corner-radius-md);
border-radius: var(--Corner-Radius-md);
margin: 0;
width: 100%;
}
packages/design-system/lib/components/HotelCard/NoPriceAvailableCard/noPriceAvailable.module.css
+1 -1
View File
@@ -1,7 +1,7 @@
.priceCard {
padding: var(--Space-x15);
background-color: var(--Base-Surface-Secondary-light-Normal);
border-radius: var(--Corner-radius-md);
border-radius: var(--Corner-Radius-md);
margin: 0;
width: 100%;
}
packages/design-system/lib/components/HotelCard/hotelCard.module.css
+2 -2
View File
@@ -3,7 +3,7 @@
flex-direction: column;
background-color: var(--Base-Surface-Primary-light-Normal);
border: 1px solid var(--Base-Border-Subtle);
border-radius: var(--Corner-radius-md);
border-radius: var(--Corner-Radius-md);
width: 100%;
overflow: hidden;
color: var(--Text-Default);
@@ -104,7 +104,7 @@
.pointsCard {
background-color: var(--Base-Surface-Secondary-light-Normal);
padding: var(--Space-x15);
border-radius: var(--Corner-radius-md);
border-radius: var(--Corner-Radius-md);
}
@media screen and (min-width: 768px) and (max-width: 1024px) {
packages/design-system/lib/components/HotelInfoCard/hotelInfoCard.module.css
+1 -1
View File
@@ -25,7 +25,7 @@
position: relative;
height: 200px;
width: 100%;
border-radius: var(--Corner-radius-md);
border-radius: var(--Corner-Radius-md);
}
.hotelContent {
packages/design-system/lib/components/IconButton/iconButton.module.css
+1 -1
View File
@@ -8,7 +8,7 @@
border-width: 0;
background-color: transparent;
cursor: pointer;
border-radius: var(--Corner-radius-rounded);
border-radius: var(--Corner-Radius-Rounded);
&[data-disabled] {
cursor: unset;
packages/design-system/lib/components/IconChip/iconChip.module.css
+1 -1
View File
@@ -3,7 +3,7 @@
align-items: center;
gap: var(--Space-x1);
padding: var(--Space-x1) var(--Space-x15);
border-radius: var(--Corner-radius-sm);
border-radius: var(--Corner-Radius-sm);
}
.blue {
packages/design-system/lib/components/Icons/Logos/BassinSeven.tsx
+28
View File
File diff suppressed because one or more lines are too long
packages/design-system/lib/components/Icons/Logos/index.tsx
+4 -9
View File
@@ -1,3 +1,5 @@
import { SignatureHotelEnum } from "@scandic-hotels/common/constants/signatureHotels"
import BassinSevenIcon from "./BassinSeven"
import DowntownCamperIcon from "./DowntownCamper"
import GrandHotelOsloLogoIcon from "./GrandHotelOslo"
import HaymarketIcon from "./Haymarket"
@@ -19,15 +21,6 @@ enum HotelTypeEnum {
Regular = "regular",
}
enum SignatureHotelEnum {
DowntownCamper = "879",
GrandHotelOslo = "340",
Haymarket = "890",
HotelNorge = "785",
Marski = "605",
TheDock = "796",
}
export default function HotelLogoIcon({
hotelId,
hotelType,
@@ -50,6 +43,8 @@ export default function HotelLogoIcon({
return <MarskiLogoIcon height={height} />
case SignatureHotelEnum.TheDock:
return <TheDockIcon height={height} />
case SignatureHotelEnum.BassinSeven:
return <BassinSevenIcon height={height} />
default:
return <ScandicLogoIcon height={height} />
}
packages/design-system/lib/components/ImageContainer/imageContainer.module.css
+1 -1
View File
@@ -10,7 +10,7 @@
width: 100%;
height: 365px;
object-fit: cover;
border-radius: var(--Corner-radius-md);
border-radius: var(--Corner-Radius-md);
}
@media screen and (min-width: 768px) {
packages/design-system/lib/components/ImageCounter/imageCounter.module.css
+1 -1
View File
@@ -1,6 +1,6 @@
.imageCounter {
background-color: var(--Overlay-90);
border-radius: var(--Corner-radius-sm);
border-radius: var(--Corner-Radius-sm);
color: var(--Text-Inverted);
justify-content: center;
display: inline-flex;
packages/design-system/lib/components/InfoBox/InfoBox.module.css
+1 -1
View File
@@ -4,7 +4,7 @@
gap: 1rem;
padding: var(--Space-x2) var(--Space-x3);
border-radius: var(--Corner-radius-Medium);
border-radius: var(--Corner-Radius-Medium);
align-items: center;
background: var(--Background-Secondary);
packages/design-system/lib/components/InfoCard/InfoCard.stories.tsx
+7
View File
@@ -259,3 +259,10 @@ export const AllThemesTheDock: Story = {
hotelTheme: Theme.theDock,
},
}
export const AllThemesBassinSeven: Story = {
args: {
...meta.args,
hotelTheme: Theme.bassinSeven,
},
}
packages/design-system/lib/components/InfoCard/infoCard.module.css
+1 -1
View File
@@ -7,7 +7,7 @@
display: grid;
justify-content: center;
align-items: center;
border-radius: var(--Corner-radius-md);
border-radius: var(--Corner-Radius-md);
text-align: center;
width: 100%;
text-wrap: balance;
packages/design-system/lib/components/InfoCard/utils.ts
+17
View File
@@ -158,6 +158,23 @@ export function getButtonProps(
}
}
break
case Theme.bassinSeven:
if (
cardTheme === "Primary 3" ||
cardTheme === "Accent" ||
cardTheme === "White"
) {
buttonProps = {
primaryButton: PRIMARY,
secondaryButton: SECONDARY,
}
} else if (cardTheme === "Primary 1" || cardTheme === "Primary 2") {
buttonProps = {
primaryButton: PRIMARY_INVERTED,
secondaryButton: SECONDARY_INVERTED,
}
}
break
default:
break
}
packages/design-system/lib/components/InfoCard/variants.ts
+1
View File
@@ -50,6 +50,7 @@ export const infoCardConfig = {
[Theme.hotelNorge]: undefined,
[Theme.marski]: undefined,
[Theme.theDock]: undefined,
[Theme.bassinSeven]: undefined,
},
},
compoundVariants: [
packages/design-system/lib/components/Input/input.module.css
+1 -1
View File
@@ -12,7 +12,7 @@
align-content: center;
background-color: var(--Surface-Primary-Default);
border: 1px solid var(--Border-Interactive-Default);
border-radius: var(--Corner-radius-md);
border-radius: var(--Corner-Radius-md);
display: grid;
min-width: 0; /* allow shrinkage */
height: 56px;
packages/design-system/lib/components/JsonToHtml/jsontohtml.module.css
+1 -1
View File
@@ -48,7 +48,7 @@
position: relative;
width: 100%;
height: 365px;
border-radius: var(--Corner-radius-md);
border-radius: var(--Corner-Radius-md);
margin: var(--Space-x3) 0;
overflow: hidden;
}
packages/design-system/lib/components/Lightbox/FullView/fullView.module.css
+1 -1
View File
@@ -54,7 +54,7 @@
.image {
object-fit: contain;
border-radius: var(--Corner-radius-Medium);
border-radius: var(--Corner-Radius-Medium);
/* Override Next.js Image styles, we can't set width/height on the image as we don't know the aspect ratio of the image */
width: auto !important;
height: auto !important;
packages/design-system/lib/components/Lightbox/Gallery/gallery.module.css
+4 -4
View File
@@ -41,7 +41,7 @@
cursor: pointer;
overflow: hidden;
z-index: 0;
border-radius: var(--Corner-radius-sm);
border-radius: var(--Corner-Radius-sm);
&:focus-visible {
outline: 2px solid var(--Border-Interactive-Focus);
@@ -120,7 +120,7 @@
.caption {
background-color: var(--Base-Surface-Subtle-Normal);
padding: var(--Space-x05) var(--Space-x1);
border-radius: var(--Corner-radius-sm);
border-radius: var(--Corner-Radius-sm);
color: var(--Text-Secondary);
}
@@ -140,7 +140,7 @@
.mainImage {
object-fit: contain;
border-radius: var(--Corner-radius-sm);
border-radius: var(--Corner-Radius-sm);
/* Override Next.js Image styles, we can't set width/height on the image as we don't know the aspect ratio of the image */
width: auto !important;
height: auto !important;
@@ -167,7 +167,7 @@
}
.thumbnailContainer img {
border-radius: var(--Corner-radius-sm);
border-radius: var(--Corner-Radius-sm);
}
.navigationButton {
packages/design-system/lib/components/Lightbox/lightbox.module.css
+1 -1
View File
@@ -31,7 +31,7 @@
overflow: hidden;
&:not(.fullViewContent) {
border-radius: var(--Corner-radius-lg);
border-radius: var(--Corner-Radius-lg);
}
&.fullViewContent {
packages/design-system/lib/components/LinkList/LinkListItem/linkListItem.module.css
+3 -3
View File
@@ -12,11 +12,11 @@
}
.linkListItem:first-child {
border-radius: var(--Corner-radius-md) var(--Corner-radius-md) 0 0;
border-radius: var(--Corner-Radius-md) var(--Corner-Radius-md) 0 0;
}
.linkListItem:last-child {
border-radius: 0 0 var(--Corner-radius-md) var(--Corner-radius-md);
border-radius: 0 0 var(--Corner-Radius-md) var(--Corner-Radius-md);
}
.linkListItem:hover {
@@ -42,7 +42,7 @@
.illustrationWrapper {
position: relative;
border-radius: var(--Corner-radius-sm);
border-radius: var(--Corner-Radius-sm);
background-color: var(--Surface-Primary-Hover-Accent);
width: 80px;
height: 80px;
packages/design-system/lib/components/Map/InfoWindow/infoWindow.module.css
+1 -1
View File
@@ -7,7 +7,7 @@
.content {
background-color: var(--Base-Surface-Primary-light-Normal);
border-radius: var(--Corner-radius-md);
border-radius: var(--Corner-Radius-md);
box-shadow: 0px 0px 8px 3px rgba(0, 0, 0, 0.1);
position: relative;
overflow: hidden;
packages/design-system/lib/components/Map/InteractiveMap/HotelListingMapContent/HotelPin/hotelPin.module.css
+1 -1
View File
@@ -4,7 +4,7 @@
align-items: center;
padding: var(--Space-x05) var(--Space-x1) var(--Space-x05) var(--Space-x05);
border: 2px solid var(--Base-Surface-Primary-light-Normal);
border-radius: var(--Corner-radius-rounded);
border-radius: var(--Corner-Radius-Rounded);
background-color: var(--Base-Surface-Primary-light-Normal);
box-shadow: 0 0 4px 2px rgba(0, 0, 0, 0.1);
gap: var(--Space-x1);
packages/design-system/lib/components/Map/InteractiveMap/PoiMapMarkers/poiMapMarkers.module.css
+1 -1
View File
@@ -20,7 +20,7 @@
justify-content: center;
align-items: center;
padding: var(--Space-x05);
border-radius: var(--Corner-radius-rounded);
border-radius: var(--Corner-Radius-Rounded);
background-color: var(--Surface-UI-Fill-Default);
box-shadow: 0 0 4px 2px rgba(0, 0, 0, 0.1);
gap: var(--Space-x1);
packages/design-system/lib/components/Map/Markers/HotelMarker/SignatureHotel/BassinSeven.tsx
+119
View File
File diff suppressed because one or more lines are too long
packages/design-system/lib/components/Map/Markers/HotelMarker/SignatureHotel/BassinSevenSmall.tsx
+74
View File
File diff suppressed because one or more lines are too long
packages/design-system/lib/components/Map/Markers/HotelMarkerByType.tsx
+6
View File
@@ -22,6 +22,8 @@ import {
type HotelType,
} from "@scandic-hotels/common/constants/hotelType"
import { MarkerInfo } from "../types"
import { BassinSevenMarker } from "./HotelMarker/SignatureHotel/BassinSeven"
import { BassinSevenSmallMarker } from "./HotelMarker/SignatureHotel/BassinSevenSmall"
export interface HotelMarkerByTypeProps
extends MarkerInfo, React.SVGAttributes<HTMLOrSVGElement> {
@@ -97,4 +99,8 @@ const bySignatureHotel: Record<
large: TheDockMarker,
small: TheDockSmallMarker,
},
[SignatureHotelEnum.BassinSeven]: {
large: BassinSevenMarker,
small: BassinSevenSmallMarker,
},
}
packages/design-system/lib/components/Map/Markers/PoiMarker/poiMarker.module.css
+1 -1
View File
@@ -2,7 +2,7 @@
display: flex;
justify-content: center;
align-items: center;
border-radius: var(--Corner-radius-rounded);
border-radius: var(--Corner-Radius-Rounded);
background-color: var(--Surface-Feedback-Neutral);
> span {
packages/design-system/lib/components/MessageBanner/messageBanner.module.css
+1 -1
View File
@@ -2,7 +2,7 @@
display: flex;
padding: var(--Space-x15);
background-color: var(--Surface-Primary-Default);
border-radius: var(--Corner-radius-md);
border-radius: var(--Corner-Radius-md);
border: 1px solid var(--Border-Default);
}
packages/design-system/lib/components/Modal/modal.module.css
+2 -2
View File
@@ -10,7 +10,7 @@
.modal {
background-color: var(--Base-Surface-Primary-light-Normal);
border-radius: var(--Corner-radius-md) var(--Corner-radius-md) 0 0;
border-radius: var(--Corner-Radius-md) var(--Corner-Radius-md) 0 0;
box-shadow: var(--modal-box-shadow);
width: 100%;
position: absolute;
@@ -73,7 +73,7 @@
left: auto;
bottom: auto;
width: auto;
border-radius: var(--Corner-radius-md);
border-radius: var(--Corner-Radius-md);
max-width: var(--max-width-page);
}
packages/design-system/lib/components/OldDSLink/link.module.css
+3 -3
View File
@@ -75,13 +75,13 @@
line-height: var(--typography-Body-Regular-lineHeight);
letter-spacing: var(--typography-Body-Regular-letterSpacing);
padding: var(--Space-x1);
border-radius: var(--Corner-radius-md);
border-radius: var(--Corner-Radius-md);
gap: var(--Space-x1);
justify-content: space-between;
&:hover {
background-color: var(--Base-Surface-Primary-light-Hover-alt);
border-radius: var(--Corner-radius-md);
border-radius: var(--Corner-Radius-md);
}
}
@@ -158,7 +158,7 @@
width: 100%;
padding: var(--Space-x1);
gap: var(--Space-x15);
border-radius: var(--Corner-radius-md);
border-radius: var(--Corner-Radius-md);
color: var(--Text-Interactive-Default);
&:hover {
packages/design-system/lib/components/OpeningHours/openingHours.module.css
+1 -1
View File
@@ -2,7 +2,7 @@
display: grid;
padding: var(--Space-x2) var(--Space-x3);
gap: var(--Space-x1);
border-radius: var(--Corner-radius-md);
border-radius: var(--Corner-Radius-md);
background: var(--Surface-Secondary-Default);
}
packages/design-system/lib/components/ParkingInformation/parkingInformation.module.css
+1 -1
View File
@@ -11,7 +11,7 @@
.priceWrapper {
background-color: var(--Surface-Secondary-Default);
border-radius: var(--Corner-radius-md);
border-radius: var(--Corner-Radius-md);
padding: var(--Space-x2) var(--Space-x3);
display: grid;
gap: var(--Space-x1);
packages/design-system/lib/components/Progress/progress.module.css
+2 -2
View File
@@ -4,7 +4,7 @@
.track {
height: var(--Space-x2);
border-radius: var(--Corner-radius-md);
border-radius: var(--Corner-Radius-md);
padding: var(--Space-x05);
background: var(--Surface-Secondary-Default);
position: relative;
@@ -14,6 +14,6 @@
.fill {
height: 100%;
background: var(--Surface-Brand-Primary-1-OnSurface-Accent);
border-radius: var(--Corner-radius-md);
border-radius: var(--Corner-Radius-md);
transition: width 0.3s ease;
}
packages/design-system/lib/components/RateCard/Modal/modal.module.css
+2 -2
View File
@@ -10,7 +10,7 @@
.modal {
background-color: var(--Neutral-0);
border-radius: var(--Corner-radius-md) var(--Corner-radius-md) 0 0;
border-radius: var(--Corner-Radius-md) var(--Corner-Radius-md) 0 0;
box-shadow: 0px 4px 24px 0px rgba(38, 32, 30, 0.08);
width: 100%;
position: absolute;
@@ -64,7 +64,7 @@
left: auto;
bottom: auto;
width: auto;
border-radius: var(--Corner-radius-md);
border-radius: var(--Corner-Radius-md);
max-width: var(--max-width-page);
}
packages/design-system/lib/components/RateCard/rate-card.module.css
+6 -6
View File
@@ -11,7 +11,7 @@
align-items: center;
justify-content: center;
border: 2px solid var(--Border-Inverted);
border-radius: var(--Corner-radius-rounded);
border-radius: var(--Corner-Radius-Rounded);
background-color: var(--Surface-Feedback-Succes);
color: var(--Icon-Inverted);
}
@@ -20,7 +20,7 @@
position: relative;
background-color: var(--Scandic-Grey-00);
border: 1px solid transparent;
border-radius: var(--Corner-radius-md);
border-radius: var(--Corner-Radius-md);
padding: 0;
}
@@ -31,7 +31,7 @@
border: none;
padding: 0;
margin: 0;
border-radius: var(--Corner-radius-md);
border-radius: var(--Corner-Radius-md);
z-index: 1;
cursor: pointer;
@@ -49,8 +49,8 @@
.banner {
background-color: var(--Surface-Brand-Primary-1-OnSurface-Accent);
border-top-left-radius: var(--Corner-radius-md);
border-top-right-radius: var(--Corner-radius-md);
border-top-left-radius: var(--Corner-Radius-md);
border-top-right-radius: var(--Corner-Radius-md);
text-align: center;
color: var(--Text-Inverted);
padding: var(--Space-x05) var(--Space-x1);
@@ -184,6 +184,6 @@
.noPricesAvailableText {
padding: var(--Space-x15) var(--Space-x3);
border-radius: var(--Corner-radius-rounded);
border-radius: var(--Corner-Radius-Rounded);
background-color: var(--Scandic-Beige-10);
}
packages/design-system/lib/components/Select/select.module.css
+4 -4
View File
@@ -2,7 +2,7 @@
position: relative;
background-color: var(--Surface-UI-Fill-Default);
border: 1px solid var(--Border-Interactive-Default);
border-radius: var(--Corner-radius-md);
border-radius: var(--Corner-Radius-md);
height: 56px;
box-sizing: border-box;
@@ -64,7 +64,7 @@
width: 100%;
height: 100%;
box-sizing: border-box;
border-radius: var(--Corner-radius-md);
border-radius: var(--Corner-Radius-md);
&.button {
padding: 0 var(--Space-x15);
@@ -135,7 +135,7 @@
.popover {
background-color: var(--Surface-Primary-Default);
border-radius: var(--Corner-radius-md);
border-radius: var(--Corner-Radius-md);
box-shadow: 0 0 14px 6px rgb(0 0 0 / 10%);
display: inline-flex;
flex-direction: column;
@@ -158,7 +158,7 @@
.listBoxItem {
padding: var(--Space-x1) var(--Space-x1) var(--Space-x1) var(--Space-x15);
color: var(--Text-Default);
border-radius: var(--Corner-radius-md);
border-radius: var(--Corner-Radius-md);
display: flex;
align-items: center;
gap: var(--Space-x1);
packages/design-system/lib/components/Table/table.module.css
+3 -3
View File
@@ -31,13 +31,13 @@
}
.smallRadius {
border-radius: var(--Corner-radius-sm);
border-radius: var(--Corner-Radius-sm);
}
.mediumRadius {
border-radius: var(--Corner-radius-md);
border-radius: var(--Corner-Radius-md);
}
.largeRadius {
border-radius: var(--Corner-radius-lg);
border-radius: var(--Corner-Radius-lg);
}
.content .thead {
packages/design-system/lib/components/TeaserCard/teaserCard.module.css
+1 -1
View File
@@ -1,5 +1,5 @@
.teaserCard {
border-radius: var(--Corner-radius-md);
border-radius: var(--Corner-Radius-md);
display: flex;
flex-direction: column;
overflow: hidden;
packages/design-system/lib/components/TextArea/textarea.module.css
+1 -1
View File
@@ -11,7 +11,7 @@
.container {
background-color: var(--Surface-Primary-Default);
border: 1px solid var(--Border-Interactive-Default);
border-radius: var(--Corner-radius-md);
border-radius: var(--Corner-Radius-md);
display: block;
min-width: 0;
height: 138px;
packages/design-system/lib/components/Toasts/toasts.module.css
+1 -1
View File
@@ -1,7 +1,7 @@
.toast {
display: grid;
grid-template-columns: auto 1fr auto;
border-radius: var(--Corner-radius-lg);
border-radius: var(--Corner-Radius-lg);
overflow: hidden;
background: var(--Base-Surface-Primary-light-Normal);
box-shadow: 0px 0px 8px 2px rgba(0, 0, 0, 0.08);
packages/design-system/lib/components/Tooltip/tooltip.module.css
+1 -1
View File
@@ -7,7 +7,7 @@
padding: var(--Space-x1);
background-color: var(--Surface-UI-Fill-Intense);
border: 0.5px solid var(--Border-Interactive-Focus);
border-radius: var(--Corner-radius-md);
border-radius: var(--Corner-Radius-md);
color: var(--Text-Inverted);
position: absolute;
visibility: hidden;
packages/design-system/lib/components/TripAdvisorChip/tripAdvisorChip.module.css
+1 -1
View File
@@ -19,7 +19,7 @@
background-color: var(--Base-Surface-Primary-light-Normal);
color: var(--Text-Interactive-Default);
padding: var(--Space-x05) var(--Space-x1);
border-radius: var(--Corner-radius-sm);
border-radius: var(--Corner-Radius-sm);
}
.tripAdvisorSmall {
packages/design-system/lib/components/VideoPlayer/Button/videoPlayerButton.module.css
+3 -3
View File
@@ -1,5 +1,5 @@
.videoPlayerButton {
border-radius: var(--Corner-radius-Rounded);
border-radius: var(--Corner-Radius-Rounded);
box-shadow: 0 0 4px 2px rgba(0, 0, 0, 0.1);
height: 56px;
width: 56px;
@@ -73,7 +73,7 @@
.transparentBackground {
background-color: var(--Base-Surface-Primary-light-Normal);
border-radius: var(--Corner-radius-Rounded);
border-radius: var(--Corner-Radius-Rounded);
opacity: 0.5;
position: absolute;
inset: 0;
@@ -83,7 +83,7 @@
.iconWrapper {
background: var(--Base-Surface-Primary-light-Normal);
border: 1px solid var(--Base-Border-Subtle);
border-radius: var(--Corner-radius-Rounded);
border-radius: var(--Corner-Radius-Rounded);
display: flex;
align-items: center;
justify-content: center;
packages/design-system/lib/components/VideoPlayer/VideoPlayer.stories.tsx
+1 -1
View File
@@ -163,7 +163,7 @@ export const Hero: Story = {
style={{
width: "min(100%, 1200px)",
height: "max(20vh, 300px)",
borderRadius: "var(--Corner-radius-lg)",
borderRadius: "var(--Corner-Radius-lg)",
margin: "auto",
overflow: "hidden",
}}
packages/design-system/lib/components/VideoPlayer/VideoWithCard/videoWithCard.module.css
+1 -1
View File
@@ -40,7 +40,7 @@
width: 100%;
padding: var(--Space-x3) var(--Space-x4);
align-content: center;
border-radius: var(--Corner-radius-lg);
border-radius: var(--Corner-Radius-lg);
&.style-primary-1 {
background: var(--Surface-Brand-Primary-1-Default);
packages/design-system/lib/components/VideoPlayer/videoPlayer.module.css
+1 -1
View File
@@ -8,7 +8,7 @@
z-index: 0;
&.inline {
border-radius: var(--Corner-radius-md);
border-radius: var(--Corner-Radius-md);
overflow: hidden;
}
packages/design-system/lib/design-system-new-deprecated.css
+3 -3
View File
@@ -347,9 +347,9 @@
--UI-Text-Placeholder: var(--UI-Grey-60);
}
:root {
--Corner-radius-Large: 12px;
--Corner-radius-Medium: 8px;
--Corner-radius-Rounded: 250px;
--Corner-Radius-Large: 12px;
--Corner-Radius-Medium: 8px;
--Corner-Radius-Rounded: 250px;
--Layout-Desktop-Margin-Margin-min: 40px;
--Layout-Mobile-Margin-Margin-min: 16px;
--Layout-Tablet-Margin-Margin-min: 24px;
packages/design-system/lib/fonts.css
+60
View File
@@ -96,6 +96,66 @@
src: url(/_static/shared/fonts/fira-sans/black.woff2) format("woff2");
}
@font-face {
font-display: swap;
font-family: "Futura PT";
font-style: normal;
font-weight: 300;
src:
url(/_static/shared/fonts/futura-pt/FuturaPT_normal_normal_300.woff2)
format("woff2"),
url(/_static/shared/fonts/futura-pt/FuturaPT_normal_normal_300.woff)
format("woff");
}
@font-face {
font-display: swap;
font-family: "Futura PT";
font-style: normal;
font-weight: 500;
src:
url(/_static/shared/fonts/futura-pt/FuturaPT_normal_condensed_500.woff2)
format("woff2"),
url(/_static/shared/fonts/futura-pt/FuturaPT_normal_condensed_500.woff)
format("woff");
}
@font-face {
font-display: swap;
font-family: "Futura PT";
font-style: italic;
font-weight: 500;
src:
url(/_static/shared/fonts/fututa-pt/FuturaPT_italic_normal_500.woff2)
format("woff2"),
url(/_static/shared/fonts/futura-pt/FuturaPT_italic_normal_500.woff)
format("woff");
}
@font-face {
font-display: swap;
font-family: "Futura PT";
font-style: normal;
font-weight: 700;
src:
url(/_static/shared/fonts/futura-pt/FuturaPT_normal_normal_700.woff2)
format("woff2"),
url(/_static/shared/fonts/futura-pt/FuturaPT_normal_normal_700.woff)
format("woff");
}
@font-face {
font-display: swap;
font-family: "Futura PT";
font-style: normal;
font-weight: 900;
src:
url(/_static/shared/fonts/futura-pt/FuturaPT_normal_condensed_925.woff2)
format("woff2"),
url(/_static/shared/fonts/futura-pt/FuturaPT_normal_condensed_925.woff)
format("woff");
}
@font-face {
font-display: swap;
font-family: "ITC Garamond Std";
packages/design-system/lib/style.css
+1
View File
@@ -1,5 +1,6 @@
@import url(./styles/impl.css);
@import url(./styles/base.css);
@import url(./styles/bassin-seven.css);
@import url(./styles/downtown-camper.css);
@import url(./styles/grand-hotel.css);
@import url(./styles/haymarket.css);
packages/design-system/lib/styles/base.css
+9 -9
View File
@@ -1,10 +1,10 @@
/* This file is generated, do not edit manually! */
:root {
/* Values */
--Border-width-lg: 3px;
--Border-width-md: 2px;
--Border-width-none: 0px;
--Border-width-sm: 1px;
--Border-lg: 3px;
--Border-md: 2px;
--Border-none: 0px;
--Border-sm: 1px;
--BoxShadow-Level-1: 0px 0px 2px 1px rgba(0, 0, 0, 0.1);
--BoxShadow-Level-2: 0px 0px 4px 2px rgba(0, 0, 0, 0.1);
--BoxShadow-Level-3: 0px 0px 8px 3px rgba(0, 0, 0, 0.1);
@@ -12,11 +12,11 @@
--Breakpoints-max-width: 767px;
--Breakpoints-min-width: 320px;
--Columns-Column: 4px;
--Corner-radius-lg: 12px;
--Corner-radius-md: 8px;
--Corner-radius-rounded: 250px;
--Corner-radius-sm: 4px;
--Corner-radius-xl: 16px;
--Corner-Radius-Rounded: 250px;
--Corner-Radius-lg: 12px;
--Corner-Radius-md: 8px;
--Corner-Radius-sm: 4px;
--Corner-Radius-xl: 16px;
--Font-weight-Black: 900;
--Font-weight-Bold: 700;
--Font-weight-Extra-Bold: 800;
packages/design-system/lib/styles/base.js
+8 -8
View File
@@ -74,14 +74,14 @@ export const theme = {
"Size/1300-56": 56,
"Size/1500-64": 64,
"Line height/xs": 100,
"Corner radius/sm": 4,
"Border width/sm": 1,
"Border width/md": 2,
"Border width/lg": 3,
"Corner radius/md": 8,
"Corner radius/lg": 12,
"Corner radius/xl": 16,
"Corner radius/rounded": 250,
"Corner Radius/sm": 4,
"Border/sm": 1,
"Border/md": 2,
"Border/lg": 3,
"Corner Radius/md": 8,
"Corner Radius/lg": 12,
"Corner Radius/xl": 16,
"Corner Radius/Rounded": 250,
"Space/x025": 2,
"Space/x05": 4,
"Space/x1": 8,
packages/design-system/lib/styles/bassin-seven.css
+434
View File
@@ -0,0 +1,434 @@
/* This file is generated, do not edit manually! */
.bassin-seven {
/* Values */
--Body-Lead-text-Font-fallback: sans-serif;
--Body-Lead-text-Letter-spacing: 0.2px;
--Body-Paragraph-Font-fallback: sans-serif;
--Body-Paragraph-Letter-spacing: 0.19px;
--Body-Supporting-text-Font-fallback: sans-serif;
--Body-Supporting-text-Letter-spacing: 0.2px;
--Body-Underline-md-Font-fallback: sans-serif;
--Body-Underline-md-Letter-spacing: 0.19px;
--Body-Underline-md-Text-Decoration: underline;
--Body-Underline-sm-Font-fallback: sans-serif;
--Body-Underline-sm-Letter-spacing: 0.2px;
--Body-Underline-sm-Text-Decoration: underline;
--Font-family-Bassin-Seven-Body: "Fira sans";
--Font-family-Bassin-Seven-Decorative: "Futura PT";
--Font-family-Bassin-Seven-Title: "Futura PT";
--Label-Font-fallback: sans-serif;
--Label-Letter-spacing: 0.17px;
--Link-md-Font-fallback: sans-serif;
--Link-md-Letter-spacing: 0.19px;
--Link-md-Text-Decoration: underline;
--Link-sm-Font-fallback: sans-serif;
--Link-sm-Letter-spacing: 0.2px;
--Link-sm-Text-Decoration: underline;
--Signature-Bassin-Seven-Black-Pearl-100: #010d16;
--Signature-Bassin-Seven-Black-Pearl-40: #c0c5c9;
--Signature-Bassin-Seven-Black-Pearl-50: #8d979e;
--Signature-Bassin-Seven-Black-Pearl-60: #616f79;
--Signature-Bassin-Seven-Black-Pearl-70: #465662;
--Signature-Bassin-Seven-Black-Pearl-80: #1f3442;
--Signature-Bassin-Seven-Black-Pearl-90: #011828;
--Signature-Bassin-Seven-Coral-40: #ed5454;
--Signature-Bassin-Seven-Mantle-100: #404a44;
--Signature-Bassin-Seven-Mantle-10: #f4f6f5;
--Signature-Bassin-Seven-Mantle-20: #e4e9e6;
--Signature-Bassin-Seven-Mantle-30: #ced8d3;
--Signature-Bassin-Seven-Mantle-40: #b8c6be;
--Signature-Bassin-Seven-Mantle-50: #a2b5ab;
--Signature-Bassin-Seven-Mantle-60: #8ea598;
--Signature-Bassin-Seven-Mantle-70: #798c81;
--Signature-Bassin-Seven-Mantle-80: #65756c;
--Signature-Bassin-Seven-Mantle-90: #515e57;
--Signature-Bassin-Seven-Rusty-40: #b17d2a;
--Signature-Bassin-Seven-Rusty-50: #9f7126;
--Signature-Bassin-Seven-Rusty-60: #8e6422;
--Signature-Bassin-Seven-Rusty-70: #855e20;
--Signature-Bassin-Seven-Rusty-80: #6a4b19;
--Signature-Bassin-Seven-Rusty-90: #503813;
--Signature-Bassin-Seven-Satin-Linen-0: #fdfcfb;
--Signature-Bassin-Seven-Satin-Linen-10: #f8f6f1;
--Signature-Bassin-Seven-Satin-Linen-20: #f4f2ea;
--Signature-Bassin-Seven-Satin-Linen-30: #efece1;
--Signature-Bassin-Seven-Satin-Linen-40: #ece9db;
--Signature-Bassin-Seven-Satin-Linen-50: #e7e3d2;
--Signature-Bassin-Seven-Satin-Linen-60: #d2cfbf;
--Signature-Bassin-Seven-Satin-Linen-70: #a4a195;
--Signature-Bassin-Seven-Satin-Linen-80: #7f7d74;
--Signature-Bassin-Seven-Satin-Linen-90: #615f58;
--Surface-Brand-Accent-OnAccent-Default: #ffffff;
--Tag-Font-fallback: sans-serif;
--Tag-Letter-spacing: 0.24px;
--Tag-Text-Transform: uppercase;
--Title-Decorative-lg-Font-fallback: Serif;
--Title-Decorative-lg-Letter-spacing: 0.18px;
--Title-Decorative-lg-Text-Transform: uppercase;
--Title-Decorative-md-Font-fallback: Serif;
--Title-Decorative-md-Letter-spacing: 0.32px;
--Title-Decorative-md-Text-Transform: uppercase;
--Title-Overline-sm-Font-fallback: sans-serif;
--Title-Overline-sm-Letter-spacing: 0.14px;
--Title-Overline-sm-Text-Transform: uppercase;
--Title-Subtitle-lg-Font-fallback: sans-serif;
--Title-Subtitle-lg-Letter-spacing: 0.24px;
--Title-Subtitle-md-Font-fallback: sans-serif;
--Title-Subtitle-md-Letter-spacing: 0.2px;
--Title-lg-Font-fallback: sans-serif;
--Title-lg-Letter-spacing: 0px;
--Title-lg-Text-Transform: none;
--Title-md-Font-fallback: sans-serif;
--Title-md-Letter-spacing: 0px;
--Title-md-LowCase-Font-fallback: sans-serif;
--Title-md-LowCase-Letter-spacing: 0px;
--Title-md-LowCase-Text-Transform: none;
--Title-md-Text-Transform: none;
--Title-sm-Font-fallback: sans-serif;
--Title-sm-Letter-spacing: 0px;
--Title-sm-LowCase-Font-fallback: sans-serif;
--Title-sm-LowCase-Letter-spacing: 0px;
--Title-sm-LowCase-Text-Transform: none;
--Title-sm-Text-Transform: none;
--Title-xs-Font-fallback: sans-serif;
--Title-xs-Letter-spacing: 0px;
--Title-xs-Text-Transform: none;
--Utilities-Gradients-10: #0118281a;
/* Aliases */
--Background-Primary: var(--Neutral-Opacity-White-100);
--Background-Secondary: var(--Neutral-Opacity-White-100);
--Body-Lead-text-Font-family: var(--Font-family-Bassin-Seven-Body);
--Body-Lead-text-Font-weight: var(--Font-weight-Regular);
--Body-Lead-text-Size: var(--Impl-Text-size-xs);
--Body-Paragraph-Font-family: var(--Font-family-Bassin-Seven-Body);
--Body-Paragraph-Font-weight-2: var(--Font-weight-Medium);
--Body-Paragraph-Font-weight: var(--Font-weight-Regular);
--Body-Paragraph-Size: var(--Impl-Text-size-3xs);
--Body-Supporting-text-Font-family: var(--Font-family-Bassin-Seven-Body);
--Body-Supporting-text-Font-weight-2: var(--Font-weight-Medium);
--Body-Supporting-text-Font-weight: var(--Font-weight-Regular);
--Body-Supporting-text-Size: var(--Impl-Text-size-4xs);
--Body-Underline-md-Font-family: var(--Font-family-Bassin-Seven-Body);
--Body-Underline-md-Font-weight: var(--Font-weight-Regular);
--Body-Underline-md-Size: var(--Impl-Text-size-3xs);
--Body-Underline-sm-Font-family: var(--Font-family-Bassin-Seven-Body);
--Body-Underline-sm-Font-weight: var(--Font-weight-Regular);
--Body-Underline-sm-Size: var(--Impl-Text-size-4xs);
--Border-Default: var(--Neutral-20);
--Border-Divider-Accent: var(--Neutral-30);
--Border-Divider-Brand-OnAccent-Default: var(
--Signature-Bassin-Seven-Black-Pearl-70
);
--Border-Divider-Brand-OnPrimary-1-Default: var(
--Signature-Bassin-Seven-Black-Pearl-80
);
--Border-Divider-Brand-OnPrimary-2-Default: var(
--Signature-Bassin-Seven-Black-Pearl-80
);
--Border-Divider-Brand-OnPrimary-3-Default: var(
--Signature-Bassin-Seven-Satin-Linen-70
);
--Border-Divider-Default: var(--Neutral-20);
--Border-Divider-Subtle: var(--Neutral-15);
--Border-Interactive-Active: var(--Neutral-80);
--Border-Interactive-Default: var(--Neutral-30);
--Border-Interactive-Disabled: var(--Neutral-30);
--Border-Interactive-Error: var(--Scandic-Red-70);
--Border-Interactive-Focus: var(--Neutral-80);
--Border-Inverted: var(--Neutral-Opacity-White-100);
--Border-Strong: var(--Neutral-30);
--Component-Button-Brand-Primary-Border-Default: var(
--Neutral-Opacity-White-0
);
--Component-Button-Brand-Primary-Border-Disabled: var(
--Neutral-Opacity-White-0
);
--Component-Button-Brand-Primary-Border-Hover: var(--Neutral-Opacity-White-0);
--Component-Button-Brand-Primary-Fill-Default: var(
--Signature-Bassin-Seven-Black-Pearl-90
);
--Component-Button-Brand-Primary-Fill-Disabled: var(
--Neutral-Opacity-Black-10
);
--Component-Button-Brand-Primary-Fill-Hover: var(--Neutral-Opacity-White-10);
--Component-Button-Brand-Primary-On-fill-Default: var(
--Neutral-Opacity-White-100
);
--Component-Button-Brand-Primary-On-fill-Disabled: var(--Neutral-40);
--Component-Button-Brand-Primary-On-fill-Hover: var(
--Neutral-Opacity-White-100
);
--Component-Button-Brand-Secondary-Border-Default: var(
--Signature-Bassin-Seven-Black-Pearl-90
);
--Component-Button-Brand-Secondary-Border-Disabled: var(
--Neutral-Opacity-Black-10
);
--Component-Button-Brand-Secondary-Border-Hover-inverted: var(
--Neutral-Opacity-White-50
);
--Component-Button-Brand-Secondary-Border-Hover: var(
--Signature-Bassin-Seven-Black-Pearl-70
);
--Component-Button-Brand-Secondary-Border-Inverted: var(
--Neutral-Opacity-White-100
);
--Component-Button-Brand-Secondary-Fill-Default: var(
--Neutral-Opacity-White-0
);
--Component-Button-Brand-Secondary-Fill-Disabled: var(
--Neutral-Opacity-Black-10
);
--Component-Button-Brand-Secondary-Fill-Hover-Inverted: var(
--Signature-Bassin-Seven-Black-Pearl-90
);
--Component-Button-Brand-Secondary-Fill-Hover: var(--Neutral-Opacity-White-0);
--Component-Button-Brand-Secondary-Fill-Inverted: var(
--Neutral-Opacity-White-100
);
--Component-Button-Brand-Secondary-On-fill-Default: var(
--Signature-Bassin-Seven-Black-Pearl-90
);
--Component-Button-Brand-Secondary-On-fill-Disabled: var(--Neutral-40);
--Component-Button-Brand-Secondary-On-fill-Hover-inverted: var(
--Neutral-Opacity-White-70
);
--Component-Button-Brand-Secondary-On-fill-Hover: var(
--Signature-Bassin-Seven-Black-Pearl-70
);
--Component-Button-Brand-Secondary-On-fill-Inverted: var(
--Neutral-Opacity-White-100
);
--Component-Button-Brand-Tertiary-Border-Default: var(
--Neutral-Opacity-White-0
);
--Component-Button-Brand-Tertiary-Border-Disabled: var(
--Neutral-Opacity-White-0
);
--Component-Button-Brand-Tertiary-Border-Hover: var(
--Neutral-Opacity-White-0
);
--Component-Button-Brand-Tertiary-Fill-Default: var(
--Signature-Bassin-Seven-Satin-Linen-50
);
--Component-Button-Brand-Tertiary-Fill-Disabled: var(
--Neutral-Opacity-Black-10
);
--Component-Button-Brand-Tertiary-Fill-Hover: var(--Neutral-Opacity-Black-5);
--Component-Button-Brand-Tertiary-On-fill-Default: var(
--Signature-Bassin-Seven-Black-Pearl-90
);
--Component-Button-Brand-Tertiary-On-fill-Disabled: var(--Neutral-40);
--Component-Button-Brand-Tertiary-On-fill-Hover: var(
--Signature-Bassin-Seven-Black-Pearl-90
);
--Component-Button-Inverted-Border-Default: var(--Neutral-Opacity-White-0);
--Component-Button-Inverted-Border-Disable: var(--Neutral-Opacity-White-10);
--Component-Button-Inverted-Border-Hover: var(--Neutral-Opacity-White-10);
--Component-Button-Inverted-Fill-Default: var(--Neutral-Opacity-White-100);
--Component-Button-Inverted-Fill-Disabled: var(--Neutral-Opacity-Black-10);
--Component-Button-Inverted-Fill-Faded: var(--Neutral-Opacity-White-90);
--Component-Button-Inverted-Fill-Hover-Inverted: var(
--Signature-Bassin-Seven-Black-Pearl-90
);
--Component-Button-Inverted-Fill-Hover: var(--Neutral-Opacity-Black-10);
--Component-Button-Inverted-On-fill-Default: var(
--Signature-Bassin-Seven-Black-Pearl-90
);
--Component-Button-Inverted-On-fill-Disabled: var(--Neutral-40);
--Component-Button-Inverted-On-fill-Hover-inverted: var(
--Neutral-Opacity-White-100
);
--Component-Button-Inverted-On-fill-Hover: var(--Neutral-Opacity-White-10);
--Component-Button-Muted-Border-Default: var(--Neutral-Opacity-White-10);
--Component-Button-Muted-Border-Disable: var(--Neutral-Opacity-White-10);
--Component-Button-Muted-Border-Hover: var(--Neutral-Opacity-White-10);
--Component-Button-Muted-Fill-Default: var(--Neutral-Opacity-White-100);
--Component-Button-Muted-Fill-Disabled-inverted: var(--Neutral-20);
--Component-Button-Muted-Fill-Disabled: var(--Neutral-Opacity-White-100);
--Component-Button-Muted-Fill-Hover-inverted: var(--Neutral-Opacity-Black-5);
--Component-Button-Muted-Fill-Hover: var(--Neutral-Opacity-White-100);
--Component-Button-Muted-On-fill-Default: var(--Neutral-70);
--Component-Button-Muted-On-fill-Disabled: var(--Neutral-40);
--Component-Button-Muted-On-fill-Hover-Inverted: var(
--Signature-Bassin-Seven-Black-Pearl-80
);
--Component-Button-Muted-On-fill-Inverted: var(--Neutral-Opacity-White-100);
--Icon-Accent: var(--Signature-Bassin-Seven-Rusty-60);
--Icon-Default: var(--Neutral-60);
--Icon-Feedback-Error: var(--Scandic-Red-70);
--Icon-Feedback-Information: var(--Scandic-Blue-70);
--Icon-Feedback-Neutral: var(--Neutral-60);
--Icon-Feedback-Success: var(--Scandic-Green-60);
--Icon-Feedback-Warning: var(--Scandic-Yellow-60);
--Icon-Intense: var(--Neutral-90);
--Icon-Interactive-Accent: var(--Signature-Bassin-Seven-Rusty-60);
--Icon-Interactive-Default: var(--Signature-Bassin-Seven-Black-Pearl-90);
--Icon-Interactive-Disabled: var(--Neutral-30);
--Icon-Interactive-Inverted-Hover: var(--Neutral-Opacity-White-70);
--Icon-Interactive-Placeholder: var(--Neutral-50);
--Icon-Interactive-Secondary: var(--Signature-Bassin-Seven-Rusty-60);
--Icon-Inverted: var(--Neutral-Opacity-White-100);
--Label-Font-family: var(--Font-family-The-Dock-Body);
--Label-Font-weight-2: var(--Font-weight-Medium);
--Label-Font-weight: var(--Font-weight-Regular);
--Label-Size: var(--Impl-Text-size-5xs);
--Link-md-Font-family: var(--Font-family-Bassin-Seven-Body);
--Link-md-Font-weight: var(--Font-weight-Medium);
--Link-md-Size: var(--Impl-Text-size-3xs);
--Link-sm-Font-family: var(--Font-family-Bassin-Seven-Body);
--Link-sm-Font-weight: var(--Font-weight-Medium);
--Link-sm-Size: var(--Impl-Text-size-4xs);
--Overlay-10: var(--Neutral-Opacity-Black-10);
--Overlay-20: var(--Neutral-Opacity-Black-20);
--Overlay-30: var(--Neutral-Opacity-Black-20);
--Overlay-40: var(--Neutral-Opacity-Black-40);
--Overlay-60: var(--Neutral-Opacity-Black-60);
--Overlay-80: var(--Neutral-Opacity-Black-80);
--Overlay-90: var(--Neutral-Opacity-Black-90);
--Surface-Accent-1: var(--Signature-Bassin-Seven-Rusty-70);
--Surface-Accent-2: var(--Signature-Bassin-Seven-Black-Pearl-80);
--Surface-Accent-3: var(--Signature-Bassin-Seven-Mantle-90);
--Surface-Accent-4: var(--Signature-Bassin-Seven-Rusty-40);
--Surface-Accent-5: var(--Signature-Grand-Hotel-Blue-Bayoux-50);
--Surface-Brand-Accent-Default: var(--Signature-Bassin-Seven-Mantle-50);
--Surface-Brand-Accent-OnAccent-Accent-Secondary: var(
--Signature-Bassin-Seven-Black-Pearl-80
);
--Surface-Brand-Accent-OnAccent-Accent: var(
--Signature-Bassin-Seven-Black-Pearl-80
);
--Surface-Brand-Primary-1-Default: var(
--Signature-Bassin-Seven-Black-Pearl-90
);
--Surface-Brand-Primary-1-OnSurface-Accent-Secondary: var(
--Signature-Bassin-Seven-Satin-Linen-50
);
--Surface-Brand-Primary-1-OnSurface-Accent: var(
--Signature-Bassin-Seven-Satin-Linen-50
);
--Surface-Brand-Primary-1-OnSurface-Default: var(
--Signature-Bassin-Seven-Satin-Linen-50
);
--Surface-Brand-Primary-2-Default: var(
--Signature-Bassin-Seven-Black-Pearl-90
);
--Surface-Brand-Primary-2-OnSurface-Accent: var(
--Signature-Bassin-Seven-Satin-Linen-50
);
--Surface-Brand-Primary-2-OnSurface-Default: var(
--Signature-Bassin-Seven-Satin-Linen-50
);
--Surface-Brand-Primary-3-Default: var(
--Signature-Bassin-Seven-Satin-Linen-50
);
--Surface-Brand-Primary-3-OnSurface-Accent: var(
--Signature-Bassin-Seven-Black-Pearl-90
);
--Surface-Brand-Primary-3-OnSurface-Default: var(
--Signature-Bassin-Seven-Black-Pearl-90
);
--Surface-Feedback-Error-light: var(--Scandic-Red-00);
--Surface-Feedback-Error: var(--Scandic-Red-70);
--Surface-Feedback-Information-light: var(--Scandic-Blue-00);
--Surface-Feedback-Information: var(--Scandic-Blue-70);
--Surface-Feedback-Neutral-light: var(--Neutral-15);
--Surface-Feedback-Neutral: var(--Neutral-50);
--Surface-Feedback-Succes-light: var(--Scandic-Green-00);
--Surface-Feedback-Succes: var(--Scandic-Green-60);
--Surface-Feedback-Warning-light: var(--Scandic-Yellow-00);
--Surface-Feedback-Warning: var(--Scandic-Yellow-60);
--Surface-Primary-Default: var(--Neutral-Opacity-White-100);
--Surface-Primary-Disabled: var(--Neutral-Opacity-Black-10);
--Surface-Primary-Hover-Accent: var(--Neutral-15);
--Surface-Primary-Hover-Light: var(--Neutral-Opacity-Black-10);
--Surface-Primary-Hover: var(--Neutral-Opacity-Black-5);
--Surface-Primary-OnSurface-Default: var(--Neutral-0);
--Surface-Secondary-Default: var(--Signature-Bassin-Seven-Satin-Linen-20);
--Surface-Secondary-Hover: var(--Neutral-Opacity-Black-5);
--Surface-Secondary-Subtle: var(--Signature-Bassin-Seven-Satin-Linen-50);
--Surface-UI-Fill-Active-Hover: var(--Neutral-Opacity-White-100);
--Surface-UI-Fill-Active: var(--Neutral-80);
--Surface-UI-Fill-Default: var(--Neutral-Opacity-White-100);
--Surface-UI-Fill-Disabled: var(--Neutral-15);
--Surface-UI-Fill-Intense: var(--Neutral-80);
--Tag-Font-family: var(--Font-family-Bassin-Seven-Title);
--Tag-Font-weight: var(--Font-weight-Regular-bold);
--Tag-Size: var(--Impl-Text-size-5xs);
--Text-Accent-Primary: var(--Neutral-50);
--Text-Brand-OnAccent-Accent-Secondary: var(
--Signature-Bassin-Seven-Black-Pearl-80
);
--Text-Brand-OnAccent-Accent: var(--Signature-Bassin-Seven-Black-Pearl-90);
--Text-Brand-OnAccent-Default: var(--Neutral-90);
--Text-Brand-OnAccent-Heading: var(--Signature-Bassin-Seven-Black-Pearl-90);
--Text-Brand-OnPrimary-1-Accent: var(--Neutral-Opacity-White-100);
--Text-Brand-OnPrimary-1-Default: var(--Neutral-Opacity-White-100);
--Text-Brand-OnPrimary-1-Heading: var(
--Signature-Bassin-Seven-Satin-Linen-50
);
--Text-Brand-OnPrimary-1-Hover: var(--Neutral-Opacity-White-70);
--Text-Brand-OnPrimary-2-Accent: var(--Neutral-Opacity-White-100);
--Text-Brand-OnPrimary-2-Default: var(--Neutral-Opacity-White-100);
--Text-Brand-OnPrimary-2-Heading: var(
--Signature-Bassin-Seven-Satin-Linen-50
);
--Text-Brand-OnPrimary-3-Accent: var(--Signature-Bassin-Seven-Black-Pearl-90);
--Text-Brand-OnPrimary-3-Default: var(--Neutral-90);
--Text-Brand-OnPrimary-3-Heading: var(
--Signature-Bassin-Seven-Black-Pearl-90
);
--Text-Default: var(--Neutral-90);
--Text-Feedback-Error: var(--Scandic-Red-70);
--Text-Feedback-Information: var(--Scandic-Blue-70);
--Text-Feedback-Neutral: var(--Neutral-50);
--Text-Feedback-Succes: var(--Scandic-Green-60);
--Text-Feedback-Warning: var(--Scandic-Yellow-60);
--Text-Heading: var(--Signature-Bassin-Seven-Black-Pearl-90);
--Text-Interactive-Default: var(--Signature-Bassin-Seven-Black-Pearl-90);
--Text-Interactive-Disabled: var(--Neutral-40);
--Text-Interactive-Error: var(--Scandic-Red-70);
--Text-Interactive-Focus: var(--Neutral-80);
--Text-Interactive-Hover: var(--Signature-Bassin-Seven-Black-Pearl-70);
--Text-Interactive-Inverted-Hover: var(--Neutral-Opacity-White-70);
--Text-Interactive-Placeholder: var(--Neutral-50);
--Text-Interactive-Secondary-Hover: var(--Signature-Bassin-Seven-Rusty-50);
--Text-Interactive-Secondary: var(--Signature-Bassin-Seven-Rusty-60);
--Text-Inverted: var(--Neutral-Opacity-White-100);
--Text-Secondary: var(--Neutral-60);
--Text-Tertiary: var(--Neutral-50);
--Title-Decorative-lg-Font-family: var(--Font-family-Bassin-Seven-Decorative);
--Title-Decorative-lg-Font-weight: var(--Font-weight-Regular);
--Title-Decorative-lg-Size: var(--Impl-Text-size-2xs);
--Title-Decorative-md-Font-family: var(--Font-family-Bassin-Seven-Decorative);
--Title-Decorative-md-Font-weight: var(--Font-weight-Regular);
--Title-Decorative-md-Size: var(--Impl-Text-size-3xs);
--Title-Overline-sm-Font-family: var(--Font-family-Bassin-Seven-Title);
--Title-Overline-sm-Font-weight: var(--Font-weight-Regular);
--Title-Overline-sm-Size: var(--Impl-Text-size-4xs);
--Title-Subtitle-lg-Font-family: var(--Font-family-Bassin-Seven-Body);
--Title-Subtitle-lg-Font-weight: var(--Font-weight-Medium);
--Title-Subtitle-lg-Size: var(--Impl-Text-size-sm);
--Title-Subtitle-md-Font-family: var(--Font-family-Bassin-Seven-Body);
--Title-Subtitle-md-Font-weight: var(--Font-weight-Medium);
--Title-Subtitle-md-Size: var(--Impl-Text-size-xs);
--Title-lg-Font-family: var(--Font-family-Bassin-Seven-Title);
--Title-lg-Font-weight: var(--Font-weight-Regular-bold);
--Title-lg-Size: var(--Impl-Text-size-4xl);
--Title-md-Font-family: var(--Font-family-Bassin-Seven-Title);
--Title-md-Font-weight: var(--Font-weight-Regular-bold);
--Title-md-LowCase-Font-family: var(--Font-family-Bassin-Seven-Title);
--Title-md-LowCase-Font-weight: var(--Font-weight-Regular-bold);
--Title-md-LowCase-Size: var(--Impl-Text-size-2xl);
--Title-md-Size: var(--Impl-Text-size-2xl);
--Title-sm-Font-family: var(--Font-family-Bassin-Seven-Title);
--Title-sm-Font-weight: var(--Font-weight-Regular-bold);
--Title-sm-LowCase-Font-family: var(--Font-family-Bassin-Seven-Title);
--Title-sm-LowCase-Font-weight: var(--Font-weight-Regular-bold);
--Title-sm-LowCase-Size: var(--Impl-Text-size-lg);
--Title-sm-Size: var(--Impl-Text-size-lg);
--Title-xs-Font-family: var(--Font-family-Bassin-Seven-Title);
--Title-xs-Font-weight: var(--Font-weight-Regular-bold);
--Title-xs-Size: var(--Impl-Text-size-sm);
}
packages/design-system/lib/styles/bassin-seven.js
+305
View File
@@ -0,0 +1,305 @@
/* This file is generated, do not edit manually! */
export const theme = {
"Signature/Bassin Seven/Rusty/40": "#B17D2A",
"Signature/Bassin Seven/Rusty/50": "#9F7126",
"Signature/Bassin Seven/Rusty/60": "#8E6422",
"Signature/Bassin Seven/Rusty/70": "#855E20",
"Signature/Bassin Seven/Rusty/80": "#6A4B19",
"Signature/Bassin Seven/Rusty/90": "#503813",
"Signature/Bassin Seven/Black Pearl/40": "#C0C5C9",
"Signature/Bassin Seven/Black Pearl/50": "#8D979E",
"Signature/Bassin Seven/Black Pearl/60": "#616F79",
"Signature/Bassin Seven/Black Pearl/70": "#465662",
"Signature/Bassin Seven/Black Pearl/80": "#1F3442",
"Signature/Bassin Seven/Black Pearl/90": "#011828",
"Signature/Bassin Seven/Black Pearl/100": "#010D16",
"Signature/Bassin Seven/Mantle/10": "#F4F6F5",
"Signature/Bassin Seven/Mantle/20": "#E4E9E6",
"Signature/Bassin Seven/Mantle/30": "#CED8D3",
"Signature/Bassin Seven/Mantle/40": "#B8C6BE",
"Signature/Bassin Seven/Mantle/50": "#A2B5AB",
"Signature/Bassin Seven/Mantle/60": "#8EA598",
"Signature/Bassin Seven/Mantle/70": "#798C81",
"Signature/Bassin Seven/Mantle/80": "#65756C",
"Signature/Bassin Seven/Mantle/90": "#515E57",
"Signature/Bassin Seven/Mantle/100": "#404A44",
"Signature/Bassin Seven/Satin Linen/0": "#FDFCFB",
"Signature/Bassin Seven/Satin Linen/10": "#F8F6F1",
"Signature/Bassin Seven/Satin Linen/20": "#F4F2EA",
"Signature/Bassin Seven/Satin Linen/30": "#EFECE1",
"Signature/Bassin Seven/Satin Linen/40": "#ECE9DB",
"Signature/Bassin Seven/Satin Linen/50": "#E7E3D2",
"Signature/Bassin Seven/Satin Linen/60": "#D2CFBF",
"Signature/Bassin Seven/Satin Linen/70": "#A4A195",
"Signature/Bassin Seven/Satin Linen/80": "#7F7D74",
"Signature/Bassin Seven/Satin Linen/90": "#615F58",
"Signature/Bassin Seven/Coral/40": "#ED5454",
"Title/lg/Font fallback": "sans-serif",
"Title/lg/Text-Transform": "none",
"Title/md/Font fallback": "sans-serif",
"Title/sm/Font fallback": "sans-serif",
"Title/sm/Text-Transform": "none",
"Title/Decorative/lg/Letter spacing": 0.18,
"Title/Decorative/lg/Font fallback": "Serif",
"Title/Decorative/lg/Text-Transform": "uppercase",
"Title/Decorative/md/Letter spacing": 0.32,
"Title/Decorative/md/Font fallback": "Serif",
"Title/Decorative/md/Text-Transform": "uppercase",
"Title/Subtitle/lg/Font fallback": "sans-serif",
"Title/Subtitle/lg/Letter spacing": 0.24,
"Title/Subtitle/md/Font fallback": "sans-serif",
"Title/Subtitle/md/Letter spacing": 0.2,
"Title/Overline/sm/Letter spacing": 0.14,
"Title/Overline/sm/Font fallback": "sans-serif",
"Title/Overline/sm/Text-Transform": "uppercase",
"Title/sm/LowCase/Font fallback": "sans-serif",
"Title/sm/LowCase/Text-Transform": "none",
"Title/xs/Font fallback": "sans-serif",
"Title/xs/Text-Transform": "none",
"Title/md/Text-Transform": "none",
"Title/md/LowCase/Font fallback": "sans-serif",
"Title/md/LowCase/Text-Transform": "none",
"Tag/Letter spacing": 0.24,
"Tag/Font fallback": "sans-serif",
"Tag/Text-Transform": "uppercase",
"Link/md/Font fallback": "sans-serif",
"Link/md/Letter spacing": 0.19,
"Link/md/Text-Decoration": "underline",
"Link/sm/Font fallback": "sans-serif",
"Link/sm/Letter spacing": 0.2,
"Link/sm/Text-Decoration": "underline",
"Body/Lead text/Font fallback": "sans-serif",
"Body/Paragraph/Font fallback": "sans-serif",
"Body/Paragraph/Letter spacing": 0.19,
"Body/Supporting text/Font fallback": "sans-serif",
"Body/Supporting text/Letter spacing": 0.2,
"Body/Lead text/Letter spacing": 0.2,
"Label/Font fallback": "sans-serif",
"Label/Letter spacing": 0.17,
"Body/Underline/md/Font fallback": "sans-serif",
"Body/Underline/md/Letter spacing": 0.19,
"Body/Underline/md/Text-Decoration": "underline",
"Body/Underline/sm/Font fallback": "sans-serif",
"Body/Underline/sm/Letter spacing": 0.2,
"Body/Underline/sm/Text-Decoration": "underline",
"Surface/Brand/Accent/OnAccent/Default": "#FFFFFF",
"Utilities/Gradients/10": "#0118281A",
"Font family/Bassin Seven/Title": "Futura PT",
"Font family/Bassin Seven/Body": "Fira sans",
"Font family/Bassin Seven/Decorative": "Futura PT",
"Title/lg/Font weight": 450,
"Title/lg/Font family": "Futura PT",
"Title/md/Font weight": 450,
"Title/md/Font family": "Futura PT",
"Title/sm/Font weight": 450,
"Title/sm/Font family": "Futura PT",
"Title/sm/LowCase/Font weight": 450,
"Title/sm/LowCase/Font family": "Futura PT",
"Title/Decorative/lg/Font weight": 400,
"Title/Decorative/lg/Font family": "Futura PT",
"Title/Decorative/md/Font weight": 400,
"Title/Decorative/md/Font family": "Futura PT",
"Title/Subtitle/lg/Font weight": 500,
"Title/Subtitle/lg/Font family": "Fira sans",
"Title/Subtitle/md/Font weight": 500,
"Title/Subtitle/md/Font family": "Fira sans",
"Title/Overline/sm/Font weight": 400,
"Title/Overline/sm/Font family": "Futura PT",
"Title/xs/Font weight": 450,
"Title/xs/Font family": "Futura PT",
"Title/md/LowCase/Font weight": 450,
"Title/md/LowCase/Font family": "Futura PT",
"Tag/Font weight": 450,
"Tag/Font family": "Futura PT",
"Link/md/Font weight": 500,
"Link/md/Font family": "Fira sans",
"Link/sm/Font weight": 500,
"Link/sm/Font family": "Fira sans",
"Body/Lead text/Font weight": 400,
"Body/Lead text/Font family": "Fira sans",
"Body/Paragraph/Font weight": 400,
"Body/Paragraph/Font weight 2": 500,
"Body/Paragraph/Font family": "Fira sans",
"Body/Supporting text/Font weight": 400,
"Body/Supporting text/Font weight 2": 500,
"Body/Supporting text/Font family": "Fira sans",
"Label/Font weight": 400,
"Label/Font weight 2": 500,
"Label/Font family": "Fira sans",
"Body/Underline/md/Font weight": 400,
"Body/Underline/md/Font family": "Fira sans",
"Body/Underline/sm/Font weight": 400,
"Body/Underline/sm/Font family": "Fira sans",
"Text/Heading": "#011828",
"Text/Default": "#1F1F1F",
"Text/Secondary": "#575757",
"Text/Tertiary": "#747474",
"Text/Accent Primary": "#747474",
"Text/Inverted": "#FFFFFF",
"Text/Interactive/Default": "#011828",
"Text/Interactive/Hover": "#465662",
"Text/Interactive/Secondary": "#8E6422",
"Text/Interactive/Secondary Hover": "#9F7126",
"Text/Interactive/Inverted Hover": "#FFFFFFB3",
"Text/Interactive/Disabled": "#8C8C8C",
"Text/Interactive/Focus": "#262626",
"Text/Interactive/Error": "#AD0015",
"Text/Interactive/Placeholder": "#747474",
"Text/Brand/OnAccent/Heading": "#011828",
"Text/Feedback/Information": "#284EA0",
"Text/Feedback/Succes": "#348337",
"Text/Feedback/Warning": "#D17308",
"Text/Feedback/Error": "#AD0015",
"Text/Feedback/Neutral": "#747474",
"Text/Brand/OnAccent/Default": "#1F1F1F",
"Text/Brand/OnAccent/Accent": "#011828",
"Text/Brand/OnAccent/Accent Secondary": "#1F3442",
"Text/Brand/OnPrimary 1/Heading": "#E7E3D2",
"Text/Brand/OnPrimary 1/Default": "#FFFFFF",
"Text/Brand/OnPrimary 1/Hover": "#FFFFFFB3",
"Text/Brand/OnPrimary 1/Accent": "#FFFFFF",
"Text/Brand/OnPrimary 2/Heading": "#E7E3D2",
"Text/Brand/OnPrimary 2/Default": "#FFFFFF",
"Text/Brand/OnPrimary 2/Accent": "#FFFFFF",
"Text/Brand/OnPrimary 3/Heading": "#011828",
"Text/Brand/OnPrimary 3/Default": "#1F1F1F",
"Text/Brand/OnPrimary 3/Accent": "#011828",
"Background/Primary": "#FFFFFF",
"Background/Secondary": "#FFFFFF",
"Surface/Primary/Default": "#FFFFFF",
"Surface/Primary/Hover": "#1F1C1B0D",
"Surface/Primary/Hover Light": "#1F1C1B1A",
"Surface/Primary/Hover Accent": "#E9E9E9",
"Surface/Primary/OnSurface/Default": "#FCFCFC",
"Surface/Primary/Disabled": "#1F1C1B1A",
"Surface/Secondary/Default": "#F4F2EA",
"Surface/Secondary/Subtle": "#E7E3D2",
"Surface/Secondary/Hover": "#1F1C1B0D",
"Surface/Brand/Accent/Default": "#A2B5AB",
"Surface/Brand/Accent/OnAccent/Accent": "#1F3442",
"Surface/Brand/Accent/OnAccent/Accent Secondary": "#1F3442",
"Surface/Brand/Primary 1/Default": "#011828",
"Surface/Brand/Primary 1/OnSurface/Default": "#E7E3D2",
"Surface/Brand/Primary 1/OnSurface/Accent": "#E7E3D2",
"Surface/Brand/Primary 1/OnSurface/Accent Secondary": "#E7E3D2",
"Surface/Brand/Primary 2/Default": "#011828",
"Surface/Brand/Primary 2/OnSurface/Default": "#E7E3D2",
"Surface/Brand/Primary 2/OnSurface/Accent": "#E7E3D2",
"Surface/Brand/Primary 3/Default": "#E7E3D2",
"Surface/Brand/Primary 3/OnSurface/Default": "#011828",
"Surface/Brand/Primary 3/OnSurface/Accent": "#011828",
"Surface/UI Fill/Default": "#FFFFFF",
"Surface/UI Fill/Intense": "#262626",
"Surface/UI Fill/Active": "#262626",
"Surface/UI Fill/Active Hover": "#FFFFFF",
"Surface/UI Fill/Disabled": "#E9E9E9",
"Surface/Accent/1": "#855E20",
"Surface/Accent/2": "#1F3442",
"Surface/Accent/3": "#515E57",
"Surface/Accent/4": "#B17D2A",
"Surface/Accent/5": "#5B6E7F",
"Surface/Feedback/Information": "#284EA0",
"Surface/Feedback/Information light": "#E8F6FF",
"Surface/Feedback/Succes": "#348337",
"Surface/Feedback/Succes light": "#F3FCE8",
"Surface/Feedback/Warning": "#D17308",
"Surface/Feedback/Warning light": "#FFF8E3",
"Surface/Feedback/Error": "#AD0015",
"Surface/Feedback/Error light": "#FFEBEB",
"Surface/Feedback/Neutral": "#747474",
"Surface/Feedback/Neutral light": "#E9E9E9",
"Border/Default": "#D9D9D9",
"Border/Strong": "#BFBFBF",
"Border/Inverted": "#FFFFFF",
"Icon/Default": "#575757",
"Icon/Intense": "#1F1F1F",
"Icon/Accent": "#8E6422",
"Icon/Interactive/Default": "#011828",
"Icon/Interactive/Secondary": "#8E6422",
"Icon/Interactive/Accent": "#8E6422",
"Icon/Interactive/Inverted Hover": "#FFFFFFB3",
"Icon/Interactive/Disabled": "#BFBFBF",
"Icon/Interactive/Placeholder": "#747474",
"Icon/Feedback/Information": "#284EA0",
"Icon/Feedback/Success": "#348337",
"Icon/Feedback/Warning": "#D17308",
"Icon/Feedback/Error": "#AD0015",
"Icon/Feedback/Neutral": "#575757",
"Icon/Inverted": "#FFFFFF",
"Overlay/10": "#1F1C1B1A",
"Overlay/20": "#1F1C1B33",
"Overlay/30": "#1F1C1B33",
"Overlay/40": "#1F1C1B66",
"Overlay/60": "#1F1C1B99",
"Overlay/80": "#1F1C1BCC",
"Overlay/90": "#1F1C1BE6",
"Component/Button/Brand/Primary/Fill/Default": "#011828",
"Component/Button/Brand/Primary/Fill/Hover": "#FFFFFF1A",
"Component/Button/Brand/Primary/Fill/Disabled": "#1F1C1B1A",
"Component/Button/Brand/Primary/On fill/Default": "#FFFFFF",
"Component/Button/Brand/Primary/On fill/Hover": "#FFFFFF",
"Component/Button/Brand/Primary/On fill/Disabled": "#8C8C8C",
"Component/Button/Brand/Primary/Border/Default": "#FFFFFF00",
"Component/Button/Brand/Primary/Border/Hover": "#FFFFFF00",
"Component/Button/Brand/Primary/Border/Disabled": "#FFFFFF00",
"Component/Button/Brand/Secondary/Fill/Default": "#FFFFFF00",
"Component/Button/Brand/Secondary/Fill/Hover": "#FFFFFF00",
"Component/Button/Brand/Secondary/Fill/Inverted": "#FFFFFF",
"Component/Button/Brand/Secondary/Fill/Hover Inverted": "#011828",
"Component/Button/Brand/Secondary/Fill/Disabled": "#1F1C1B1A",
"Component/Button/Brand/Secondary/On fill/Default": "#011828",
"Component/Button/Brand/Secondary/On fill/Hover": "#465662",
"Component/Button/Brand/Secondary/On fill/Inverted": "#FFFFFF",
"Component/Button/Brand/Secondary/On fill/Hover inverted": "#FFFFFFB3",
"Component/Button/Brand/Secondary/On fill/Disabled": "#8C8C8C",
"Component/Button/Brand/Secondary/Border/Default": "#011828",
"Component/Button/Brand/Secondary/Border/Hover": "#465662",
"Component/Button/Brand/Secondary/Border/Inverted": "#FFFFFF",
"Component/Button/Brand/Secondary/Border/Hover inverted": "#FFFFFF80",
"Component/Button/Brand/Secondary/Border/Disabled": "#1F1C1B1A",
"Component/Button/Brand/Tertiary/Fill/Default": "#E7E3D2",
"Component/Button/Brand/Tertiary/Fill/Hover": "#1F1C1B0D",
"Component/Button/Brand/Tertiary/Fill/Disabled": "#1F1C1B1A",
"Component/Button/Brand/Tertiary/On fill/Default": "#011828",
"Component/Button/Brand/Tertiary/On fill/Hover": "#011828",
"Component/Button/Brand/Tertiary/On fill/Disabled": "#8C8C8C",
"Component/Button/Brand/Tertiary/Border/Default": "#FFFFFF00",
"Component/Button/Brand/Tertiary/Border/Hover": "#FFFFFF00",
"Component/Button/Brand/Tertiary/Border/Disabled": "#FFFFFF00",
"Component/Button/Inverted/Fill/Default": "#FFFFFF",
"Component/Button/Inverted/Fill/Faded": "#FFFFFFE6",
"Component/Button/Inverted/Fill/Hover": "#1F1C1B1A",
"Component/Button/Inverted/Fill/Hover Inverted": "#011828",
"Component/Button/Inverted/Fill/Disabled": "#1F1C1B1A",
"Component/Button/Inverted/Border/Default": "#FFFFFF00",
"Component/Button/Inverted/Border/Hover": "#FFFFFF1A",
"Component/Button/Inverted/Border/Disable": "#FFFFFF1A",
"Component/Button/Inverted/On fill/Default": "#011828",
"Component/Button/Inverted/On fill/Hover": "#FFFFFF1A",
"Component/Button/Inverted/On fill/Hover inverted": "#FFFFFF",
"Component/Button/Inverted/On fill/Disabled": "#8C8C8C",
"Border/Interactive/Default": "#BFBFBF",
"Border/Divider/Default": "#D9D9D9",
"Border/Divider/Subtle": "#E9E9E9",
"Border/Divider/Accent": "#BFBFBF",
"Border/Divider/Brand/OnAccent/Default": "#465662",
"Border/Divider/Brand/OnPrimary 1/Default": "#1F3442",
"Border/Divider/Brand/OnPrimary 2/Default": "#1F3442",
"Border/Divider/Brand/OnPrimary 3/Default": "#A4A195",
"Border/Interactive/Active": "#262626",
"Border/Interactive/Focus": "#262626",
"Border/Interactive/Disabled": "#BFBFBF",
"Border/Interactive/Error": "#AD0015",
"Component/Button/Muted/Fill/Default": "#FFFFFF",
"Component/Button/Muted/Fill/Hover": "#FFFFFF",
"Component/Button/Muted/Fill/Disabled": "#FFFFFF",
"Component/Button/Muted/Fill/Hover inverted": "#1F1C1B0D",
"Component/Button/Muted/Fill/Disabled inverted": "#D9D9D9",
"Component/Button/Muted/On fill/Default": "#454545",
"Component/Button/Muted/On fill/Inverted": "#FFFFFF",
"Component/Button/Muted/On fill/Hover Inverted": "#1F3442",
"Component/Button/Muted/On fill/Disabled": "#8C8C8C",
"Component/Button/Muted/Border/Default": "#FFFFFF1A",
"Component/Button/Muted/Border/Hover": "#FFFFFF1A",
"Component/Button/Muted/Border/Disable": "#FFFFFF1A",
}
packages/design-system/lib/styles/downtown-camper.css
+1 -1
View File
@@ -245,7 +245,7 @@
--Component-Button-Muted-Fill-Disabled: var(--Neutral-Opacity-White-10);
--Component-Button-Muted-Fill-Hover-inverted: var(--Neutral-Opacity-Black-5);
--Component-Button-Muted-Fill-Hover: var(--Neutral-Opacity-White-5);
--Component-Button-Muted-On-fill-Default: var(--Neutral-90);
--Component-Button-Muted-On-fill-Default: var(--Neutral-70);
--Component-Button-Muted-On-fill-Disabled: var(--Neutral-40);
--Component-Button-Muted-On-fill-Hover-Inverted: var(
--Signature-Downtown-Camper-Russet-70
packages/design-system/lib/styles/downtown-camper.js
+1 -1
View File
@@ -300,7 +300,7 @@ export const theme = {
"Component/Button/Muted/Fill/Disabled": "#FFFFFF1A",
"Component/Button/Muted/Fill/Hover inverted": "#1F1C1B0D",
"Component/Button/Muted/Fill/Disabled inverted": "#D9D9D9",
"Component/Button/Muted/On fill/Default": "#1F1F1F",
"Component/Button/Muted/On fill/Default": "#454545",
"Component/Button/Muted/On fill/Inverted": "#FFFFFF",
"Component/Button/Muted/On fill/Hover Inverted": "#9B5622",
"Component/Button/Muted/On fill/Disabled": "#8C8C8C",
packages/design-system/lib/styles/grand-hotel.css
+5 -5
View File
@@ -160,7 +160,7 @@
--Neutral-Opacity-Black-10
);
--Component-Button-Brand-Secondary-Fill-Hover-Inverted: var(
--Signature-Grand-Hotel-Submarine-30
--Signature-Grand-Hotel-Blue-Bayoux-100
);
--Component-Button-Brand-Secondary-Fill-Hover: var(--Neutral-Opacity-White-0);
--Component-Button-Brand-Secondary-Fill-Inverted: var(
@@ -194,13 +194,13 @@
--Component-Button-Brand-Tertiary-Fill-Disabled: var(
--Neutral-Opacity-Black-10
);
--Component-Button-Brand-Tertiary-Fill-Hover: var(--Neutral-Opacity-White-10);
--Component-Button-Brand-Tertiary-Fill-Hover: var(--Neutral-Opacity-Black-10);
--Component-Button-Brand-Tertiary-On-fill-Default: var(
--Signature-Grand-Hotel-Blue-Bayoux-100
);
--Component-Button-Brand-Tertiary-On-fill-Disabled: var(--Neutral-40);
--Component-Button-Brand-Tertiary-On-fill-Hover: var(
--Neutral-Opacity-White-10
--Signature-Grand-Hotel-Blue-Bayoux-100
);
--Component-Button-Inverted-Border-Default: var(--Neutral-Opacity-White-0);
--Component-Button-Inverted-Border-Disable: var(--Neutral-Opacity-White-10);
@@ -228,13 +228,13 @@
--Component-Button-Muted-Fill-Disabled: var(--Neutral-Opacity-White-100);
--Component-Button-Muted-Fill-Hover-inverted: var(--Neutral-Opacity-Black-5);
--Component-Button-Muted-Fill-Hover: var(--Neutral-Opacity-White-100);
--Component-Button-Muted-On-fill-Default: var(--Neutral-90);
--Component-Button-Muted-On-fill-Default: var(--Neutral-70);
--Component-Button-Muted-On-fill-Disabled: var(--Neutral-40);
--Component-Button-Muted-On-fill-Hover-Inverted: var(
--Signature-Grand-Hotel-Blue-Bayoux-80
);
--Component-Button-Muted-On-fill-Inverted: var(--Neutral-Opacity-White-100);
--Icon-Accent: var(--Signature-Grand-Hotel-Careys-Pink-40);
--Icon-Accent: var(--Signature-Grand-Hotel-Careys-Pink-60);
--Icon-Default: var(--Neutral-60);
--Icon-Feedback-Error: var(--Scandic-Red-70);
--Icon-Feedback-Information: var(--Scandic-Blue-70);
packages/design-system/lib/styles/grand-hotel.js
+5 -5
View File
@@ -199,7 +199,7 @@ export const theme = {
"Border/Inverted": "#FFFFFF",
"Icon/Default": "#575757",
"Icon/Intense": "#1F1F1F",
"Icon/Accent": "#DBA7B1",
"Icon/Accent": "#AA546B",
"Icon/Interactive/Default": "#21252B",
"Icon/Interactive/Secondary": "#AA546B",
"Icon/Interactive/Accent": "#AA546B",
@@ -231,7 +231,7 @@ export const theme = {
"Component/Button/Brand/Secondary/Fill/Default": "#FFFFFF00",
"Component/Button/Brand/Secondary/Fill/Hover": "#FFFFFF00",
"Component/Button/Brand/Secondary/Fill/Inverted": "#FFFFFF",
"Component/Button/Brand/Secondary/Fill/Hover Inverted": "#B0C4CB",
"Component/Button/Brand/Secondary/Fill/Hover Inverted": "#21252B",
"Component/Button/Brand/Secondary/Fill/Disabled": "#1F1C1B1A",
"Component/Button/Brand/Secondary/On fill/Default": "#21252B",
"Component/Button/Brand/Secondary/On fill/Hover": "#3D444D",
@@ -244,10 +244,10 @@ export const theme = {
"Component/Button/Brand/Secondary/Border/Hover inverted": "#FFFFFF80",
"Component/Button/Brand/Secondary/Border/Disabled": "#1F1C1B1A",
"Component/Button/Brand/Tertiary/Fill/Default": "#B0C4CB",
"Component/Button/Brand/Tertiary/Fill/Hover": "#FFFFFF1A",
"Component/Button/Brand/Tertiary/Fill/Hover": "#1F1C1B1A",
"Component/Button/Brand/Tertiary/Fill/Disabled": "#1F1C1B1A",
"Component/Button/Brand/Tertiary/On fill/Default": "#21252B",
"Component/Button/Brand/Tertiary/On fill/Hover": "#FFFFFF1A",
"Component/Button/Brand/Tertiary/On fill/Hover": "#21252B",
"Component/Button/Brand/Tertiary/On fill/Disabled": "#8C8C8C",
"Component/Button/Brand/Tertiary/Border/Default": "#FFFFFF00",
"Component/Button/Brand/Tertiary/Border/Hover": "#FFFFFF00",
@@ -281,7 +281,7 @@ export const theme = {
"Component/Button/Muted/Fill/Disabled": "#FFFFFF",
"Component/Button/Muted/Fill/Hover inverted": "#1F1C1B0D",
"Component/Button/Muted/Fill/Disabled inverted": "#D9D9D9",
"Component/Button/Muted/On fill/Default": "#1F1F1F",
"Component/Button/Muted/On fill/Default": "#454545",
"Component/Button/Muted/On fill/Inverted": "#FFFFFF",
"Component/Button/Muted/On fill/Hover Inverted": "#3D444D",
"Component/Button/Muted/On fill/Disabled": "#8C8C8C",
packages/design-system/lib/styles/haymarket.css
+2 -2
View File
@@ -203,7 +203,7 @@
--Component-Button-Brand-Tertiary-Fill-Disabled: var(
--Neutral-Opacity-Black-10
);
--Component-Button-Brand-Tertiary-Fill-Hover: var(--Neutral-Opacity-Black-10);
--Component-Button-Brand-Tertiary-Fill-Hover: var(--Neutral-Opacity-Black-20);
--Component-Button-Brand-Tertiary-On-fill-Default: var(
--Neutral-Opacity-White-100
);
@@ -235,7 +235,7 @@
--Component-Button-Muted-Fill-Disabled: var(--Neutral-Opacity-White-10);
--Component-Button-Muted-Fill-Hover-inverted: var(--Neutral-Opacity-Black-5);
--Component-Button-Muted-Fill-Hover: var(--Neutral-Opacity-White-5);
--Component-Button-Muted-On-fill-Default: var(--Neutral-90);
--Component-Button-Muted-On-fill-Default: var(--Neutral-70);
--Component-Button-Muted-On-fill-Disabled: var(--Neutral-40);
--Component-Button-Muted-On-fill-Hover-Inverted: var(--Neutral-70);
--Component-Button-Muted-On-fill-Inverted: var(--Neutral-Opacity-White-100);
packages/design-system/lib/styles/haymarket.js
+2 -2
View File
@@ -263,7 +263,7 @@ export const theme = {
"Component/Button/Brand/Secondary/Border/Hover inverted": "#FFFFFF80",
"Component/Button/Brand/Secondary/Border/Disabled": "#1F1C1B1A",
"Component/Button/Brand/Tertiary/Fill/Default": "#946F54",
"Component/Button/Brand/Tertiary/Fill/Hover": "#1F1C1B1A",
"Component/Button/Brand/Tertiary/Fill/Hover": "#1F1C1B33",
"Component/Button/Brand/Tertiary/Fill/Disabled": "#1F1C1B1A",
"Component/Button/Brand/Tertiary/On fill/Default": "#FFFFFF",
"Component/Button/Brand/Tertiary/On fill/Hover": "#FFFFFF",
@@ -300,7 +300,7 @@ export const theme = {
"Component/Button/Muted/Fill/Disabled": "#FFFFFF1A",
"Component/Button/Muted/Fill/Hover inverted": "#1F1C1B0D",
"Component/Button/Muted/Fill/Disabled inverted": "#D9D9D9",
"Component/Button/Muted/On fill/Default": "#1F1F1F",
"Component/Button/Muted/On fill/Default": "#454545",
"Component/Button/Muted/On fill/Inverted": "#FFFFFF",
"Component/Button/Muted/On fill/Hover Inverted": "#454545",
"Component/Button/Muted/On fill/Disabled": "#8C8C8C",
packages/design-system/lib/styles/hotel-norge.css
+1 -1
View File
@@ -237,7 +237,7 @@
--Component-Button-Muted-Fill-Disabled: var(--Neutral-Opacity-White-100);
--Component-Button-Muted-Fill-Hover-inverted: var(--Neutral-Opacity-Black-5);
--Component-Button-Muted-Fill-Hover: var(--Neutral-Opacity-White-100);
--Component-Button-Muted-On-fill-Default: var(--Neutral-90);
--Component-Button-Muted-On-fill-Default: var(--Neutral-70);
--Component-Button-Muted-On-fill-Disabled: var(--Neutral-40);
--Component-Button-Muted-On-fill-Hover-Inverted: var(
--Signature-Hotel-Norge-Dark-blue-80
packages/design-system/lib/styles/hotel-norge.js
+1 -1
View File
@@ -287,7 +287,7 @@ export const theme = {
"Component/Button/Muted/Fill/Disabled": "#FFFFFF",
"Component/Button/Muted/Fill/Hover inverted": "#1F1C1B0D",
"Component/Button/Muted/Fill/Disabled inverted": "#D9D9D9",
"Component/Button/Muted/On fill/Default": "#1F1F1F",
"Component/Button/Muted/On fill/Default": "#454545",
"Component/Button/Muted/On fill/Inverted": "#FFFFFF",
"Component/Button/Muted/On fill/Hover Inverted": "#404655",
"Component/Button/Muted/On fill/Disabled": "#8C8C8C",
packages/design-system/lib/styles/marski.css
+2 -2
View File
@@ -222,7 +222,7 @@
--Component-Button-Brand-Tertiary-Fill-Disabled: var(
--Neutral-Opacity-Black-10
);
--Component-Button-Brand-Tertiary-Fill-Hover: var(--Neutral-Opacity-Black-5);
--Component-Button-Brand-Tertiary-Fill-Hover: var(--Neutral-Opacity-Black-20);
--Component-Button-Brand-Tertiary-On-fill-Default: var(
--Neutral-Opacity-White-100
);
@@ -256,7 +256,7 @@
--Component-Button-Muted-Fill-Disabled: var(--Neutral-Opacity-White-100);
--Component-Button-Muted-Fill-Hover-inverted: var(--Neutral-Opacity-Black-5);
--Component-Button-Muted-Fill-Hover: var(--Neutral-Opacity-White-100);
--Component-Button-Muted-On-fill-Default: var(--Neutral-90);
--Component-Button-Muted-On-fill-Default: var(--Neutral-70);
--Component-Button-Muted-On-fill-Disabled: var(--Neutral-40);
--Component-Button-Muted-On-fill-Hover-Inverted: var(
--Signature-Marski-Aubergine-80
packages/design-system/lib/styles/marski.js
+2 -2
View File
@@ -274,7 +274,7 @@ export const theme = {
"Component/Button/Brand/Secondary/Border/Hover inverted": "#FFFFFF80",
"Component/Button/Brand/Secondary/Border/Disabled": "#1F1C1B1A",
"Component/Button/Brand/Tertiary/Fill/Default": "#0D57F3",
"Component/Button/Brand/Tertiary/Fill/Hover": "#1F1C1B0D",
"Component/Button/Brand/Tertiary/Fill/Hover": "#1F1C1B33",
"Component/Button/Brand/Tertiary/Fill/Disabled": "#1F1C1B1A",
"Component/Button/Brand/Tertiary/On fill/Default": "#FFFFFF",
"Component/Button/Brand/Tertiary/On fill/Hover": "#FFFFFF",
@@ -311,7 +311,7 @@ export const theme = {
"Component/Button/Muted/Fill/Disabled": "#FFFFFF",
"Component/Button/Muted/Fill/Hover inverted": "#1F1C1B0D",
"Component/Button/Muted/Fill/Disabled inverted": "#D9D9D9",
"Component/Button/Muted/On fill/Default": "#1F1F1F",
"Component/Button/Muted/On fill/Default": "#454545",
"Component/Button/Muted/On fill/Inverted": "#FFFFFF",
"Component/Button/Muted/On fill/Hover Inverted": "#5B353B",
"Component/Button/Muted/On fill/Disabled": "#8C8C8C",
packages/design-system/lib/styles/partner-sas.css
+1 -1
View File
@@ -147,7 +147,7 @@
--Component-Button-Muted-Fill-Disabled: var(--Neutral-Opacity-White-100);
--Component-Button-Muted-Fill-Hover-inverted: var(--Neutral-Opacity-Black-5);
--Component-Button-Muted-Fill-Hover: var(--Neutral-Opacity-White-100);
--Component-Button-Muted-On-fill-Default: var(--Neutral-90);
--Component-Button-Muted-On-fill-Default: var(--Neutral-70);
--Component-Button-Muted-On-fill-Disabled: var(--Neutral-40);
--Component-Button-Muted-On-fill-Hover-Inverted: var(
--Signature-Grand-Hotel-Blue-Bayoux-80
packages/design-system/lib/styles/partner-sas.js
+1 -1
View File
@@ -167,7 +167,7 @@ export const theme = {
"Component/Button/Muted/Fill/Disabled": "#FFFFFF",
"Component/Button/Muted/Fill/Hover inverted": "#1F1C1B0D",
"Component/Button/Muted/Fill/Disabled inverted": "#D9D9D9",
"Component/Button/Muted/On fill/Default": "#1F1F1F",
"Component/Button/Muted/On fill/Default": "#454545",
"Component/Button/Muted/On fill/Inverted": "#FFFFFF",
"Component/Button/Muted/On fill/Hover Inverted": "#3D444D",
"Component/Button/Muted/On fill/Disabled": "#8C8C8C",
packages/design-system/lib/styles/scandic-go.css
+2 -2
View File
@@ -85,7 +85,7 @@
--Title-Decorative-md-Text-Transform: none;
--Title-Overline-sm-Font-fallback: sans-serif;
--Title-Overline-sm-Letter-spacing: 0.21px;
--Title-Overline-sm-Text-Transform: none;
--Title-Overline-sm-Text-Transform: uppercase;
--Title-Subtitle-lg-Font-fallback: sans-serif;
--Title-Subtitle-lg-Letter-spacing: 0.24px;
--Title-Subtitle-md-Font-fallback: sans-serif;
@@ -242,7 +242,7 @@
--Component-Button-Muted-Fill-Disabled: var(--Neutral-Opacity-White-10);
--Component-Button-Muted-Fill-Hover-inverted: var(--Neutral-Opacity-Black-5);
--Component-Button-Muted-Fill-Hover: var(--Neutral-Opacity-White-5);
--Component-Button-Muted-On-fill-Default: var(--Neutral-90);
--Component-Button-Muted-On-fill-Default: var(--Neutral-70);
--Component-Button-Muted-On-fill-Disabled: var(--Neutral-40);
--Component-Button-Muted-On-fill-Hover-Inverted: var(--Scandic-Go-Purple-80);
--Component-Button-Muted-On-fill-Inverted: var(--Neutral-Opacity-White-100);
packages/design-system/lib/styles/scandic-go.js
+2 -2
View File
@@ -70,7 +70,7 @@ export const theme = {
"Title/Subtitle/md/Letter spacing": 0.2,
"Title/Overline/sm/Letter spacing": 0.21,
"Title/Overline/sm/Font fallback": "sans-serif",
"Title/Overline/sm/Text-Transform": "none",
"Title/Overline/sm/Text-Transform": "uppercase",
"Title/sm/LowCase/Letter spacing": 0.42,
"Title/sm/LowCase/Font fallback": "sans-serif",
"Title/sm/LowCase/Text-Transform": "none",
@@ -317,7 +317,7 @@ export const theme = {
"Component/Button/Muted/Fill/Disabled": "#FFFFFF1A",
"Component/Button/Muted/Fill/Hover inverted": "#1F1C1B0D",
"Component/Button/Muted/Fill/Disabled inverted": "#D9D9D9",
"Component/Button/Muted/On fill/Default": "#1F1F1F",
"Component/Button/Muted/On fill/Default": "#454545",
"Component/Button/Muted/On fill/Inverted": "#FFFFFF",
"Component/Button/Muted/On fill/Hover Inverted": "#5E2A8C",
"Component/Button/Muted/On fill/Disabled": "#8C8C8C",
packages/design-system/lib/styles/scandic.css
+1 -1
View File
@@ -269,7 +269,7 @@
--Component-Button-Muted-Fill-Disabled: var(--Neutral-Opacity-White-10);
--Component-Button-Muted-Fill-Hover-inverted: var(--Neutral-Opacity-Black-5);
--Component-Button-Muted-Fill-Hover: var(--Neutral-Opacity-White-5);
--Component-Button-Muted-On-fill-Default: var(--Scandic-Grey-100);
--Component-Button-Muted-On-fill-Default: var(--Scandic-Grey-80);
--Component-Button-Muted-On-fill-Disabled: var(--Scandic-Grey-40);
--Component-Button-Muted-On-fill-Hover-Inverted: var(--Scandic-Red-90);
--Component-Button-Muted-On-fill-Inverted: var(--Neutral-Opacity-White-100);
packages/design-system/lib/styles/scandic.js
+1 -1
View File
@@ -344,7 +344,7 @@ export const theme = {
"Component/Button/Muted/Fill/Disabled": "#FFFFFF1A",
"Component/Button/Muted/Fill/Hover inverted": "#1F1C1B0D",
"Component/Button/Muted/Fill/Disabled inverted": "#1F1C1B1A",
"Component/Button/Muted/On fill/Default": "#26201E",
"Component/Button/Muted/On fill/Default": "#57514E",
"Component/Button/Muted/On fill/Inverted": "#FFFFFF",
"Component/Button/Muted/On fill/Hover Inverted": "#6D000D",
"Component/Button/Muted/On fill/Disabled": "#A8A4A2",
packages/design-system/lib/styles/the-dock.css
+3 -3
View File
@@ -194,13 +194,13 @@
--Component-Button-Brand-Tertiary-Fill-Disabled: var(
--Neutral-Opacity-Black-10
);
--Component-Button-Brand-Tertiary-Fill-Hover: var(--Neutral-Opacity-White-10);
--Component-Button-Brand-Tertiary-Fill-Hover: var(--Neutral-Opacity-Black-10);
--Component-Button-Brand-Tertiary-On-fill-Default: var(
--Signature-The-Dock-Rose-Copper-90
);
--Component-Button-Brand-Tertiary-On-fill-Disabled: var(--Neutral-40);
--Component-Button-Brand-Tertiary-On-fill-Hover: var(
--Neutral-Opacity-White-10
--Signature-The-Dock-Rose-Copper-90
);
--Component-Button-Inverted-Border-Default: var(--Neutral-Opacity-White-0);
--Component-Button-Inverted-Border-Disable: var(--Neutral-Opacity-White-10);
@@ -228,7 +228,7 @@
--Component-Button-Muted-Fill-Disabled: var(--Neutral-Opacity-White-100);
--Component-Button-Muted-Fill-Hover-inverted: var(--Neutral-Opacity-Black-5);
--Component-Button-Muted-Fill-Hover: var(--Neutral-Opacity-White-100);
--Component-Button-Muted-On-fill-Default: var(--Neutral-90);
--Component-Button-Muted-On-fill-Default: var(--Neutral-70);
--Component-Button-Muted-On-fill-Disabled: var(--Neutral-40);
--Component-Button-Muted-On-fill-Hover-Inverted: var(
--Signature-The-Dock-Rose-Copper-80
packages/design-system/lib/styles/the-dock.js
+4 -4
View File
@@ -12,8 +12,8 @@ export const theme = {
"Signature/The Dock/Signal Red/60": "#D62220",
"Signature/The Dock/Signal Red/80": "#B31C1B",
"Signature/The Dock/Signal Blue/50": "#06237C",
"Signature/The Dock/Signal Blue/90": "#030F34",
"Signature/The Dock/Artic Oker/60": "#FFB839",
"Signature/The Dock/Signal Blue/90": "#030F34",
"Title/lg/Letter spacing": -0.24,
"Title/lg/Font fallback": "Serif",
"Title/lg/Text-Transform": "none",
@@ -241,10 +241,10 @@ export const theme = {
"Component/Button/Brand/Secondary/Border/Hover inverted": "#FFFFFF80",
"Component/Button/Brand/Secondary/Border/Disabled": "#1F1C1B1A",
"Component/Button/Brand/Tertiary/Fill/Default": "#F2E1C2",
"Component/Button/Brand/Tertiary/Fill/Hover": "#FFFFFF1A",
"Component/Button/Brand/Tertiary/Fill/Hover": "#1F1C1B1A",
"Component/Button/Brand/Tertiary/Fill/Disabled": "#1F1C1B1A",
"Component/Button/Brand/Tertiary/On fill/Default": "#3E1212",
"Component/Button/Brand/Tertiary/On fill/Hover": "#FFFFFF1A",
"Component/Button/Brand/Tertiary/On fill/Hover": "#3E1212",
"Component/Button/Brand/Tertiary/On fill/Disabled": "#8C8C8C",
"Component/Button/Brand/Tertiary/Border/Default": "#FFFFFF00",
"Component/Button/Brand/Tertiary/Border/Hover": "#FFFFFF00",
@@ -278,7 +278,7 @@ export const theme = {
"Component/Button/Muted/Fill/Disabled": "#FFFFFF",
"Component/Button/Muted/Fill/Hover inverted": "#1F1C1B0D",
"Component/Button/Muted/Fill/Disabled inverted": "#D9D9D9",
"Component/Button/Muted/On fill/Default": "#1F1F1F",
"Component/Button/Muted/On fill/Default": "#454545",
"Component/Button/Muted/On fill/Inverted": "#FFFFFF",
"Component/Button/Muted/On fill/Hover Inverted": "#654141",
"Component/Button/Muted/On fill/Disabled": "#8C8C8C",
packages/design-system/lib/tokens/index.ts
+854 -53
View File
File diff suppressed because it is too large Load Diff

Some files were not shown because too many files have changed in this diff Show More