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

Feat/BOOK-63 hotel subpages branding

Browse Source 
* feat(BOOK-63): Replaced css variables and components to apply hotel branding on subpages
* feat(BOOK-63): Replaced css variables and components to apply hotel branding on hotel page map view

Approved-by: Christel Westerberg
Approved-by: Matilda Landström
This commit is contained in:
Erik Tiekstra
2025-11-05 08:30:55 +00:00
parent 7fc49428c7
commit 3a38e99a71
47 changed files with 524 additions and 393 deletions
Download Patch File Download Diff File Expand all files Collapse all files

86
packages/design-system/lib/components/Map/InteractiveMap/interactiveMap.module.css
View File

@@ -4,77 +4,63 @@
height: 100%;
position: relative;
z-index: 0;
}
.mapContainer :global(.gm-style .gm-style-iw-d) {
padding: 0 !important;
overflow: hidden !important;
max-height: none !important;
max-width: none !important;
}
&::after {
content: '';
position: absolute;
top: 0;
right: 0;
background: linear-gradient(
43deg,
rgba(172, 172, 172, 0) 57.66%,
rgba(0, 0, 0, 0.25) 92.45%
);
width: 100%;
height: 100%;
pointer-events: none;
}
.mapContainer :global(.gm-style .gm-style-iw-c) {
padding: 0 !important;
overflow: hidden !important;
max-height: none !important;
max-width: none !important;
}
.mapContainer::after {
content: '';
position: absolute;
top: 0;
right: 0;
background: linear-gradient(
43deg,
rgba(172, 172, 172, 0) 57.66%,
rgba(0, 0, 0, 0.25) 92.45%
);
width: 100%;
height: 100%;
pointer-events: none;
:global(.gm-style .gm-style-iw-d),
:global(.gm-style .gm-style-iw-c) {
padding: 0 !important;
overflow: hidden !important;
max-height: none !important;
max-width: none !important;
}
}
.ctaButtons {
position: absolute;
top: var(--Spacing-x2);
right: var(--Spacing-x2);
z-index: 1;
top: var(--Space-x2);
right: var(--Space-x2);
display: flex;
gap: var(--Space-x7);
flex-direction: column;
gap: var(--Spacing-x7);
align-items: flex-end;
pointer-events: none;
z-index: 1;
}
.zoomButtons {
display: grid;
gap: var(--Spacing-x2);
}
.closeButton {
pointer-events: initial;
box-shadow: var(--button-box-shadow);
gap: var(--Spacing-x-half);
display: flex;
gap: var(--Space-x2);
}
.zoomButton {
width: var(--Space-x5);
height: var(--Space-x5);
padding: 0;
pointer-events: initial;
box-shadow: var(--button-box-shadow);
}
@media screen and (max-width: 767px) {
.zoomButtons {
flex-direction: column;
}
}
@media screen and (min-width: 768px) {
.ctaButtons {
top: var(--Spacing-x4);
right: var(--Spacing-x5);
bottom: var(--Spacing-x7);
top: var(--Space-x4);
right: var(--Space-x5);
bottom: var(--Space-x7);
justify-content: space-between;
}
.zoomButtons {
display: flex;
}
}