♻️ Organize SVGs components, create svgs folder

src/components/svgs/svgCard.svelte

@@ -6,9 +6,9 @@
   import XIcon from "@lucide/svelte/icons/x";
   import TagIcon from "@lucide/svelte/icons/tag";
   import LinkIcon from "@lucide/svelte/icons/link";
+  import PaletteIcon from "@lucide/svelte/icons/palette";
   import SparklesIcon from "@lucide/svelte/icons/sparkles";
   import BaselineIcon from "@lucide/svelte/icons/baseline";
-  import PaletteIcon from "@lucide/svelte/icons/palette";
   import EllipsisIcon from "@lucide/svelte/icons/ellipsis";
 
   // UI Components:
@@ -17,10 +17,9 @@
   import { Button, buttonVariants } from "@/components/ui/button";
 
   // Components:
-  import CopySvg from "@/components/copySvg.svelte";
+  import CopySvg from "@/components/svgs/copySvg.svelte";
-  import DownloadSvg from "@/components/downloadSvg.svelte";
+  import DownloadSvg from "@/components/svgs/downloadSvg.svelte";
-  import Heart from "@lucide/svelte/icons/heart";
+  import AddToFavorite from "@/components/addToFavorite.svelte";
-  import AddToFavorite from "./addToFavorite.svelte";
 
   // Props:
   interface Props {

src/routes/+page.svelte

@@ -9,8 +9,8 @@
   // Components:
   import Grid from "@/components/grid.svelte";
   import Search from "@/components/search.svelte";
-  import SvgCard from "@/components/svgCard.svelte";
+  import SvgCard from "@/components/svgs/svgCard.svelte";
-  import SortSvgs from "@/components/sortSvgs.svelte";
+  import SortSvgs from "@/components/svgs/sortSvgs.svelte";
   import Container from "@/components/container.svelte";
 
   import PageCard from "@/components/pageCard.svelte";
@@ -105,9 +105,7 @@
     />
   </div>
   <Container className="my-6">
-    <Grid
+    <Grid>
-      className="animate-in fill-mode-backwards fade-in slide-in-from-bottom-4 duration-500"
-    >
       {#each displaySvgs as svg}
         <SvgCard svgInfo={svg} />
       {/each}

src/routes/directory/[category]/+page.svelte

@@ -8,7 +8,7 @@
   // Components:
   import Grid from "@/components/grid.svelte";
   import Search from "@/components/search.svelte";
-  import SvgCard from "@/components/svgCard.svelte";
+  import SvgCard from "@/components/svgs/svgCard.svelte";
   import Container from "@/components/container.svelte";
 
   import PageCard from "@/components/pageCard.svelte";
@@ -116,9 +116,7 @@
     </div>
   </div>
   <Container className="my-6">
-    <Grid
+    <Grid>
-      className="animate-in fill-mode-backwards fade-in slide-in-from-bottom-4 duration-500"
-    >
       {#each filteredSvgs as svg}
         <SvgCard svgInfo={svg} />
       {/each}