Back link

---
type Props = {
  href: string;
  class?: string;
};

const { href, class: className } = Astro.props;
---

<a
  href={href}
  class:list={[
    "inline-flex items-center gap-1 font-pixel text-xs uppercase no-underline transition-colors duration-150 hover:text-ph-purple sm:text-sm dark:hover:text-ph-yellow",
    className,
  ]}
>
  <span aria-hidden="true">&lt;&lt;</span>
  <slot />
</a>

import type { ReactNode } from "react";
import { cn } from "./cn";

export function BackLink({ href, children, className }: { href: string; children: ReactNode; className?: string }) {
  return (
    <a
      href={href}
      className={cn(
        "inline-flex items-center gap-1 font-pixel text-xs uppercase no-underline transition-colors duration-150 hover:text-ph-purple sm:text-sm dark:hover:text-ph-yellow",
        className,
      )}
    >
      <span aria-hidden="true">&lt;&lt;</span>
      {children}
    </a>
  );
}

export const cn = (...parts: (string | false | null | undefined)[]) => parts.filter(Boolean).join(" ");