Files
web/apps/scandic-web/components/HotelReservation/MyStay/Promo/promo.module.css
Pontus Dreij 74c5b47319 Merged in feat/SW-1737-design-mystay-multiroom (pull request #1565)
Feat/SW-1737 design mystay multiroom

* feat(SW-1737) Fixed member view of guest details

* feat(SW-1737) fix merge issues

* feat(SW-1737) Fixed price details

* feat(SW-1737) removed unused imports

* feat(SW-1737) removed true as statement

* feat(SW-1737) updated store handling

* feat(SW-1737) fixed bug showing double numbers

* feat(SW-1737) small design fixed

* feat(SW-1737) fixed rebase errors

* feat(SW-1737) fixed create booking error with dates

* feat(SW-1737) fixed view multiroom as singleroom

* feat(SW-1737) fixes for multiroom

* feat(SW-1737) fixed bookingsummary

* feat(SW-1737) dont hide modify dates

* feat(SW-1737) updated breakfast to handle number

* feat(SW-1737) Added red color if member rate

* feat(SW-1737) fix PR comments

* feat(SW-1737) updated member tiers svg

* feat(SW-1737) updated how to handle paymentMethodDescription

* feat(SW-1737) fixes after testing mystay

* feat(SW-1737) updated Room type to just use whats used

* feat(SW-1737) fixed access

* feat(SW-1737) refactor my stay after PR comments

* feat(SW-1737) fix roomNumber translation

* feat(SW-1737) removed log


Approved-by: Arvid Norlin
2025-03-24 09:30:10 +00:00

72 lines
1.1 KiB
CSS

.promo {
height: 480px;
position: relative;
display: flex;
overflow: hidden;
}
.content {
position: relative;
z-index: 2;
align-items: center;
display: flex;
flex: 1 0 100%;
flex-direction: column;
gap: var(--Spacing-x2);
justify-content: center;
padding: var(--Spacing-x4) var(--Spacing-x3);
color: var(--UI-Opacity-White-100);
text-align: center;
}
.text {
width: 100%;
}
.imageContainer {
height: 100%;
width: 100%;
position: absolute;
background-image: linear-gradient(
180deg,
rgba(0, 0, 0, 0) 0%,
rgba(0, 0, 0, 0.36) 37.88%,
rgba(0, 0, 0, 0.75) 100%
);
}
.overlay {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-image: linear-gradient(
180deg,
rgba(0, 0, 0, 0) 0%,
rgba(0, 0, 0, 0.36) 37.88%,
rgba(0, 0, 0, 0.75) 100%
);
z-index: 1;
}
.image {
height: 100%;
object-fit: cover;
width: 100%;
}
@media (min-width: 768px) {
.promo {
border-radius: var(--Corner-radius-xLarge);
}
.content {
flex: 1 0 480px;
}
.text {
width: 400px;
}
}