diff --git a/apps/scandic-web/components/ContentType/HotelPage/AmenitiesList/amenitiesList.module.css b/apps/scandic-web/components/ContentType/HotelPage/AmenitiesList/amenitiesList.module.css
index 84bb73b19..9ec9151d5 100644
--- a/apps/scandic-web/components/ContentType/HotelPage/AmenitiesList/amenitiesList.module.css
+++ b/apps/scandic-web/components/ContentType/HotelPage/AmenitiesList/amenitiesList.module.css
@@ -1,10 +1,9 @@
.amenitiesContainer {
background-color: var(--Base-Surface-Subtle-Normal);
border-radius: var(--Corner-radius-lg);
- padding: var(--Spacing-x3) var(--Spacing-x3) var(--Spacing-x-one-and-half)
- var(--Spacing-x3);
+ padding: var(--Space-x3) var(--Space-x3) var(--Space-x15) var(--Space-x3);
display: grid;
- gap: var(--Spacing-x-one-and-half);
+ gap: var(--Space-x15);
height: fit-content;
width: min(100%, 300px);
justify-items: start;
@@ -13,13 +12,12 @@
.amenityItemList {
display: flex;
flex-direction: column;
- gap: var(--Spacing-x1);
+ gap: var(--Space-x1);
}
.amenityItem {
display: inline-flex;
- gap: var(--Spacing-x1);
- align-items: center;
+ gap: var(--Space-x1);
}
.icon {
@@ -32,10 +30,11 @@
.facility {
color: var(--Text-Secondary);
+ align-items: center;
}
@media screen and (min-width: 1367px) {
.amenitiesContainer {
- margin-top: var(--Spacing-x5);
+ margin-top: var(--Space-x5);
}
}
diff --git a/apps/scandic-web/components/ContentType/HotelPage/AmenitiesList/index.tsx b/apps/scandic-web/components/ContentType/HotelPage/AmenitiesList/index.tsx
index 79a01fc69..2198c8216 100644
--- a/apps/scandic-web/components/ContentType/HotelPage/AmenitiesList/index.tsx
+++ b/apps/scandic-web/components/ContentType/HotelPage/AmenitiesList/index.tsx
@@ -37,13 +37,12 @@ export default async function AmenitiesList({
)
return (
- {Icon && Icon}
-
- {facility.name}
-
+ {Icon}
+
+
+ {facility.name}
+
+
)
})}
diff --git a/apps/scandic-web/components/ContentType/HotelPage/PreviewImages/previewImages.module.css b/apps/scandic-web/components/ContentType/HotelPage/PreviewImages/previewImages.module.css
index 543bcc0e5..9255ca90f 100644
--- a/apps/scandic-web/components/ContentType/HotelPage/PreviewImages/previewImages.module.css
+++ b/apps/scandic-web/components/ContentType/HotelPage/PreviewImages/previewImages.module.css
@@ -15,13 +15,13 @@
cursor: pointer;
border-radius: var(--Corner-radius-sm);
overflow: hidden;
+ max-height: 30vh;
}
.image {
object-fit: cover;
width: 100%;
height: 100%;
- max-height: 30vh;
margin: 0 auto;
}
@@ -32,42 +32,24 @@
.seeAllButton {
position: absolute;
- bottom: var(--Spacing-x2);
- right: var(--Spacing-x4);
+ bottom: var(--Space-x2);
+ right: var(--Space-x4);
z-index: 1;
}
@media screen and (min-width: 768px) {
.seeAllButton {
- right: calc(var(--Spacing-x2) + var(--Layout-Tablet-Margin-Margin-min));
+ right: calc(var(--Space-x2) + var(--Layout-Tablet-Margin-Margin-min));
}
}
@media screen and (min-width: 1367px) {
.imageWrapper {
- grid-template-columns: 70% 30%;
- grid-template-rows: repeat(2, 16.625rem);
- grid-template-areas:
- "main side1"
- "main side2";
- padding: 0 var(--Spacing-x5);
+ padding: 0 var(--Space-x5);
}
- .image {
- max-height: none;
- }
-
- .imageWrapper > :first-child {
- grid-area: main;
- }
-
- .imageWrapper > :nth-child(2),
- .imageWrapper > :nth-child(3) {
- display: initial;
- }
-
- .imageWrapper > :nth-child(2) {
- grid-area: side1;
+ .imageButton {
+ max-height: 540px;
}
.desktopGrid > :nth-child(3) {
@@ -75,6 +57,31 @@
}
.seeAllButton {
- right: var(--Spacing-x7);
+ right: var(--Space-x7);
+ }
+
+ .imageWrapper:has(> :nth-child(2)) {
+ grid-template-columns: 70% 30%;
+ grid-template-rows: repeat(2, 16.625rem);
+ grid-template-areas:
+ "main side1"
+ "main side2";
+
+ > :first-child {
+ grid-area: main;
+ }
+
+ > :nth-child(2),
+ > :nth-child(3) {
+ display: initial;
+ }
+
+ > :nth-child(2) {
+ grid-area: side1;
+ }
+
+ .imageButton {
+ max-height: none;
+ }
}
}
diff --git a/apps/scandic-web/components/ContentType/HotelPage/index.tsx b/apps/scandic-web/components/ContentType/HotelPage/index.tsx
index 5bad35841..ee1d318ed 100644
--- a/apps/scandic-web/components/ContentType/HotelPage/index.tsx
+++ b/apps/scandic-web/components/ContentType/HotelPage/index.tsx
@@ -123,6 +123,7 @@ export default async function HotelPage({ hotelId }: HotelPageProps) {
hasMeetingRooms: !!(meetingRoomsData && meetingRoomsData.length > 0),
hasActivities: activitiesCards.length > 0,
hasFAQ: !!(faq && faq.accordions.length > 0),
+ hasRooms: roomCategories.length > 0,
},
sectionHeadings
)
@@ -194,11 +195,13 @@ export default async function HotelPage({ hotelId }: HotelPageProps) {
) : null}
-
+ {pageSections.rooms ? (
+
+ ) : null}
{facilities && (