Merged in feat/SW-1444-destination-page-add-destination-list-component (pull request #1240)
feat/SW-1444 destination page add destination list component * feat(SW-1444): add list component * feat(SW-1444): add subtitle to accordion * feat(SW-1444): refactor component structure * feat(SW-1444): add desktop breakpoint * feat(SW-1444): fix typo * feat(SW-1444): add props * feat(SW-1444): add query * feat(SW-1444): updated query * feat(SW-1444): display data * feat(SW-1444): fix merge hickup * feat(SW-1444): change var name * feat(SW-1444): remove unsued translations * feat(SW-1444): use country as title * feat(SW-1444): sort hotels in query * feat(SW-1444): make responsive * feat(SW-1444): fetch country url * feat(SW-1444): update logging * feat(SW-1444): remove spread Approved-by: Erik Tiekstra
This commit is contained in:
@@ -9,4 +9,5 @@ export interface AccordionItemProps
|
||||
title: string
|
||||
icon?: IconName
|
||||
trackingId?: string
|
||||
subtitle?: string
|
||||
}
|
||||
|
||||
@@ -22,6 +22,7 @@ export default function AccordionItem({
|
||||
variant,
|
||||
className,
|
||||
trackingId,
|
||||
subtitle,
|
||||
}: AccordionItemProps) {
|
||||
const contentRef = useRef<HTMLDivElement>(null)
|
||||
const detailsRef = useRef<HTMLDetailsElement>(null)
|
||||
@@ -55,9 +56,7 @@ export default function AccordionItem({
|
||||
<li className={accordionItemVariants({ className, variant, theme })}>
|
||||
<details ref={detailsRef} onToggle={toggleAccordion}>
|
||||
<summary className={styles.summary}>
|
||||
{IconComp && (
|
||||
<IconComp className={styles.icon} color="baseTextHighcontrast" />
|
||||
)}
|
||||
{IconComp && <IconComp color="baseTextHighcontrast" />}
|
||||
{variant === "sidepeek" ? (
|
||||
<Subtitle
|
||||
className={styles.title}
|
||||
@@ -67,13 +66,18 @@ export default function AccordionItem({
|
||||
{title}
|
||||
</Subtitle>
|
||||
) : (
|
||||
<Body
|
||||
textTransform="bold"
|
||||
color="baseTextHighContrast"
|
||||
className={styles.title}
|
||||
>
|
||||
{title}
|
||||
</Body>
|
||||
<div className={styles.title}>
|
||||
{subtitle ? (
|
||||
<Subtitle type="two" color="baseTextHighContrast">
|
||||
{title}
|
||||
</Subtitle>
|
||||
) : (
|
||||
<Body textTransform="bold" color="baseTextHighContrast">
|
||||
{title}
|
||||
</Body>
|
||||
)}
|
||||
{subtitle && <Body color="baseTextHighContrast">{subtitle}</Body>}
|
||||
</div>
|
||||
)}
|
||||
<ChevronDownIcon
|
||||
className={styles.chevron}
|
||||
|
||||
Reference in New Issue
Block a user