bc3233ff64
Feat/SW-196 design fixes * feat(SW-196): Updated copy My credit cards -> My payment cards * fix: update design system version * feat(SW-196): Update Header component to use Preamble instead of Subtitle * feat(SW-196): Minor design fixes Approved-by: Christel Westerberg
38 lines
1.2 KiB
TypeScript
38 lines
1.2 KiB
TypeScript
import { ArrowRightIcon } from "@/components/Icons"
|
|
import SectionContainer from "@/components/Section/Container"
|
|
import SectionHeader from "@/components/Section/Header"
|
|
import Link from "@/components/TempDesignSystem/Link"
|
|
import Body from "@/components/TempDesignSystem/Text/Body"
|
|
|
|
import styles from "./shortcuts.module.css"
|
|
|
|
import type { ShortcutsProps } from "@/types/components/myPages/myPage/shortcuts"
|
|
|
|
export default function Shortcuts({
|
|
firstItem = false,
|
|
shortcuts,
|
|
subtitle,
|
|
title,
|
|
}: ShortcutsProps) {
|
|
return (
|
|
<SectionContainer>
|
|
<SectionHeader preamble={subtitle} title={title} topTitle={firstItem} />
|
|
<section className={styles.links}>
|
|
{shortcuts.map((shortcut) => (
|
|
<Link
|
|
href={shortcut.url}
|
|
key={shortcut.title}
|
|
target={shortcut.openInNewTab ? "_blank" : undefined}
|
|
variant="shortcut"
|
|
>
|
|
<Body textTransform="bold" color="burgundy">
|
|
<span>{shortcut.text ? shortcut.text : shortcut.title}</span>
|
|
</Body>
|
|
<ArrowRightIcon color="burgundy" className={styles.arrowRight} />
|
|
</Link>
|
|
))}
|
|
</section>
|
|
</SectionContainer>
|
|
)
|
|
}
|