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 Image from "@/components/Image"
import OpeningHours from "@/components/OpeningHours" import OpeningHours from "@/components/OpeningHours"
import Link from "@/components/TempDesignSystem/Link" import Link from "@/components/TempDesignSystem/Link"
import Body from "@/components/TempDesignSystem/Text/Body"
import { getIntl } from "@/i18n" import { getIntl } from "@/i18n"
import styles from "./restaurantBarItem.module.css" import styles from "./restaurantBarItem.module.css"
@@ -50,7 +49,9 @@ export default async function RestaurantBarItem({
))} ))}
</div> </div>
) : null} ) : null}
<Body>{content.texts.descriptions.short}</Body> <Typography variant="Body/Paragraph/mdRegular">
<p>{content.texts.descriptions.short}</p>
</Typography>
{openingDetails.length ? ( {openingDetails.length ? (
<div className={styles.content}> <div className={styles.content}>
<Typography variant="Title/Subtitle/md"> <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 { .openingHours {
margin-top: var(--Spacing-x1); 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 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 { getIntl } from "@/i18n"
import { translateWellnessType } from "../../../utils" import { translateWellnessType } from "../../../utils"
@@ -15,6 +14,10 @@ export default async function Facility({ data }: FacilityProps) {
const image = data.content.images[0] const image = data.content.images[0]
const ordinaryOpeningTimes = data.openingDetails.openingHours.ordinary const ordinaryOpeningTimes = data.openingDetails.openingHours.ordinary
const weekendOpeningTimes = data.openingDetails.openingHours.weekends 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 ( return (
<div className={styles.content}> <div className={styles.content}>
@@ -28,50 +31,61 @@ export default async function Facility({ data }: FacilityProps) {
/> />
)} )}
<div className={styles.information}> <div className={styles.information}>
<Subtitle color="burgundy" asChild type="one"> <Typography variant="Title/Subtitle/lg" className={styles.title}>
<Title level="h3">{translateWellnessType(data.type, intl)}</Title> <h3>{translateWellnessType(data.type, intl)}</h3>
</Subtitle> </Typography>
<div> {!isExternalGym ? (
<Subtitle type="two" color="uiTextHighContrast"> <div>
{intl.formatMessage({ <Typography variant="Title/Subtitle/md">
defaultMessage: "Opening hours", <h4>
})} {intl.formatMessage({
</Subtitle> defaultMessage: "Opening hours",
<div className={styles.openingHours}> })}
<Body color="uiTextHighContrast"> </h4>
{ordinaryOpeningTimes.alwaysOpen </Typography>
? intl.formatMessage({ <Typography variant="Body/Paragraph/mdRegular">
defaultMessage: "Monday–Friday: Always open", <div className={styles.openingHours}>
}) <p>
: intl.formatMessage( {ordinaryOpeningTimes.alwaysOpen
{ ? intl.formatMessage({
defaultMessage: defaultMessage: "Monday–Friday: Always open",
"Monday–Friday: {openingTime}–{closingTime}", })
}, : intl.formatMessage(
{ {
openingTime: ordinaryOpeningTimes.openingTime, defaultMessage:
closingTime: ordinaryOpeningTimes.closingTime, "Monday–Friday: {openingTime}–{closingTime}",
} },
)} {
</Body> openingTime: ordinaryOpeningTimes.openingTime,
<Body color="uiTextHighContrast"> closingTime: ordinaryOpeningTimes.closingTime,
{weekendOpeningTimes.alwaysOpen }
? intl.formatMessage({ )}
defaultMessage: "Saturday–Sunday: Always open", </p>
}) <p>
: intl.formatMessage( {weekendOpeningTimes.alwaysOpen
{ ? intl.formatMessage({
defaultMessage: defaultMessage: "Saturday–Sunday: Always open",
"Saturday–Sunday: {openingTime}–{closingTime}", })
}, : intl.formatMessage(
{ {
openingTime: weekendOpeningTimes.openingTime, defaultMessage:
closingTime: weekendOpeningTimes.closingTime, "Saturday–Sunday: {openingTime}–{closingTime}",
} },
)} {
</Body> openingTime: weekendOpeningTimes.openingTime,
closingTime: weekendOpeningTimes.closingTime,
}
)}
</p>
</div>
</Typography>
</div> </div>
</div> ) : null}
{shortDescription ? (
<Typography variant="Body/Paragraph/mdRegular">
<p>{shortDescription}</p>
</Typography>
) : null}
</div> </div>
</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 ButtonLink from "@/components/ButtonLink"
import Link from "@/components/TempDesignSystem/Link"
import SidePeek from "@/components/TempDesignSystem/SidePeek" import SidePeek from "@/components/TempDesignSystem/SidePeek"
import { getIntl } from "@/i18n" import { getIntl } from "@/i18n"
@@ -32,25 +31,27 @@ export default async function WellnessAndExerciseSidePeek({
{(spaPage || wellnessExercisePageUrl) && ( {(spaPage || wellnessExercisePageUrl) && (
<div className={styles.buttonContainer}> <div className={styles.buttonContainer}>
{spaPage && ( {spaPage && (
<Button fullWidth theme="base" intent="tertiary" asChild> <ButtonLink
<Link weight="bold" href={spaPage.url}> href={spaPage.url}
{spaPage.buttonCTA} variant="Tertiary"
</Link> color="Primary"
</Button> typography="Body/Paragraph/mdBold"
>
{spaPage.buttonCTA}
</ButtonLink>
)} )}
{wellnessExercisePageUrl && ( {wellnessExercisePageUrl && (
<Button fullWidth theme="base" intent="secondary" asChild> <ButtonLink
<Link href={`/${wellnessExercisePageUrl}`}
href={`/${wellnessExercisePageUrl}`} color="Primary"
weight="bold" variant="Secondary"
color="burgundy" typography="Body/Paragraph/mdBold"
appendToCurrentPath appendToCurrentPath
> >
{intl.formatMessage({ {intl.formatMessage({
defaultMessage: "Show Gym & Wellness", defaultMessage: "Show Gym & Wellness",
})} })}
</Link> </ButtonLink>
</Button>
)} )}
</div> </div>
)} )}