diff --git a/apps/scandic-web/components/ContentType/HotelPage/SidePeeks/WellnessAndExercise/index.tsx b/apps/scandic-web/components/ContentType/HotelPage/SidePeeks/WellnessAndExercise/index.tsx index d75fe2c5c..31f43ad71 100644 --- a/apps/scandic-web/components/ContentType/HotelPage/SidePeeks/WellnessAndExercise/index.tsx +++ b/apps/scandic-web/components/ContentType/HotelPage/SidePeeks/WellnessAndExercise/index.tsx @@ -1,3 +1,5 @@ +import { cx } from "class-variance-authority" + import ButtonLink from "@/components/ButtonLink" import SidePeek from "@/components/TempDesignSystem/SidePeek" import { getIntl } from "@/i18n" @@ -23,14 +25,19 @@ export default async function WellnessAndExerciseSidePeek({ return ( -
+
{healthFacilities.map((facility) => ( ))}
- {(spaPage || wellnessExercisePageUrl) && ( + {spaPage || wellnessExercisePageUrl ? (
- {spaPage && ( + {spaPage ? ( {spaPage.buttonCTA} - )} + ) : null} {wellnessExercisePageHref ? ( ) : null}
- )} + ) : null} ) } diff --git a/apps/scandic-web/components/ContentType/HotelPage/SidePeeks/WellnessAndExercise/wellnessAndExercise.module.css b/apps/scandic-web/components/ContentType/HotelPage/SidePeeks/WellnessAndExercise/wellnessAndExercise.module.css index f6f47761e..a79578840 100644 --- a/apps/scandic-web/components/ContentType/HotelPage/SidePeeks/WellnessAndExercise/wellnessAndExercise.module.css +++ b/apps/scandic-web/components/ContentType/HotelPage/SidePeeks/WellnessAndExercise/wellnessAndExercise.module.css @@ -2,9 +2,16 @@ display: flex; flex-direction: column; gap: var(--Spacing-x4); - margin-bottom: calc( - var(--Spacing-x4) * 2 + 80px - ); /* Creates space between the wrapper and buttonContainer */ + + /* Creates space between the wrapper and buttonContainer depending on which buttons are present */ + &.hasSpaPage, + &.hasWellnessPage { + margin-bottom: 125px; + } + + &.hasSpaPage.hasWellnessExercisePage { + margin-bottom: 201px; + } } .buttonContainer {