amend

Author: Discusser

components.json

@@ -12,10 +12,10 @@
   },
   "aliases": {
     "components": "$lib/components",
-    "utils": "$lib/lib/utils",
+    "utils": "$lib/utils",
     "ui": "$lib/components/ui",
     "lib": "$lib/lib",
     "hooks": "$lib/hooks"
   },
   "iconLibrary": "lucide"
-}
+}

package.json

@@ -45,11 +45,13 @@
 		"vite": "^5.4.19"
 	},
 	"dependencies": {
+		"@lucide/svelte": "^0.511.0",
 		"@tabler/icons-svelte": "^3.33.0",
 		"@tanstack/table-core": "^8.21.3",
 		"class-variance-authority": "^0.7.1",
 		"lucide-react": "^0.511.0",
 		"path-browserify": "^1.0.1",
-		"tailwindcss-animate": "^1.0.7"
+		"tailwindcss-animate": "^1.0.7",
+		"tw-animate-css": "^1.3.0"
 	}
 }

pnpm-lock.yaml

@@ -1,4 +1,25 @@
 <script lang="ts">
+	import {
+		Card,
+		CardContent,
+		CardDescription,
+		CardFooter,
+		CardHeader,
+		CardTitle
+	} from '$lib/components/ui/card';
 </script>
 
-<div></div>
+<div>
+	<Card>
+		<CardHeader>
+			<CardTitle>Card Title</CardTitle>
+			<CardDescription>Card Description</CardDescription>
+		</CardHeader>
+		<CardContent>
+			<p>Card Content</p>
+		</CardContent>
+		<CardFooter>
+			<p>Card Footer</p>
+		</CardFooter>
+	</Card>
+</div>

src/lib/components/blog/ArticleCard.svelte

@@ -1,9 +1,12 @@
-<script lang="ts"></script>
+<script lang="ts">
+	import ArticleCard from '$lib/components/blog/ArticleCard.svelte';
+</script>
 
 <div class="flex flex-col space-y-4">
 	<p class="text-2xl font-bold text-foreground">Blog</p>
 	<p>
 		For now, this page is empty. I will add articles once I have something interesting to write
 		about.
 	</p>
+	<ArticleCard />
 </div>

src/routes/blog/+page.svelte

@@ -14,7 +14,10 @@ const config = {
 		}),
 		prerender: {
 			handleHttpError: 'warn'
-		}
+		},
+		alias: {
+			"@/*": "./src/lib/*",
+		},
 	}
 };
 

svelte.config.js

@@ -9,7 +9,7 @@
 		"skipLibCheck": true,
 		"sourceMap": true,
 		"strict": true,
-		"moduleResolution": "bundler"
+		"moduleResolution": "bundler",
 	}
 	// Path aliases are handled by https://svelte.dev/docs/kit/configuration#alias
 	// except $lib which is handled by https://svelte.dev/docs/kit/configuration#files