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

Merged in feat/SW-1477-external-gym (pull request #1875)

Browse Source 
feat/SW-1477-handle-external-gym

* feat/SW-1477-handle-external-gym


Approved-by: Erik Tiekstra
This commit is contained in:
Matilda Landström
2025-04-28 09:27:36 +00:00
parent 5beffe4968
commit 8e78dec6c2
4 changed files with 87 additions and 67 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
apps/scandic-web/components/ContentType/HotelPage/SidePeeks/RestaurantBar/RestaurantBarItem/index.tsx
View File

@@ -5,7 +5,6 @@ import ButtonLink from "@/components/ButtonLink"
import Image from "@/components/Image"
import OpeningHours from "@/components/OpeningHours"
import Link from "@/components/TempDesignSystem/Link"
import Body from "@/components/TempDesignSystem/Text/Body"
import { getIntl } from "@/i18n"
import styles from "./restaurantBarItem.module.css"
@@ -50,7 +49,9 @@ export default async function RestaurantBarItem({
))}
</div>
) : null}
<Body>{content.texts.descriptions.short}</Body>
<Typography variant="Body/Paragraph/mdRegular">
<p>{content.texts.descriptions.short}</p>
</Typography>
{openingDetails.length ? (
<div className={styles.content}>
<Typography variant="Title/Subtitle/md">

4
apps/scandic-web/components/ContentType/HotelPage/SidePeeks/WellnessAndExercise/Facility/facility.module.css
View File

@@ -20,3 +20,7 @@
.openingHours {
margin-top: var(--Spacing-x1);
}
.title {
color: var(--Text-Interactive-Default);
}

106
apps/scandic-web/components/ContentType/HotelPage/SidePeeks/WellnessAndExercise/Facility/index.tsx
View File

@@ -1,7 +1,6 @@
import { Typography } from "@scandic-hotels/design-system/Typography"
import Image from "@/components/Image"
import Body from "@/components/TempDesignSystem/Text/Body"
import Subtitle from "@/components/TempDesignSystem/Text/Subtitle"
import Title from "@/components/TempDesignSystem/Text/Title"
import { getIntl } from "@/i18n"
import { translateWellnessType } from "../../../utils"
@@ -15,6 +14,10 @@ export default async function Facility({ data }: FacilityProps) {
const image = data.content.images[0]
const ordinaryOpeningTimes = data.openingDetails.openingHours.ordinary
const weekendOpeningTimes = data.openingDetails.openingHours.weekends
const shortDescription = data.content.texts.descriptions?.short
const isExternalGym =
data.type === "Gym" &&
data?.details.find((d) => d.name === "ExternalGym")?.value
return (
<div className={styles.content}>
@@ -28,50 +31,61 @@ export default async function Facility({ data }: FacilityProps) {
/>
)}
<div className={styles.information}>
<Subtitle color="burgundy" asChild type="one">
<Title level="h3">{translateWellnessType(data.type, intl)}</Title>
</Subtitle>
<div>
<Subtitle type="two" color="uiTextHighContrast">
{intl.formatMessage({
defaultMessage: "Opening hours",
})}
</Subtitle>
<div className={styles.openingHours}>
<Body color="uiTextHighContrast">
{ordinaryOpeningTimes.alwaysOpen
? intl.formatMessage({
defaultMessage: "Monday–Friday: Always open",
})
: intl.formatMessage(
{
defaultMessage:
"Monday–Friday: {openingTime}–{closingTime}",
},
{
openingTime: ordinaryOpeningTimes.openingTime,
closingTime: ordinaryOpeningTimes.closingTime,
}
)}
</Body>
<Body color="uiTextHighContrast">
{weekendOpeningTimes.alwaysOpen
? intl.formatMessage({
defaultMessage: "Saturday–Sunday: Always open",
})
: intl.formatMessage(
{
defaultMessage:
"Saturday–Sunday: {openingTime}–{closingTime}",
},
{
openingTime: weekendOpeningTimes.openingTime,
closingTime: weekendOpeningTimes.closingTime,
}
)}
</Body>
<Typography variant="Title/Subtitle/lg" className={styles.title}>
<h3>{translateWellnessType(data.type, intl)}</h3>
</Typography>
{!isExternalGym ? (
<div>
<Typography variant="Title/Subtitle/md">
<h4>
{intl.formatMessage({
defaultMessage: "Opening hours",
})}
</h4>
</Typography>
<Typography variant="Body/Paragraph/mdRegular">
<div className={styles.openingHours}>
<p>
{ordinaryOpeningTimes.alwaysOpen
? intl.formatMessage({
defaultMessage: "Monday–Friday: Always open",
})
: intl.formatMessage(
{
defaultMessage:
"Monday–Friday: {openingTime}–{closingTime}",
},
{
openingTime: ordinaryOpeningTimes.openingTime,
closingTime: ordinaryOpeningTimes.closingTime,
}
)}
</p>
<p>
{weekendOpeningTimes.alwaysOpen
? intl.formatMessage({
defaultMessage: "Saturday–Sunday: Always open",
})
: intl.formatMessage(
{
defaultMessage:
"Saturday–Sunday: {openingTime}–{closingTime}",
},
{
openingTime: weekendOpeningTimes.openingTime,
closingTime: weekendOpeningTimes.closingTime,
}
)}
</p>
</div>
</Typography>
</div>
</div>
) : null}
{shortDescription ? (
<Typography variant="Body/Paragraph/mdRegular">
<p>{shortDescription}</p>
</Typography>
) : null}
</div>
</div>
)

39
apps/scandic-web/components/ContentType/HotelPage/SidePeeks/WellnessAndExercise/index.tsx
View File

@@ -1,5 +1,4 @@
import Button from "@/components/TempDesignSystem/Button"
import Link from "@/components/TempDesignSystem/Link"
import ButtonLink from "@/components/ButtonLink"
import SidePeek from "@/components/TempDesignSystem/SidePeek"
import { getIntl } from "@/i18n"
@@ -32,25 +31,27 @@ export default async function WellnessAndExerciseSidePeek({
{(spaPage || wellnessExercisePageUrl) && (
<div className={styles.buttonContainer}>
{spaPage && (
<Button fullWidth theme="base" intent="tertiary" asChild>
<Link weight="bold" href={spaPage.url}>
{spaPage.buttonCTA}
</Link>
</Button>
<ButtonLink
href={spaPage.url}
variant="Tertiary"
color="Primary"
typography="Body/Paragraph/mdBold"
>
{spaPage.buttonCTA}
</ButtonLink>
)}
{wellnessExercisePageUrl && (
<Button fullWidth theme="base" intent="secondary" asChild>
<Link
href={`/${wellnessExercisePageUrl}`}
weight="bold"
color="burgundy"
appendToCurrentPath
>
{intl.formatMessage({
defaultMessage: "Show Gym & Wellness",
})}
</Link>
</Button>
<ButtonLink
href={`/${wellnessExercisePageUrl}`}
color="Primary"
variant="Secondary"
typography="Body/Paragraph/mdBold"
appendToCurrentPath
>
{intl.formatMessage({
defaultMessage: "Show Gym & Wellness",
})}
</ButtonLink>
)}
</div>
)}