From d33433eb8fa3bfc00a56b77e583c41c2cc679810 Mon Sep 17 00:00:00 2001
From: AlexBocken <alexander@bocken.org>
Date: Mon, 10 Jul 2023 13:19:35 +0200
Subject: [PATCH] fix some icon animations

---
 src/lib/components/Card.svelte          | 2 +-
 src/lib/components/EditRecipe.svelte    | 1 +
 src/lib/components/IconLayout.svelte    | 4 +++-
 src/lib/components/MediaScroller.svelte | 2 +-
 src/routes/rezepte/icon/+page.svelte    | 4 +++-
 5 files changed, 9 insertions(+), 4 deletions(-)

diff --git a/src/lib/components/Card.svelte b/src/lib/components/Card.svelte
index 4974a70..b540523 100644
--- a/src/lib/components/Card.svelte
+++ b/src/lib/components/Card.svelte
@@ -3,8 +3,8 @@ export let recipe
 export let current_month
 export let icon_override = false;
 export let search = "search_me"
-import "$lib/css/icon.css";
 import "$lib/css/shake.css";
+import "$lib/css/icon.css";
 
 if(icon_override){
 	current_month = recipe.season[0]
diff --git a/src/lib/components/EditRecipe.svelte b/src/lib/components/EditRecipe.svelte
index 7ac7295..43fa203 100644
--- a/src/lib/components/EditRecipe.svelte
+++ b/src/lib/components/EditRecipe.svelte
@@ -3,6 +3,7 @@
 	import Cross from '$lib/assets/icons/Cross.svelte';
 	import SeasonSelect from '$lib/components/SeasonSelect.svelte';
 	import '$lib/css/action_button.css'
+	import '$lib/css/shake.css'
 	import { redirect } from '@sveltejs/kit';
 	import { RecipeModelType } from '../../types/types';
 
diff --git a/src/lib/components/IconLayout.svelte b/src/lib/components/IconLayout.svelte
index 439bcaf..97cfbac 100644
--- a/src/lib/components/IconLayout.svelte
+++ b/src/lib/components/IconLayout.svelte
@@ -14,7 +14,9 @@
 		border-radius: 1000px;
     		box-shadow: 0em 0em 0.5em 0.2em rgba(0, 0, 0, 0.2);
 	}
-	a:hover{
+	a:hover,
+	a:focus-visible
+	{
 		--angle: 15deg;
 		animation: shake 0.5s ease forwards;
 	}
diff --git a/src/lib/components/MediaScroller.svelte b/src/lib/components/MediaScroller.svelte
index e68c2d2..6224960 100644
--- a/src/lib/components/MediaScroller.svelte
+++ b/src/lib/components/MediaScroller.svelte
@@ -1,5 +1,5 @@
 <script>
-import "$lib/components/nordtheme.css"
+import "$lib/css/nordtheme.css"
 export let title
 </script>
 <style>
diff --git a/src/routes/rezepte/icon/+page.svelte b/src/routes/rezepte/icon/+page.svelte
index 51290da..59d0c43 100644
--- a/src/routes/rezepte/icon/+page.svelte
+++ b/src/routes/rezepte/icon/+page.svelte
@@ -17,7 +17,9 @@
 		border-radius: 1000px;
     		box-shadow: 0em 0em 0.5em 0.2em rgba(0, 0, 0, 0.2);
 	}
-	a:hover{
+	a:hover,
+	a:focus-visible
+	{
 		--angle: 15deg;
 		animation: shake 0.5s ease forwards;
 	}