diff --git a/src/components/IconList.svelte b/src/components/IconList.svelte index b2b94a9..300dc4f 100644 --- a/src/components/IconList.svelte +++ b/src/components/IconList.svelte @@ -2,16 +2,29 @@ import Icon from './Icon.svelte' export let links = [] + + function isExternal(link) { + return /^https?\:\/\//.test(link) + } + + $: list = links.map((link) => ({ + ...link, + external: isExternal(link.href), + })) @@ -22,19 +35,20 @@ padding: 0; } - li { + a { transition: transform 200ms ease; padding: 0.75em 0.5em; cursor: pointer; border-radius: 0.5em; + display: block; } - li:hover { + a:hover { box-shadow: 0px 6px 6px -3px #00000012; transform: translateY(0.25em) translateX(0.15em) scale(1.05); } - li :global(.icon) { + a :global(.icon) { transform: translateY(0.3em); font-size: 2em; margin-right: 0.5rem; diff --git a/src/routes/contact.svelte b/src/routes/contact.svelte index a77d01b..e973f31 100644 --- a/src/routes/contact.svelte +++ b/src/routes/contact.svelte @@ -15,6 +15,7 @@ icon: 'logo-github', }, { href: '/privacy', name: 'Privacy Policy', icon: 'finger-print-outline' }, + { href: '/support', name: 'Support', icon: 'heart-sharp' }, ] diff --git a/static/icons/heart-sharp.svg b/static/icons/heart-sharp.svg new file mode 100644 index 0000000..1960ef6 --- /dev/null +++ b/static/icons/heart-sharp.svg @@ -0,0 +1 @@ +Heart \ No newline at end of file