improve website design

pyrossh · May 3, 2024 · 17cca97 · 17cca97
1 parent 773dcda
commit 17cca97
Show file tree

Hide file tree

Showing 14 changed files with 5,159 additions and 4,689 deletions.
diff --git a/website/package-lock.json b/website/package-lock.json
diff --git a/website/package.json b/website/package.json
@@ -1,37 +1,39 @@
 {
-	"name": "website",
-	"version": "0.0.1",
-	"private": true,
-	"scripts": {
-		"dev": "vite dev",
-		"build": "vite build",
-		"preview": "vite preview",
-		"check": "svelte-kit sync && svelte-check --tsconfig ./jsconfig.json",
-		"check:watch": "svelte-kit sync && svelte-check --tsconfig ./jsconfig.json --watch",
-		"lint": "prettier --check . && eslint .",
-		"format": "prettier --write ."
-	},
-	"devDependencies": {
-		"@sveltejs/adapter-static": "^3.0.1",
-		"@sveltejs/kit": "^2.0.0",
-		"@types/eslint": "^8.56.0",
-		"@unocss/extractor-svelte": "^0.59.4",
-		"@unocss/preset-typography": "^0.59.4",
-		"@unocss/transformer-directives": "^0.59.4",
-		"@unocss/transformer-variant-group": "^0.59.4",
-		"eslint": "^8.56.0",
-		"eslint-config-prettier": "^9.1.0",
-		"eslint-plugin-svelte": "^2.35.1",
-		"prettier": "^3.1.1",
-		"prettier-plugin-svelte": "^3.1.2",
-		"svelte": "^4.2.7",
-		"svelte-check": "^3.6.0",
-		"typescript": "^5.0.0",
-		"vite": "^5.0.3"
-	},
-	"type": "module",
-	"dependencies": {
-		"@unocss/reset": "^0.59.4",
-		"unocss": "^0.59.4"
-	}
+  "name": "website",
+  "version": "0.0.1",
+  "private": true,
+  "scripts": {
+    "dev": "vite dev",
+    "build": "vite build",
+    "preview": "vite preview",
+    "check": "svelte-kit sync && svelte-check --tsconfig ./jsconfig.json",
+    "check:watch": "svelte-kit sync && svelte-check --tsconfig ./jsconfig.json --watch",
+    "lint": "prettier --check . && eslint .",
+    "format": "prettier --write ."
+  },
+  "devDependencies": {
+    "@sveltejs/adapter-static": "^3.0.1",
+    "@sveltejs/kit": "^2.0.0",
+    "@tailwindcss/typography": "^0.5.13",
+    "@types/eslint": "^8.56.0",
+    "autoprefixer": "^10.4.19",
+    "eslint": "^8.56.0",
+    "eslint-config-prettier": "^9.1.0",
+    "eslint-plugin-svelte": "^2.35.1",
+    "flowbite": "^2.3.0",
+    "flowbite-svelte": "^0.46.1",
+    "flowbite-svelte-icons": "^1.6.0",
+    "postcss": "^8.4.38",
+    "prettier": "^3.1.1",
+    "prettier-plugin-svelte": "^3.1.2",
+    "svelte": "^4.2.7",
+    "svelte-check": "^3.6.0",
+    "tailwindcss": "^3.4.3",
+    "typescript": "^5.0.0",
+    "vite": "^5.0.3"
+  },
+  "type": "module",
+  "dependencies": {
+    "preline": "^2.1.0"
+  }
 }
diff --git a/website/postcss.config.js b/website/postcss.config.js
@@ -0,0 +1,6 @@
+export default {
+  plugins: {
+    tailwindcss: {},
+    autoprefixer: {},
+  },
+}
diff --git a/website/src/app.css b/website/src/app.css
@@ -0,0 +1,3 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
diff --git a/website/src/app.html b/website/src/app.html
@@ -1,5 +1,5 @@
 <!doctype html>
-<html lang="en" class="min-h-full h-full">
+<html lang="en" class="w-full h-full">
 
 <head>
   <meta charset="utf-8" />
@@ -8,14 +8,11 @@
   %sveltekit.head%
 </head>
 
-<body data-sveltekit-preload-data="hover"
-  class="font-sans leading-normal tracking-normal text-gray-900 bg-white flex h-full">
-  <div style="display: contents">
-    <div class="max-w-[50rem] flex flex-col mx-auto size-full">
-      %sveltekit.body%
-    </div>
-  </div>
+<body data-sveltekit-preload-data="hover" class="w-full h-full">
+  <div class="w-full h-full" style="display: contents">
+    %sveltekit.body%
   </div>
+  <script src="./node_modules/preline/dist/preline.js"></script>
 </body>
 
 </html>
diff --git a/website/src/routes/+layout.svelte b/website/src/routes/+layout.svelte
@@ -0,0 +1,18 @@
+<script>
+	import { afterNavigate } from '$app/navigation';
+	import '../app.css';
+
+	afterNavigate(() => {
+		window.HSStaticMethods.autoInit();
+	});
+</script>
+
+<div class="prose mx-auto">
+	<slot />
+</div>
+
+<style lang="postcss">
+	:global(html) {
+		background-color: #482929;
+	}
+</style>