Added an Icon Library and setup Landing page

package-lock.json

@@ -9,11 +9,12 @@
 			"version": "0.0.1",
 			"devDependencies": {
 				"@eslint/compat": "^1.2.3",
+				"@iconify/json": "^2.2.293",
 				"@skeletonlabs/skeleton": "^2.10.4",
 				"@skeletonlabs/tw-plugin": "^0.4.0",
 				"@sveltejs/adapter-auto": "^3.0.0",
 				"@sveltejs/kit": "^2.0.0",
-				"@sveltejs/vite-plugin-svelte": "^4.0.0",
+				"@sveltejs/vite-plugin-svelte": "^4.0.4",
 				"autoprefixer": "^10.4.20",
 				"eslint": "^9.7.0",
 				"eslint-config-prettier": "^9.1.0",
@@ -24,6 +25,7 @@
 				"prettier-plugin-tailwindcss": "^0.6.5",
 				"svelte": "^5.0.0",
 				"tailwindcss": "^3.4.9",
+				"unplugin-icons": "^22.0.0",
 				"vite": "^5.4.11"
 			}
 		},
@@ -54,6 +56,30 @@
 				"node": ">=6.0.0"
 			}
 		},
+		"node_modules/@antfu/install-pkg": {
+			"version": "0.5.0",
+			"resolved": "https://registry.npmjs.org/@antfu/install-pkg/-/install-pkg-0.5.0.tgz",
+			"integrity": "sha512-dKnk2xlAyC7rvTkpkHmu+Qy/2Zc3Vm/l8PtNyIOGDBtXPY3kThfU4ORNEp3V7SXw5XSOb+tOJaUYpfquPzL/Tg==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"package-manager-detector": "^0.2.5",
+				"tinyexec": "^0.3.1"
+			},
+			"funding": {
+				"url": "https://github.com/sponsors/antfu"
+			}
+		},
+		"node_modules/@antfu/utils": {
+			"version": "0.7.10",
+			"resolved": "https://registry.npmjs.org/@antfu/utils/-/utils-0.7.10.tgz",
+			"integrity": "sha512-+562v9k4aI80m1+VuMHehNJWLOFjBnXn3tdOitzD0il5b7smkSBal4+a3oKiQTbrwMmN/TBUMDvbdoWDehgOww==",
+			"dev": true,
+			"license": "MIT",
+			"funding": {
+				"url": "https://github.com/sponsors/antfu"
+			}
+		},
 		"node_modules/@esbuild/aix-ppc64": {
 			"version": "0.21.5",
 			"resolved": "https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.21.5.tgz",
@@ -669,6 +695,55 @@
 				"url": "https://github.com/sponsors/nzakas"
 			}
 		},
+		"node_modules/@iconify/json": {
+			"version": "2.2.293",
+			"resolved": "https://registry.npmjs.org/@iconify/json/-/json-2.2.293.tgz",
+			"integrity": "sha512-eMRJNfQa+MXmE7I9noABNSVPxwsCkgmfgzeh84IKS2Su1cdQhi5FtsZa6YjEXK8y1cpbfv6pYk7KKJ6fV3mvOw==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"@iconify/types": "*",
+				"pathe": "^1.1.2"
+			}
+		},
+		"node_modules/@iconify/types": {
+			"version": "2.0.0",
+			"resolved": "https://registry.npmjs.org/@iconify/types/-/types-2.0.0.tgz",
+			"integrity": "sha512-+wluvCrRhXrhyOmRDJ3q8mux9JkKy5SJ/v8ol2tu4FVjyYvtEzkc/3pK15ET6RKg4b4w4BmTk1+gsCUhf21Ykg==",
+			"dev": true,
+			"license": "MIT"
+		},
+		"node_modules/@iconify/utils": {
+			"version": "2.2.1",
+			"resolved": "https://registry.npmjs.org/@iconify/utils/-/utils-2.2.1.tgz",
+			"integrity": "sha512-0/7J7hk4PqXmxo5PDBDxmnecw5PxklZJfNjIVG9FM0mEfVrvfudS22rYWsqVk6gR3UJ/mSYS90X4R3znXnqfNA==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"@antfu/install-pkg": "^0.4.1",
+				"@antfu/utils": "^0.7.10",
+				"@iconify/types": "^2.0.0",
+				"debug": "^4.4.0",
+				"globals": "^15.13.0",
+				"kolorist": "^1.8.0",
+				"local-pkg": "^0.5.1",
+				"mlly": "^1.7.3"
+			}
+		},
+		"node_modules/@iconify/utils/node_modules/@antfu/install-pkg": {
+			"version": "0.4.1",
+			"resolved": "https://registry.npmjs.org/@antfu/install-pkg/-/install-pkg-0.4.1.tgz",
+			"integrity": "sha512-T7yB5QNG29afhWVkVq7XeIMBa5U/vs9mX69YqayXypPRmYzUmzwnYltplHmPtZ4HPCn+sQKeXW8I47wCbuBOjw==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"package-manager-detector": "^0.2.0",
+				"tinyexec": "^0.3.0"
+			},
+			"funding": {
+				"url": "https://github.com/sponsors/antfu"
+			}
+		},
 		"node_modules/@isaacs/cliui": {
 			"version": "8.0.2",
 			"resolved": "https://registry.npmjs.org/@isaacs/cliui/-/cliui-8.0.2.tgz",
@@ -1591,6 +1666,13 @@
 			"dev": true,
 			"license": "MIT"
 		},
+		"node_modules/confbox": {
+			"version": "0.1.8",
+			"resolved": "https://registry.npmjs.org/confbox/-/confbox-0.1.8.tgz",
+			"integrity": "sha512-RMtmw0iFkeR4YV+fUOSucriAQNb9g8zFR52MWCtl+cCZOFRNL6zeB395vPzFhEjjn4fMxXudmELnl/KF/WrK6w==",
+			"dev": true,
+			"license": "MIT"
+		},
 		"node_modules/cookie": {
 			"version": "0.6.0",
 			"resolved": "https://registry.npmjs.org/cookie/-/cookie-0.6.0.tgz",
@@ -2518,6 +2600,13 @@
 			"dev": true,
 			"license": "MIT"
 		},
+		"node_modules/kolorist": {
+			"version": "1.8.0",
+			"resolved": "https://registry.npmjs.org/kolorist/-/kolorist-1.8.0.tgz",
+			"integrity": "sha512-Y+60/zizpJ3HRH8DCss+q95yr6145JXZo46OTpFvDZWLfRCE4qChOyk1b26nMaNpfHHgxagk9dXT5OP0Tfe+dQ==",
+			"dev": true,
+			"license": "MIT"
+		},
 		"node_modules/levn": {
 			"version": "0.4.1",
 			"resolved": "https://registry.npmjs.org/levn/-/levn-0.4.1.tgz",
@@ -2549,6 +2638,23 @@
 			"dev": true,
 			"license": "MIT"
 		},
+		"node_modules/local-pkg": {
+			"version": "0.5.1",
+			"resolved": "https://registry.npmjs.org/local-pkg/-/local-pkg-0.5.1.tgz",
+			"integrity": "sha512-9rrA30MRRP3gBD3HTGnC6cDFpaE1kVDWxWgqWJUN0RvDNAo+Nz/9GxB+nHOH0ifbVFy0hSA1V6vFDvnx54lTEQ==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"mlly": "^1.7.3",
+				"pkg-types": "^1.2.1"
+			},
+			"engines": {
+				"node": ">=14"
+			},
+			"funding": {
+				"url": "https://github.com/sponsors/antfu"
+			}
+		},
 		"node_modules/locate-character": {
 			"version": "3.0.0",
 			"resolved": "https://registry.npmjs.org/locate-character/-/locate-character-3.0.0.tgz",
@@ -2643,6 +2749,19 @@
 				"node": ">=16 || 14 >=14.17"
 			}
 		},
+		"node_modules/mlly": {
+			"version": "1.7.3",
+			"resolved": "https://registry.npmjs.org/mlly/-/mlly-1.7.3.tgz",
+			"integrity": "sha512-xUsx5n/mN0uQf4V548PKQ+YShA4/IW0KI1dZhrNrPCLG+xizETbHTkOa1f8/xut9JRPp8kQuMnz0oqwkTiLo/A==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"acorn": "^8.14.0",
+				"pathe": "^1.1.2",
+				"pkg-types": "^1.2.1",
+				"ufo": "^1.5.4"
+			}
+		},
 		"node_modules/mri": {
 			"version": "1.2.0",
 			"resolved": "https://registry.npmjs.org/mri/-/mri-1.2.0.tgz",
@@ -2812,6 +2931,13 @@
 			"dev": true,
 			"license": "BlueOak-1.0.0"
 		},
+		"node_modules/package-manager-detector": {
+			"version": "0.2.8",
+			"resolved": "https://registry.npmjs.org/package-manager-detector/-/package-manager-detector-0.2.8.tgz",
+			"integrity": "sha512-ts9KSdroZisdvKMWVAVCXiKqnqNfXz4+IbrBG8/BWx/TR5le+jfenvoBuIZ6UWM9nz47W7AbD9qYfAwfWMIwzA==",
+			"dev": true,
+			"license": "MIT"
+		},
 		"node_modules/parent-module": {
 			"version": "1.0.1",
 			"resolved": "https://registry.npmjs.org/parent-module/-/parent-module-1.0.1.tgz",
@@ -2869,6 +2995,13 @@
 				"url": "https://github.com/sponsors/isaacs"
 			}
 		},
+		"node_modules/pathe": {
+			"version": "1.1.2",
+			"resolved": "https://registry.npmjs.org/pathe/-/pathe-1.1.2.tgz",
+			"integrity": "sha512-whLdWMYL2TwI08hn8/ZqAbrVemu0LNaNNJZX73O6qaIdCTfXutsLhMkjdENX0qhsQ9uIimo4/aQOmXkoon2nDQ==",
+			"dev": true,
+			"license": "MIT"
+		},
 		"node_modules/picocolors": {
 			"version": "1.1.1",
 			"resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.1.1.tgz",
@@ -2909,6 +3042,18 @@
 				"node": ">= 6"
 			}
 		},
+		"node_modules/pkg-types": {
+			"version": "1.3.0",
+			"resolved": "https://registry.npmjs.org/pkg-types/-/pkg-types-1.3.0.tgz",
+			"integrity": "sha512-kS7yWjVFCkIw9hqdJBoMxDdzEngmkr5FXeWZZfQ6GoYacjVnsW6l2CcYW/0ThD0vF4LPJgVYnrg4d0uuhwYQbg==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"confbox": "^0.1.8",
+				"mlly": "^1.7.3",
+				"pathe": "^1.1.2"
+			}
+		},
 		"node_modules/postcss": {
 			"version": "8.4.49",
 			"resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.49.tgz",
@@ -3868,6 +4013,13 @@
 				"globrex": "^0.1.2"
 			}
 		},
+		"node_modules/tinyexec": {
+			"version": "0.3.2",
+			"resolved": "https://registry.npmjs.org/tinyexec/-/tinyexec-0.3.2.tgz",
+			"integrity": "sha512-KQQR9yN7R5+OSwaK0XQoj22pwHoTlgYqmUscPYoknOoWCWfj/5/ABTMRi69FrKU5ffPVh5QcFikpWJI/P1ocHA==",
+			"dev": true,
+			"license": "MIT"
+		},
 		"node_modules/to-regex-range": {
 			"version": "5.0.1",
 			"resolved": "https://registry.npmjs.org/to-regex-range/-/to-regex-range-5.0.1.tgz",
@@ -3911,6 +4063,74 @@
 				"node": ">= 0.8.0"
 			}
 		},
+		"node_modules/ufo": {
+			"version": "1.5.4",
+			"resolved": "https://registry.npmjs.org/ufo/-/ufo-1.5.4.tgz",
+			"integrity": "sha512-UsUk3byDzKd04EyoZ7U4DOlxQaD14JUKQl6/P7wiX4FNvUfm3XL246n9W5AmqwW5RSFJ27NAuM0iLscAOYUiGQ==",
+			"dev": true,
+			"license": "MIT"
+		},
+		"node_modules/unplugin": {
+			"version": "2.1.2",
+			"resolved": "https://registry.npmjs.org/unplugin/-/unplugin-2.1.2.tgz",
+			"integrity": "sha512-Q3LU0e4zxKfRko1wMV2HmP8lB9KWislY7hxXpxd+lGx0PRInE4vhMBVEZwpdVYHvtqzhSrzuIfErsob6bQfCzw==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"acorn": "^8.14.0",
+				"webpack-virtual-modules": "^0.6.2"
+			},
+			"engines": {
+				"node": ">=18.12.0"
+			}
+		},
+		"node_modules/unplugin-icons": {
+			"version": "22.0.0",
+			"resolved": "https://registry.npmjs.org/unplugin-icons/-/unplugin-icons-22.0.0.tgz",
+			"integrity": "sha512-+1jIt2wynxL+GISehNok8MIb9RaCufIZCHJs0HKbxOljJL9m4NtOhva+dZhNtSKtfQ62Hwd/RRbniSVuuD4Xow==",
+			"dev": true,
+			"license": "MIT",
+			"dependencies": {
+				"@antfu/install-pkg": "^0.5.0",
+				"@antfu/utils": "^0.7.10",
+				"@iconify/utils": "^2.2.1",
+				"debug": "^4.4.0",
+				"kolorist": "^1.8.0",
+				"local-pkg": "^0.5.1",
+				"unplugin": "^2.1.0"
+			},
+			"funding": {
+				"url": "https://github.com/sponsors/antfu"
+			},
+			"peerDependencies": {
+				"@svgr/core": ">=7.0.0",
+				"@svgx/core": "^1.0.1",
+				"@vue/compiler-sfc": "^3.0.2 || ^2.7.0",
+				"svelte": "^3.0.0 || ^4.0.0 || ^5.0.0",
+				"vue-template-compiler": "^2.6.12",
+				"vue-template-es2015-compiler": "^1.9.0"
+			},
+			"peerDependenciesMeta": {
+				"@svgr/core": {
+					"optional": true
+				},
+				"@svgx/core": {
+					"optional": true
+				},
+				"@vue/compiler-sfc": {
+					"optional": true
+				},
+				"svelte": {
+					"optional": true
+				},
+				"vue-template-compiler": {
+					"optional": true
+				},
+				"vue-template-es2015-compiler": {
+					"optional": true
+				}
+			}
+		},
 		"node_modules/update-browserslist-db": {
 			"version": "1.1.2",
 			"resolved": "https://registry.npmjs.org/update-browserslist-db/-/update-browserslist-db-1.1.2.tgz",
@@ -4038,6 +4258,13 @@
 				}
 			}
 		},
+		"node_modules/webpack-virtual-modules": {
+			"version": "0.6.2",
+			"resolved": "https://registry.npmjs.org/webpack-virtual-modules/-/webpack-virtual-modules-0.6.2.tgz",
+			"integrity": "sha512-66/V2i5hQanC51vBQKPH4aI8NMAcBW59FVBs+rC7eGHupMyfn34q7rZIE+ETlJ+XTevqfUhVVBgSUNSW2flEUQ==",
+			"dev": true,
+			"license": "MIT"
+		},
 		"node_modules/which": {
 			"version": "2.0.2",
 			"resolved": "https://registry.npmjs.org/which/-/which-2.0.2.tgz",

package.json

@@ -12,11 +12,12 @@
 	},
 	"devDependencies": {
 		"@eslint/compat": "^1.2.3",
+		"@iconify/json": "^2.2.293",
 		"@skeletonlabs/skeleton": "^2.10.4",
 		"@skeletonlabs/tw-plugin": "^0.4.0",
 		"@sveltejs/adapter-auto": "^3.0.0",
 		"@sveltejs/kit": "^2.0.0",
-		"@sveltejs/vite-plugin-svelte": "^4.0.0",
+		"@sveltejs/vite-plugin-svelte": "^4.0.4",
 		"autoprefixer": "^10.4.20",
 		"eslint": "^9.7.0",
 		"eslint-config-prettier": "^9.1.0",
@@ -27,6 +28,7 @@
 		"prettier-plugin-tailwindcss": "^0.6.5",
 		"svelte": "^5.0.0",
 		"tailwindcss": "^3.4.9",
+		"unplugin-icons": "^22.0.0",
 		"vite": "^5.4.11"
 	}
 }

src/app.html

@@ -10,3 +10,22 @@
 		<div style="display: contents">%sveltekit.body%</div>
 	</body>
 </html>
+
+<style>
+	html,
+	body {
+		@apply h-full;
+	}
+	body {
+		background-image: radial-gradient(
+				at 0% 0%,
+				rgba(var(--color-secondary-500) / 0.33) 0px,
+				transparent 50%
+			),
+			radial-gradient(at 98% 1%, rgba(var(--color-error-500) / 0.33) 0px, transparent 50%);
+		background-attachment: fixed;
+		background-position: center;
+		background-repeat: no-repeat;
+		background-size: cover;
+	}
+</style>

src/lib/components/Header.svelte

@@ -0,0 +1,32 @@
+<script>
+	import Hero from '$lib/components/Hero.svelte';
+	import { LightSwitch } from '@skeletonlabs/skeleton';
+	import ArrowDown from '~icons/material-symbols/keyboard-double-arrow-down-rounded';
+	import { crossfade, fade, fly } from 'svelte/transition';
+	import { onMount } from 'svelte';
+
+	let isAtTop = true;
+
+  onMount(() => {
+    const handleScroll = () => {
+      isAtTop = window.scrollY === 0;
+    };
+
+    window.addEventListener('scroll', handleScroll);
+    return () => window.removeEventListener('scroll', handleScroll);
+  });
+</script>
+
+<header class="align-center flex h-screen flex-col justify-between p-4">
+  <div class=""></div>
+  <Hero></Hero>
+  <div 
+    class="transition-all duration-300 text-xl self-center ease-in-out relative"
+    style="transform: translateX({isAtTop ? '0px' : '-200px'})"
+    class:opacity-0={!isAtTop}
+  >
+    <div class="animate-bounce">
+      <ArrowDown></ArrowDown>
+    </div>
+  </div>
+</header>

src/lib/components/Hero.svelte

@@ -1,4 +1,4 @@
-<div class="" id="hero">
+<div class="text-center h-max self-center" id="hero">
-  <h1 class="text-4xl">Backwards Development</h1>
+  <h1 class="text-6xl">Backwards Development</h1>
-  <h4>Software, Scripts, Discord Bots, and Mods</h4>
+  <h4 class="text-2xl">Software, Scripts, Discord Bots, and Mods</h4>
 </div>

src/routes/+page.svelte

@@ -1,8 +1,108 @@
 <script>
-	import Hero from "$lib/components/Hero.svelte";
+	import Header from "$lib/components/Header.svelte";
-  import { LightSwitch } from "@skeletonlabs/skeleton";
 
 </script>
 
-<Hero></Hero>
+<Header></Header>
-<LightSwitch></LightSwitch>
+<p>
+  Lorem ipsum dolor, sit amet consectetur adipisicing elit. Asperiores consequuntur totam nemo voluptatum esse? Maiores modi animi distinctio unde temporibus eius possimus id rem quos, iste cupiditate repellat maxime at!
+  Harum cum libero illum eius doloremque reiciendis incidunt consequuntur eum dolor temporibus accusantium quasi repellat porro tenetur amet id adipisci magni unde non modi tempore recusandae doloribus, culpa asperiores. Ullam.
+  Dicta voluptatibus voluptas illum aspernatur voluptatum reprehenderit, doloribus maxime tempora, alias veritatis asperiores. Aut, voluptatibus vero! At quas officiis nemo laudantium et quos laborum recusandae eveniet, repellendus in! Corporis, nobis.
+  Fugiat nihil quia veniam. Hic voluptas ex officia? Hic, sed praesentium. Magnam quis, cumque recusandae expedita sequi soluta nesciunt atque! Enim, minima laborum atque maxime accusantium nobis dignissimos doloribus rerum?
+  Non doloribus odit quae fugiat voluptates velit eius error voluptas vel. Autem minus ad adipisci iure temporibus cumque assumenda deserunt, soluta sapiente laborum natus dolorum. Qui dolorem corporis nemo temporibus.
+  Vero non ipsa maxime, voluptate aut deserunt provident voluptatem, iure perspiciatis repellat consectetur, nostrum ut incidunt deleniti! Facilis ipsum, laboriosam quaerat deserunt nam, sunt consectetur eos quas, nisi necessitatibus consequatur!
+  Esse eveniet ipsa alias quam aliquam repellat itaque et odit libero, tempore cupiditate, sunt voluptatum dolor. Non suscipit mollitia aliquid temporibus cum assumenda enim beatae? Ipsum alias tempora nemo error.
+  Delectus autem numquam vel ipsa maiores modi aliquid, odio necessitatibus incidunt nostrum ducimus voluptates harum consequuntur vitae? Eos laudantium blanditiis voluptate atque quod quis consequuntur, cupiditate consequatur aspernatur perspiciatis dolorem.
+  Veniam maiores eveniet aut iure magnam iste illum aliquam doloribus pariatur omnis cupiditate perferendis voluptatum dolores dolorem non, quas eius dignissimos beatae laborum veritatis nobis esse! Repudiandae dicta voluptatum consectetur!
+  Libero, impedit laboriosam delectus iste iure excepturi quam atque nihil obcaecati rem possimus ea necessitatibus unde in alias ex eos modi molestias incidunt dicta aliquam odio nesciunt officia repellendus? Perferendis.
+  Quia sunt alias, minus eum inventore odit nihil esse placeat est officia voluptatibus illum, ab nostrum voluptatum neque fugiat quaerat vel repellendus molestiae rem minima aspernatur et dolorum soluta. Veniam!
+  Molestias atque eaque, in tenetur placeat quam soluta tempore fuga maiores veritatis, facere dolore perspiciatis eveniet, aut sapiente porro fugit reprehenderit fugiat at blanditiis! Vel omnis dolore cum illum accusamus?
+  Facilis repudiandae rerum, qui adipisci optio natus minus, cupiditate unde necessitatibus aspernatur debitis quia ea odio vel. Modi alias est inventore? Iusto quia dolore, cum assumenda est fugiat esse hic!
+  Explicabo autem sapiente voluptas hic quidem enim inventore fuga culpa officiis voluptatem qui quis porro neque laborum, ad distinctio veniam optio? Dolore cumque eius quos cum, adipisci veniam officiis libero.
+  Dignissimos nam fugiat eaque temporibus quisquam iure rem at, error corporis repudiandae magni debitis obcaecati dolores eligendi quas atque voluptatibus eius cumque fugit ipsa assumenda alias magnam facilis? At, amet?
+  Doloremque nulla animi obcaecati omnis voluptatibus natus, mollitia illum. Dignissimos error aut nisi a aperiam molestias voluptates fugit sed, ipsam temporibus. Non eius quasi ullam consequatur odit ipsam inventore obcaecati!
+  Similique tempora exercitationem ea omnis facilis, dolores alias quasi numquam unde at ipsa quia repudiandae reprehenderit harum labore consectetur accusamus quae suscipit dignissimos velit, illum soluta commodi ullam. Laborum, consectetur?
+  Deserunt ad autem sequi atque tempore debitis soluta voluptatum voluptatem nemo sapiente quod laboriosam a modi optio incidunt quae placeat possimus rerum eos voluptatibus, vitae, voluptate repellat porro. Velit, numquam.
+  Id, commodi. Iste animi voluptatem dolorem dicta deserunt quo assumenda, esse corrupti in beatae ipsum tenetur odit rem saepe quod doloribus sequi molestias expedita. Quam doloribus adipisci dolore vero. Fugit.
+  Dolore mollitia voluptatem maxime eius excepturi ratione et! Inventore odio repellendus ex vel aut est accusantium fuga earum. Rerum fuga fugiat, voluptatem voluptatum eaque totam laboriosam ullam sapiente et quos.
+  Saepe sit voluptas sequi repellendus ipsam ad ducimus quae reprehenderit tempore possimus, officia aut quibusdam dolore, similique quam laborum aspernatur corrupti error deleniti minus voluptate. Consequuntur, suscipit qui! Quaerat, commodi.
+  At quod nihil commodi cumque fugit corporis. Sunt, molestias eaque. Fuga eius sapiente eum veritatis ex iste eveniet harum, assumenda tempora ad, libero quidem non architecto recusandae. Accusantium, ullam iusto?
+  Magni, voluptate explicabo. Tempore atque, sed inventore qui voluptas porro nesciunt repellendus amet, assumenda in eaque. Ea aliquam minus delectus dolorum in, animi facere, rem neque, hic aut molestias nihil?
+  Officiis repellat obcaecati, maiores illum ipsum esse debitis quos temporibus recusandae nobis aperiam ex. Sapiente magnam odit quos similique eveniet, blanditiis quam laudantium! Ipsa fuga qui veritatis nesciunt numquam nemo.
+  Alias earum nulla ea quibusdam molestias cupiditate id fugit quos ratione inventore. Tempore culpa, ut aut iste, quam reprehenderit nisi quod fuga, quae accusantium recusandae praesentium sint consectetur. Aut, voluptatibus.
+  Quia, veniam? Voluptates, hic veritatis ullam nemo neque quasi voluptatibus autem minima beatae provident facere fugiat quibusdam recusandae debitis id esse rerum sunt iure architecto magni excepturi, et eos! Nostrum.
+  Nemo repudiandae ducimus eius ipsum explicabo quam deleniti amet asperiores. Dolorem, eveniet! Officia eum blanditiis quia laboriosam consequatur eveniet minima voluptates aliquid? Corrupti tenetur incidunt error impedit cupiditate officia nostrum?
+  Fuga quam neque ullam, quasi quia minus dolorem? Deleniti sunt reprehenderit iusto dolorem adipisci consequatur aperiam sit possimus reiciendis repellendus impedit accusamus excepturi facere molestias, cupiditate cumque distinctio quo unde.
+  Quasi aspernatur ullam pariatur perferendis nostrum ratione doloribus ducimus veniam, tempore accusantium similique, quo dolorem saepe temporibus deserunt odit optio aut rerum, modi quod magnam cupiditate! Iste distinctio quas corrupti?
+  Nostrum dicta, aperiam minima sed sunt sequi reiciendis magnam suscipit perferendis, sit aliquid. At, cumque! Accusamus, sequi eligendi itaque facere autem, ad cumque sed commodi incidunt rem ipsam harum officia.
+  Aliquid, facilis! Fugiat itaque quam illo ex eum labore, at ut reprehenderit sapiente est eos quis ratione ipsam assumenda, non iure laborum! Architecto dignissimos cum porro illum numquam, neque aperiam?
+  Necessitatibus minus sunt accusamus blanditiis, exercitationem ad ipsa eaque illum expedita inventore dolor ut! Minus, asperiores blanditiis! At dolorem consequuntur similique tempora! Omnis quaerat aliquam dolorum quo veniam corrupti cumque!
+  Fuga, facilis rem vitae ratione, neque aliquid nobis cum, sapiente fugiat quae aspernatur soluta quos non iusto esse in quasi maiores eligendi aut accusantium obcaecati! Sed incidunt voluptatum architecto alias.
+  Nostrum maiores libero cumque totam. Consequuntur, optio in vitae eveniet quos quam consequatur. Sed impedit reiciendis, ipsam delectus nulla magnam, consectetur atque consequuntur pariatur necessitatibus ullam aperiam, soluta ratione itaque!
+  Dolore suscipit, nobis voluptates, laborum quos veniam nihil, doloribus aliquid ab alias labore eligendi vitae? Neque culpa dolore vitae quisquam, provident distinctio reprehenderit, fugiat, deserunt fugit tempore voluptatem rerum maiores.
+  Vero hic deleniti, dignissimos cupiditate exercitationem rem nemo officiis perspiciatis distinctio iusto soluta fugiat eos repellendus sed et at aspernatur architecto iste optio maxime obcaecati assumenda quod suscipit. Ad, facilis?
+  Doloremque quae nam minus et error dignissimos animi facilis consequatur, vel veritatis ipsa eos facere sed tempora sunt. Provident, deleniti nihil aperiam vero necessitatibus eum porro inventore quas ratione dolore?
+  Error a ut libero ad at ducimus laudantium necessitatibus repellendus delectus dignissimos eligendi corrupti rem fugit, nisi, dolor nostrum culpa doloribus quo veniam mollitia nam dolore. Consequuntur officia molestias a?
+  Explicabo vero architecto enim unde distinctio expedita. Quibusdam, commodi nemo sapiente aliquid reiciendis delectus quos veniam eligendi deleniti eaque adipisci nam enim sunt nihil dolorem vitae possimus et nobis quae?
+  Alias, commodi eaque omnis ratione a atque debitis facere repellendus modi quo quas veniam sapiente adipisci animi quaerat vel quis dolor tempora perferendis perspiciatis aperiam enim ducimus. Sunt, cumque veritatis.
+  Necessitatibus mollitia esse doloremque delectus maiores velit facilis nostrum. Rem, assumenda dicta cumque repellendus voluptatem deleniti enim magnam voluptate culpa corporis. Saepe asperiores qui provident at obcaecati assumenda, numquam minus?
+  Quod voluptatum pariatur voluptates dolorum unde molestias tempore commodi similique, nulla modi deleniti adipisci ratione ducimus est quia ex velit! Assumenda numquam veniam cumque dolore corrupti reiciendis at ex illum.
+  Eum assumenda nobis ex necessitatibus, distinctio atque itaque adipisci fugit reprehenderit animi! At aliquid eligendi autem dolorum exercitationem veniam earum laboriosam consectetur expedita. Voluptatem sunt iusto repellendus, nam neque magni.
+  Doloremque, tenetur iste neque amet, exercitationem aliquam et voluptatibus culpa, ratione adipisci necessitatibus earum. Recusandae, deleniti. Incidunt saepe corrupti dolorum aspernatur tempora, consequatur magnam omnis cum voluptatem eos. Nihil, incidunt!
+  Repellat, porro. Laborum sit nisi odit voluptatem, quas alias natus doloribus expedita sequi maiores optio exercitationem voluptate blanditiis dignissimos itaque ullam voluptatibus dicta consequuntur minus illum ratione cupiditate doloremque vel.
+  Cumque ab magnam dolor temporibus, iste repudiandae accusantium corrupti, vel quaerat reprehenderit error necessitatibus explicabo? Praesentium quidem omnis esse, veniam recusandae quisquam, ad perspiciatis perferendis placeat corrupti, officia aliquam dolorum?
+  Officiis molestiae possimus nam fuga maiores nesciunt quo. Laboriosam eum illo, facere similique nihil qui fugiat minus provident, illum corporis quo esse temporibus autem possimus veniam aspernatur! Provident, officiis nemo.
+  Eligendi ea harum doloribus ad magnam quae illo deserunt, minima pariatur fugiat aliquid porro laboriosam tempora nulla sed sint excepturi, eum dolorem ducimus, officia culpa exercitationem. Ab voluptatem quia odio.
+  At amet vitae ipsam neque expedita deserunt ab alias sunt eum tempora tempore cupiditate non quaerat, saepe voluptas accusamus numquam dolore quae autem! Dignissimos modi laboriosam velit labore, quibusdam voluptates?
+  Dignissimos consequuntur beatae, quod natus qui provident unde explicabo quam odio magni commodi tempore, modi quisquam ex eos sunt excepturi, possimus ea impedit aliquid inventore delectus. Ab quod doloremque error.
+  Tempora dolores amet temporibus, ipsum accusamus totam soluta ab modi nulla dicta. Hic natus at pariatur adipisci sed molestias eligendi eaque aspernatur, ipsa deserunt magni ratione aperiam, corporis nobis facere?
+  Itaque assumenda voluptatum est laudantium similique necessitatibus nobis, id animi culpa illo maxime consequatur velit labore? Quasi, impedit? Modi voluptatem fugit possimus dolore cumque. Aperiam numquam eius magni ad sed.
+  Quaerat doloribus unde, aliquam debitis minus voluptatibus laborum accusamus voluptatum corrupti nostrum cupiditate ut nemo vero magnam. Minima voluptates omnis officiis distinctio, ratione eos repellendus, asperiores velit perspiciatis explicabo facilis.
+  Maxime, nobis! Aspernatur cumque facilis odit cum, maiores et perferendis delectus asperiores sequi error deleniti quas harum nam non exercitationem minus quam odio deserunt sit ducimus, quae architecto! Maxime, ipsa.
+  Dolorem nam molestias quasi ut temporibus officia, veritatis maiores ipsum molestiae perspiciatis odio saepe vitae similique excepturi possimus obcaecati at, repellendus, pariatur delectus. Sunt iusto cum non possimus, quia voluptatum.
+  Accusamus harum doloremque alias? Esse cum autem cupiditate repellendus doloremque sunt voluptatem vero nulla error possimus. Earum dolorum, ex aperiam veniam error sapiente, quis mollitia sunt cupiditate, vel aspernatur numquam?
+  Soluta ipsa, tempore deleniti aspernatur sunt molestias quod perspiciatis exercitationem quidem dolore illum voluptates suscipit omnis facilis aliquam asperiores nobis itaque ad. Dicta voluptatum deleniti saepe aut adipisci, commodi similique!
+  Tempora officiis sunt reiciendis, dignissimos a ullam impedit error distinctio quisquam nesciunt nobis repellendus amet fugit explicabo id quidem porro natus. Ab voluptatum impedit recusandae consectetur distinctio vitae necessitatibus molestiae?
+  Commodi, libero. Officia voluptates quam fugit sit laudantium maiores accusamus, magni at consequuntur quaerat incidunt quae ducimus saepe, aut aspernatur recusandae eaque voluptate suscipit. Possimus sit ab vitae quas laborum.
+  Neque pariatur dolor vitae quae velit rem nisi, voluptatum laudantium vero illo obcaecati asperiores eaque ipsam earum quo numquam doloribus hic quaerat aliquam, similique atque ut animi aut! Mollitia, labore.
+  Error modi magnam reiciendis, dolores sapiente rerum aperiam voluptatibus a, odio voluptatum maiores! Quis dignissimos molestias obcaecati? Obcaecati voluptatum rerum facilis libero dolore saepe alias aliquam. Voluptatibus ullam rem earum?
+  Corporis, nostrum perspiciatis, quos dignissimos expedita dolorum sit, distinctio aperiam inventore provident perferendis similique assumenda temporibus suscipit laudantium corrupti eos? Assumenda earum fugiat quod labore molestiae iure sit totam excepturi!
+  Magnam quod maiores sunt consectetur temporibus architecto reiciendis reprehenderit voluptates aut! Rerum natus ut delectus voluptas quis earum aliquam. Corrupti, quaerat? Voluptatem atque sunt vero maxime eaque consectetur sequi delectus.
+  Doloribus eveniet dignissimos deserunt maiores labore. Nesciunt voluptatibus vel, non omnis voluptates, necessitatibus repellendus amet architecto commodi dolore excepturi ab laudantium sequi quod. Necessitatibus facere ex saepe nisi. Ipsam, aut.
+  Tempora, libero corporis? Quam perferendis nulla distinctio consectetur fugit suscipit aperiam impedit laboriosam, labore qui adipisci quibusdam earum dicta dignissimos. Optio qui commodi dolorum, voluptates error corporis sapiente alias eveniet!
+  Omnis iste enim perferendis officiis, amet quam voluptatem iure sed libero vitae laboriosam iusto totam aut maxime voluptatum, labore ex. Incidunt quasi nihil ea quidem autem cupiditate! Ipsa, cupiditate provident!
+  Placeat, eum nam! Quam, assumenda itaque. Mollitia modi quos blanditiis? Beatae nesciunt eligendi facilis, pariatur eum hic nulla error sit perferendis quos provident alias in libero aliquam! Rerum, corporis facere.
+  Iure numquam voluptatum cumque laudantium repellendus illo assumenda, quisquam dolorum perspiciatis corporis voluptates, earum quidem rerum odio veniam accusamus vitae recusandae soluta veritatis? Nostrum explicabo deserunt, sed nemo impedit ab.
+  Consectetur perferendis porro beatae ipsum, quis exercitationem deserunt quae qui ducimus libero, error molestiae, magni optio inventore? Voluptate, obcaecati, dolore quidem similique iste modi ratione labore sunt, corporis repudiandae rem.
+  In nihil vero, voluptas omnis dolores laboriosam dicta culpa id! Optio odit cupiditate labore deserunt non, rerum nihil soluta? Temporibus, iure odio? Consequuntur tempore eum tempora ipsum iure rem dolore?
+  Odit, natus aspernatur id adipisci labore provident est sequi itaque alias! Perspiciatis ratione excepturi odit dolores sapiente, nesciunt accusamus itaque fuga. Omnis iste aperiam vel? Nulla aut similique minima harum?
+  Nulla quidem molestias libero, quod aspernatur voluptatem natus quam maxime molestiae ratione quaerat beatae! Cumque voluptate tenetur ipsam. Debitis, ducimus. Molestias distinctio culpa porro obcaecati quas eaque, excepturi ab eligendi!
+  Molestias ab ipsam quae inventore ullam magni est voluptate corrupti placeat cum fugiat veritatis asperiores rem cupiditate odio, debitis qui numquam maiores libero, eligendi, mollitia unde optio ad nisi? Error.
+  Illum, accusamus sequi cumque vel nisi eius sint quaerat unde voluptatum. Veniam, dolorum dolore! Obcaecati, expedita. Deserunt nihil officiis ut quae dolorem placeat facilis, optio aut provident repellendus tempora explicabo?
+  Ratione repudiandae corrupti repellendus, veniam iusto obcaecati nostrum, quam debitis ad architecto similique qui consectetur adipisci voluptatibus inventore incidunt veritatis soluta fugit asperiores. Eligendi veritatis rem explicabo, unde quibusdam ullam.
+  Reiciendis deleniti fugiat, ut voluptate voluptates voluptas et error aliquid consectetur provident impedit necessitatibus ad perferendis veritatis repellendus odio obcaecati architecto eius, eum repudiandae accusamus quidem quaerat sit ipsum. Quae!
+  Id repellat provident ratione illo rem itaque reprehenderit, error eveniet at, recusandae possimus nulla perferendis saepe voluptas nisi cupiditate impedit dicta optio repudiandae. Delectus quasi hic in dolorum pariatur aut?
+  Nihil facilis neque hic dolorem architecto sapiente unde eum saepe temporibus fugiat earum sequi repellendus porro qui quo iste voluptatibus officiis incidunt, aliquid tempore deleniti dicta mollitia? Perspiciatis, sunt nemo?
+  Saepe consequuntur tempore unde vero sapiente iste esse minus eius magnam accusamus error rem, excepturi sint inventore ducimus molestiae corporis sit! Nihil, sequi omnis! Excepturi in praesentium vero iusto ducimus?
+  Dolores odit aliquam sint sunt dignissimos perspiciatis numquam explicabo est cumque tempora suscipit qui sapiente quibusdam consequatur iste officiis delectus, aperiam iure iusto tenetur voluptate placeat quidem! Earum, ad quod?
+  Repellat sequi, nihil possimus culpa mollitia accusantium itaque quaerat cum aut illum soluta eaque ratione dignissimos, perferendis ipsam unde iste officia nesciunt! Sint labore natus possimus alias quo, reprehenderit laudantium!
+  Dicta molestiae quod dolor repellat voluptatibus rerum labore, magnam consequuntur, minima sapiente, eligendi nam optio fugit incidunt accusantium ipsam id commodi ducimus unde voluptatum vel excepturi? Exercitationem, necessitatibus assumenda! Sint!
+  Eligendi animi cupiditate expedita consectetur voluptate harum, aliquam dicta deleniti nulla esse inventore, vel optio nobis? Veniam aliquid blanditiis labore, odit, quibusdam sit, fugiat perspiciatis odio fugit pariatur possimus in!
+  Quo id cum, eos officiis quam sit voluptatibus asperiores natus quia saepe magnam nobis assumenda magni ipsum voluptatum dolorum dolore, ratione repellendus fuga? Incidunt ipsum minima maiores! Est, eveniet ipsam!
+  Nostrum numquam minima doloribus illum, nobis repudiandae expedita accusantium quasi deleniti consequuntur beatae totam ipsum hic eligendi iste autem, aut, consectetur provident sit vel ullam perspiciatis. Libero eligendi quaerat fugiat.
+  Inventore earum vel accusantium voluptate aliquam ex nobis repellendus accusamus, debitis praesentium molestias quia quidem distinctio sunt ducimus repellat! Sequi eius minus repudiandae, facere sapiente molestias fugit harum dicta facilis?
+  Corporis unde quasi, ea dicta, deleniti aperiam dolore minus rem ratione nihil, praesentium similique maiores alias qui? Quibusdam repellat voluptatem optio ab fuga deleniti. Ducimus totam iste nihil delectus voluptates!
+  Eligendi deleniti molestias culpa architecto eveniet sit reiciendis ducimus aut. Veritatis, dicta! Sint rerum, nostrum dolores iusto dolor quod magnam voluptatibus explicabo, tempore blanditiis, atque nulla illum nihil id aliquam.
+  Nihil quam exercitationem quod dicta voluptas, quidem tenetur sunt illo. Sunt vero, recusandae reprehenderit cumque porro possimus nostrum neque hic, tempora aperiam consequatur nemo laboriosam, culpa repellat. Voluptatem, fugit porro.
+  Sequi repudiandae reiciendis hic quasi. Quasi, magnam laudantium? Ad repellat atque consequuntur odio accusamus sit cupiditate rerum incidunt. Asperiores adipisci praesentium vitae ullam debitis ex, accusamus vel accusantium iusto unde.
+  Iure possimus perferendis nesciunt magni sapiente mollitia odit expedita nam hic deleniti nemo exercitationem provident, culpa atque maiores cumque explicabo. Voluptate voluptates natus veritatis accusantium distinctio sequi eos delectus ab.
+  Iste explicabo tempora ex, laborum quam, blanditiis, eos expedita error dolorum maiores rerum nobis minus fugit corrupti. Accusantium odit temporibus officiis illum. Nesciunt ab velit quo quae magnam cupiditate molestias.
+  Et possimus doloremque quo. Nesciunt provident neque esse obcaecati molestias unde incidunt reprehenderit tempore veniam sapiente numquam consectetur modi exercitationem, dignissimos doloremque laudantium enim delectus dolores pariatur facilis. Cupiditate, assumenda?
+  Maiores enim, veniam iusto quaerat dolorem amet. Repellat mollitia necessitatibus similique omnis, ipsam distinctio, facilis, magni blanditiis atque error amet ea inventore architecto. Facere, libero est. Dicta distinctio dolorum rerum?
+  Magni tempora, quis sapiente deserunt pariatur dolores quae corrupti odio saepe nam ea. Quae vel fugiat maxime dolorem error, fuga totam numquam iure. Ratione ut libero, eaque soluta enim minus.
+  Error ea officiis ducimus rem dolor animi voluptates? Nobis, laudantium minima repudiandae ipsa, modi deleniti dolorum quam ratione quis voluptas nisi similique tempora asperiores mollitia sed voluptatibus, optio maiores ipsam!
+  Ut eaque eveniet porro, odio iusto non facilis ad aliquid tempore adipisci perferendis? Facilis libero quod reprehenderit laboriosam, tenetur, vero accusantium officiis, nesciunt quaerat velit veritatis minima delectus nisi eos!
+  Veritatis dignissimos magni consectetur, nostrum itaque et sed recusandae reprehenderit error enim vitae, sint, voluptatibus omnis at minima tempore! Eius sit similique in consequuntur possimus, veniam ratione delectus voluptas ab.
+  Saepe in quaerat, eius nobis voluptates, corporis distinctio, sed nostrum corrupti vero aliquid amet itaque alias necessitatibus? Asperiores expedita harum libero autem perferendis iure tempore, eveniet tempora dignissimos id saepe.
+  Incidunt commodi earum similique beatae. Dolores minima reprehenderit fugit laboriosam, eum ullam quod unde obcaecati beatae facilis dolore sed totam quibusdam repellat, incidunt, ipsa consectetur nemo aspernatur. Alias, eveniet quis!
+</p>

vite.config.js

@@ -1,6 +1,13 @@
 import { sveltekit } from '@sveltejs/kit/vite';
 import { defineConfig } from 'vite';
+import Icons from 'unplugin-icons/vite'
 
 export default defineConfig({
-	plugins: [sveltekit()]
+	plugins: [
+		sveltekit(),
+		Icons({
+			compiler: 'svelte',
+			autoInstall: true
+		})
+	]
 });