Files
homepage/src/lib/components/Icon.svelte

28 lines
587 B
Svelte

<script lang="ts">
import '$lib/css/nordtheme.css';
import "$lib/css/shake.css"
export let icon : string;
</script>
<style>
a{
font-family: "Noto Color Emoji", emoji;
font-size: 2rem;
text-decoration: none;
padding: 0.5em;
background-color: var(--nord4);
border-radius: 1000px;
box-shadow: 0em 0em 0.5em 0.2em rgba(0, 0, 0, 0.2);
}
@media (prefers-color-scheme: dark) {
a{
background-color: var(--accent-dark);
}
}
a:hover{
--angle: 15deg;
animation: shake 0.5s ease forwards;
}
</style>
<a href="/rezepte/icon/{icon}" {...$$restProps} >{icon}</a>