import { ChevronRightIcon, HouseIcon } from "@/components/Icons"
import Footnote from "@/components/TempDesignSystem/Text/Footnote"

import styles from "./breadcrumbs.module.css"

export default function BreadcrumbsSkeleton() {
  return (
    <nav className={styles.breadcrumbs}>
      <ul className={styles.list}>
        <li className={styles.listItem}>
          <span className={styles.homeLink} color="peach80">
            <HouseIcon color="peach80" />
          </span>
          <ChevronRightIcon aria-hidden="true" color="peach80" />
        </li>

        <li className={styles.listItem}>
          <Footnote color="burgundy" type="bold">
            ...
          </Footnote>
        </li>
      </ul>
    </nav>
  )
}