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

Merged in feat/BOOK-61-refactor-hotel-page-css-variables (pull request #3014)

Browse Source 
Feat/BOOK-61 refactor hotel page css variables

* feat(BOOK-61): Breadcrumbs

* feat(BOOK-61): intro section

* feat(BOOK-61): show more button

* feat(BOOK-61): rooms section

* feat(BOOK-61): sidepeeks

* feat(BOOK-61): deprecated old Link component

* feat(BOOK-61): added new TextLink component to the design-system

* feat(BOOK-61): replaced deprecated links with new TextLink component

* feat(BOOK-61): miscellaneous changes


Approved-by: Bianca Widstam
Approved-by: Christel Westerberg
This commit is contained in:
Erik Tiekstra
2025-10-29 09:15:03 +00:00
parent bfe5c5f8bb
commit 333636c81a
122 changed files with 782 additions and 498 deletions
Download Patch File Download Diff File Expand all files Collapse all files

32
apps/scandic-web/components/ContentCard/contentCard.module.css
View File

@@ -1,5 +1,15 @@
.card {
display: grid;
&:hover {
.imageContainer,
.image {
border-radius: var(--Corner-radius-lg);
}
.image {
transform: scale(1.05);
}
}
}
.imageContainer {
@@ -21,34 +31,28 @@
border-radius 0.3s ease-in-out;
}
.card:hover,
.card:hover .imageContainer,
.card:hover .image {
border-radius: var(--Corner-radius-lg);
}
.card:hover .image {
transform: scale(1.05);
}
.promoTag {
position: absolute;
top: 14px;
left: 14px;
text-transform: uppercase;
}
.content {
display: flex;
padding: var(--Spacing-x-one-and-half);
padding: var(--Space-x15);
flex-direction: column;
align-items: flex-start;
gap: var(--Spacing-x-one-and-half);
gap: var(--Space-x15);
align-self: stretch;
}
.link {
text-decoration: none;
color: inherit;
}
@media (min-width: 768px) {
.content {
padding: var(--Spacing-x2) var(--Spacing-x2) var(--Spacing-x2) 0;
padding: var(--Space-x2) var(--Space-x2) var(--Space-x2) 0;
}
}

19
apps/scandic-web/components/ContentCard/index.tsx
View File

@@ -1,8 +1,8 @@
import Body from "@scandic-hotels/design-system/Body"
import NextLink from "next/link"
import Chip from "@scandic-hotels/design-system/Chip"
import Image from "@scandic-hotels/design-system/Image"
import Link from "@scandic-hotels/design-system/Link"
import Subtitle from "@scandic-hotels/design-system/Subtitle"
import { Typography } from "@scandic-hotels/design-system/Typography"
import styles from "./contentCard.module.css"
@@ -46,8 +46,12 @@ export default function ContentCard({
) : null}
</div>
<div className={styles.content}>
<Subtitle type="two">{heading}</Subtitle>
<Body>{bodyText}</Body>
<Typography variant="Title/Subtitle/md">
<h4>{heading}</h4>
</Typography>
<Typography variant="Body/Paragraph/mdRegular">
<p>{bodyText}</p>
</Typography>
</div>
</article>
)
@@ -55,6 +59,7 @@ export default function ContentCard({
if (!link) return card
const linkProps = {
className: styles.link,
...(link.openInNewTab && {
target: "_blank",
rel: "noopener noreferrer",
@@ -62,8 +67,8 @@ export default function ContentCard({
}
return (
<Link href={link.href} {...linkProps}>
<NextLink href={link.href} {...linkProps}>
{card}
</Link>
</NextLink>
)
}