slipnote.app
Built for people who think better out loud.
isaaccorbrey.com
1<script lang="ts">
2 import type { HTMLAnchorAttributes } from "svelte/elements";
3
4 let {
5 children,
6 class: className = "",
7 ...props
8 }: HTMLAnchorAttributes = $props();
9</script>
10
11<a
12 {...props}
13 class="
14 px-4 py-1 font-base inline-block
15 bg-transparent hover:bg-slate-950/7 active:bg-slate-950/15
16 border-s-slate-950 rounded-md
17 shadow-[1px_1px_3px_rgba(15,23,42,0.75)]
18 border-l border-t border-r-4 border-b-4
19 active:border-l-4 active:border-t-4 active:border-r active:border-b
20 active:shadow-[inset_-1px_-1px_3px_rgba(15,23,42,0.75)]
21 focus-visible:outline-none focus-visible:border-blue-700
22 transition-all motion-reduce:transition-none duration-60
23 {className}
24 "
25>
26 {@render children?.()}
27</a>