Files
web/packages/design-system/lib/components/Map/InteractiveMap/interactiveMap.module.css
Erik Tiekstra 3a38e99a71 Feat/BOOK-63 hotel subpages branding
* 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
2025-11-05 08:30:55 +00:00

67 lines
1.2 KiB
CSS

.mapContainer {
--button-box-shadow: 0 0 8px 1px rgba(0, 0, 0, 0.1);
width: 100%;
height: 100%;
position: relative;
z-index: 0;
&::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(--Space-x2);
right: var(--Space-x2);
display: flex;
gap: var(--Space-x7);
flex-direction: column;
align-items: flex-end;
pointer-events: none;
z-index: 1;
}
.zoomButtons {
display: flex;
gap: var(--Space-x2);
}
.zoomButton {
pointer-events: initial;
}
@media screen and (max-width: 767px) {
.zoomButtons {
flex-direction: column;
}
}
@media screen and (min-width: 768px) {
.ctaButtons {
top: var(--Space-x4);
right: var(--Space-x5);
bottom: var(--Space-x7);
justify-content: space-between;
}
}