50 lines
1.2 KiB
TypeScript
50 lines
1.2 KiB
TypeScript
import Link from "next/link"
|
|
|
|
import Image from "@/components/Image"
|
|
import Title from "@/components/Title"
|
|
|
|
import styles from "./shortcuts.module.css"
|
|
|
|
import type { ShortcutsProps } from "@/types/components/myPages/myPage/shortcuts"
|
|
|
|
export default function Shortcuts({
|
|
shortcuts,
|
|
title,
|
|
subtitle,
|
|
}: ShortcutsProps) {
|
|
return (
|
|
<section className={styles.shortcuts}>
|
|
<header className={styles.header}>
|
|
<Title
|
|
as="h3"
|
|
level="h2"
|
|
weight={"medium"}
|
|
className={styles.title}
|
|
uppercase
|
|
>
|
|
{title}
|
|
</Title>
|
|
<p className={styles.subtitle}>{subtitle}</p>
|
|
</header>
|
|
<section className={styles.links}>
|
|
{shortcuts.map((shortcut) => (
|
|
<Link
|
|
className={styles.link}
|
|
href={shortcut.url}
|
|
key={shortcut.title}
|
|
target={shortcut.openInNewTab ? "_blank" : undefined}
|
|
>
|
|
<span>{shortcut.text ? shortcut.text : shortcut.title}</span>
|
|
<Image
|
|
alt="Chevron Icon"
|
|
height={20}
|
|
src="/_static/icons/chevron.svg"
|
|
width={20}
|
|
/>
|
|
</Link>
|
|
))}
|
|
</section>
|
|
</section>
|
|
)
|
|
}
|