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