blob: bb600fb65ac319ef07f5fcbdce9b2c4d4eb21dc9 [file] [log] [blame]
Samuel Shuert86826b82024-04-27 16:14:20 -04001---
2import type { HTMLAttributes } from 'astro/types';
3
4type Props = HTMLAttributes<'a'>;
5
6const { href, class: className, ...props } = Astro.props;
7
8const { pathname } = Astro.url;
9const subpath = pathname.match(/[^\/]+/g);
10const isActive = href === pathname || href === '/' + subpath?.[0];
11---
12
13<a href={href} class:list={[className, { active: isActive }]} {...props}>
14 <slot />
15</a>
16<style>
17 a {
18 display: inline-block;
19 text-decoration: none;
20 }
21 a.active {
22 font-weight: bolder;
23 text-decoration: underline;
24 }
25</style>