feat(Highlight): fix svelte warn (aria-hidden)

fix(remark-include): disable scary codepath
feat: Support implicit index.md in /docs/petal/…/folder
2024-11-24 02:44:36 +02:00 · 2024-11-24 02:26:24 +02:00 · 2024-11-24 02:26:24 +02:00 · 2024-11-24 02:26:24 +02:00 · 2024-11-24 02:26:24 +02:00 · 2024-11-24 02:26:24 +02:00
35 changed files with 770 additions and 112 deletions
--- a/.envrc
+++ b/.envrc
@ -0,0 +1 @@
+use flake
--- a/.gitignore
+++ b/.gitignore
@ -1,4 +1,5 @@
 node_modules
+.petalpkgs

 # Output
 .output
@ -6,6 +7,9 @@ node_modules
 /.svelte-kit
 /build

+# Direnv cache
+/.direnv
+
 # OS
 .DS_Store
 Thumbs.db
--- a/.husky/pre-commit
+++ b/.husky/pre-commit
@ -0,0 +1 @@
+bunx lint-staged
--- a/bun.lockb
+++ b/bun.lockb
--- a/flake.lock
+++ b/flake.lock
@ -34,10 +34,26 @@
        "type": "github"
      }
    },
+    "petalpkgs": {
+      "locked": {
+        "lastModified": 1731150020,
+        "narHash": "sha256-mK7QbLvx6LacoEWnvaf7tjVU8sKcsqpm9PPEuVXXlb4=",
+        "ref": "refs/heads/main",
+        "rev": "09239e085e32e70fc4b947a13163f6ec10073a82",
+        "revCount": 707552,
+        "type": "git",
+        "url": "https://cl.forkos.org/nixpkgs"
+      },
+      "original": {
+        "type": "git",
+        "url": "https://cl.forkos.org/nixpkgs"
+      }
+    },
    "root": {
      "inputs": {
        "flake-utils": "flake-utils",
-        "nixpkgs": "nixpkgs"
+        "nixpkgs": "nixpkgs",
+        "petalpkgs": "petalpkgs"
      }
    },
    "systems": {
--- a/flake.nix
+++ b/flake.nix
@ -2,9 +2,10 @@
  inputs = {
    nixpkgs.url = "github:NixOS/nixpkgs/nixos-unstable";
    flake-utils.url = "github:numtide/flake-utils";
+    petalpkgs.url = "git+https://cl.forkos.org/nixpkgs";
  };

-  outputs = { self, nixpkgs, flake-utils }:
+  outputs = { self, nixpkgs, flake-utils, petalpkgs }:
    flake-utils.lib.eachDefaultSystem (system:
      let pkgs = import nixpkgs { inherit system; };
      in {
@ -13,6 +14,10 @@
          LD_LIBRARY_PATH = pkgs.lib.makeLibraryPath [ pkgs.stdenv.cc.cc.lib ];

          buildInputs = with pkgs; [ bun ];
+
+          shellHook = ''
+            ln -sf ${petalpkgs.outPath} .petalpkgs
+          '';
        };

        # ... and remote deployment.
--- a/package.json
+++ b/package.json
@ -9,25 +9,45 @@
 		"check": "svelte-kit sync && svelte-check --tsconfig ./jsconfig.json",
 		"check:watch": "svelte-kit sync && svelte-check --tsconfig ./jsconfig.json --watch",
 		"lint": "prettier --check .",
-		"format": "prettier --write ."
+		"format": "prettier --write .",
+		"prepare": "husky"
 	},
 	"devDependencies": {
-		"@sveltejs/adapter-auto": "^3.0.0",
-		"@sveltejs/kit": "^2.0.0",
-		"@sveltejs/vite-plugin-svelte": "^3.0.0",
+		"@sveltejs/adapter-node": "^5.2.9",
+		"@sveltejs/enhanced-img": "^0.3.9",
+		"@sveltejs/kit": "^2.5.27",
+		"@sveltejs/vite-plugin-svelte": "^4.0.0",
+		"@types/node": "^22.8.1",
 		"autoprefixer": "^10.4.20",
+		"husky": "^9.1.6",
+		"lint-staged": "^15.2.10",
 		"postcss": "^8.4.47",
 		"prettier": "^3.1.1",
-		"prettier-plugin-svelte": "^3.1.2",
-		"svelte": "^4.2.7",
+		"prettier-plugin-svelte": "^3.2.6",
+		"svelte": "^5.0.0",
 		"svelte-check": "^4.0.0",
 		"tailwindcss": "^3.4.11",
-		"typescript": "^5.0.0",
-		"vite": "^5.0.3"
+		"typescript": "^5.5.0",
+		"vite": "^5.4.4"
 	},
 	"type": "module",
 	"dependencies": {
-		"@sveltejs/enhanced-img": "^0.3.8",
-		"svelte-highlight": "^7.7.0"
+		"clsx": "^2.1.1",
+		"mdast": "^3.0.0",
+		"moderndash": "^3.12.0",
+		"rehype-autolink-headings": "^7.1.0",
+		"rehype-sanitize": "^6.0.0",
+		"rehype-slug-custom-id": "^2.0.0",
+		"rehype-stringify": "^10.0.1",
+		"remark": "^15.0.1",
+		"remark-parse": "^11.0.0",
+		"remark-rehype": "^11.1.1",
+		"svelte-highlight": "^7.7.0",
+		"to-vfile": "^8.0.0",
+		"unified": "^11.0.5",
+		"unist-util-flatmap": "^1.0.0"
+	},
+	"lint-staged": {
+		"{package.json,*.js,src/**.{svelte,ts,js,css}}": "prettier --write --ignore-unknown"
 	}
 }
--- a/src/app.html
+++ b/src/app.html
@ -2,7 +2,7 @@
 <html lang="en">
 	<head>
 		<meta charset="utf-8" />
-		<link rel="icon" href="%sveltekit.assets%/favicon.png" />
+		<link rel="icon" href="%sveltekit.assets%/favicon.png?efdb30a" />
 		<meta name="viewport" content="width=device-width, initial-scale=1" />
 		%sveltekit.head%
 	</head>
--- a/src/lib/Highlight.svelte
+++ b/src/lib/Highlight.svelte
@ -1,25 +1,28 @@
-<script>
+<script lang="ts">
 	import Highlight from "svelte-highlight";
 	import "$lib/hljs.css";

-	export let language;
-	export let code;
-	export let slice = true;
-	export let alt;
+	let {
+		language,
+		code,
+		slice = $bindable(true),
+		alt
+	} = $props();

-	let renderedCode;
-	$: renderedCode = slice ? code.replace(/#<hidden>[^]*?#<\/hidden>/, "") : code;
+	let renderedCode = $derived(slice ? code.replace(/#<hidden>[^]*?#<\/hidden>/, "")
+		: code.replace(/#(<hidden>|<\/hidden>)/g,""));
+	
 </script>

 <p class="sr-only">{alt}</p>
-<div class=" font-mono relative" aria-hidden title={alt}>
+<div class=" font-mono relative" aria-hidden="true" title={alt}>
 	<!-- HACK: apply the pre-wrap style to the child to avoid
 		 HTML formatting whitespace issues down the line. -->
 	<div class="*:whitespace-pre-wrap"><Highlight {language} code={renderedCode} /></div>
 	<button
 		class="top-0 right-0 absolute font-sans text-xs font-bold"
 		class:text-blue-500={slice}
-		on:click={() => { slice = !slice }}
+		onclick={() => { slice = !slice }}
 	>
 		({slice ? "show" : "hide"} full)
 	</button>
--- a/src/lib/assets/ecosystem-lix.png
+++ b/src/lib/assets/ecosystem-lix.png
--- a/src/lib/assets/flower-gray.svg
+++ b/src/lib/assets/flower-gray.svg
@ -0,0 +1,79 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="512"
+   height="512"
+   viewBox="0 0 135.46666 135.46667"
+   version="1.1"
+   id="svg1"
+   xml:space="preserve"
+   inkscape:version="1.3.2 (091e20ef0f, 2023-11-25)"
+   sodipodi:docname="flower-gray.svg"
+   inkscape:export-filename="flower-v4.png"
+   inkscape:export-xdpi="192"
+   inkscape:export-ydpi="192"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg"><sodipodi:namedview
+     id="namedview1"
+     pagecolor="#505050"
+     bordercolor="#eeeeee"
+     borderopacity="1"
+     inkscape:showpageshadow="0"
+     inkscape:pageopacity="0"
+     inkscape:pagecheckerboard="0"
+     inkscape:deskcolor="#d1d1d1"
+     inkscape:document-units="px"
+     inkscape:zoom="1.0218084"
+     inkscape:cx="137.99064"
+     inkscape:cy="194.26343"
+     inkscape:window-width="2420"
+     inkscape:window-height="1360"
+     inkscape:window-x="30"
+     inkscape:window-y="26"
+     inkscape:window-maximized="0"
+     inkscape:current-layer="layer2" /><defs
+     id="defs1" /><g
+     inkscape:label="Layer 1"
+     inkscape:groupmode="layer"
+     id="layer1" /><g
+     inkscape:groupmode="layer"
+     id="layer2"
+     inkscape:label="flower"><path
+       style="display:inline;opacity:1;fill:#d4d4d8;fill-opacity:1;stroke:none;stroke-width:0.788603px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+       d="m 71.736436,68.603652 c 44.954114,-1.02324 46.182024,-19.850787 47.205234,-26.467722 0.20483,-2.455764 0.40928,-5.25259 -0.40929,-8.595155 -3.13791,-5.320815 -7.43552,-9.277345 -9.00447,-10.368791 -1.70537,-0.682158 -4.2976,0.750382 -5.59368,0 -0.61395,-0.818579 0.40929,-2.728604 -0.68216,-3.9565 -11.050947,-6.54871 -20.191844,-4.706881 -27.149847,3.137921 -14.939222,20.874002 -4.365787,46.250247 -4.365787,46.250247 z"
+       id="path1-30"
+       sodipodi:nodetypes="cccccccc" /><path
+       style="display:inline;opacity:1;fill:#e4e4e7;fill-opacity:1;stroke:none;stroke-width:0.788603px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+       d="M 71.453362,68.801004 C 91.440551,32.169169 74.396844,10.006396 63.823409,7.891696 47.315213,5.2312884 37.765024,13.690025 34.490671,19.488354 c -6.139412,11.187368 -2.66041,16.712829 -2.114685,18.895722 6.957997,16.508212 25.70711,28.234039 39.077376,30.416928 z"
+       id="path2"
+       sodipodi:nodetypes="ccccc" /><path
+       style="display:inline;opacity:1;fill:#d4d4d8;fill-opacity:1;stroke:none;stroke-width:0.788603px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+       d="M 71.723213,69.236517 C 51.308471,40.763158 13.818464,31.766268 6.1685152,49.08503 5.6590776,50.598312 7.4177571,52.495453 5.576126,54.939534 3.6660874,57.258875 3.0019185,60.474745 3.0701322,61.839042 2.9803593,77.516957 10.941832,81.990947 21.447045,86.766043 33.543136,92.615566 71.382149,74.148046 71.723213,69.236517 Z"
+       id="path3"
+       sodipodi:nodetypes="cccccc" /><path
+       style="display:inline;opacity:1;fill:#e4e4e7;fill-opacity:1;stroke:none;stroke-width:0.788603px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+       d="m 71.341717,68.805242 c -43.521593,7.230872 -56.360728,26.266054 -52.540648,38.681318 4.161154,9.61841 12.688112,16.23536 18.691092,18.96396 12.756332,5.52549 26.740535,-7.09442 29.878457,-16.09891 3.888304,-12.824539 6.153992,-42.092119 3.971099,-41.546368 z"
+       id="path4-9"
+       sodipodi:nodetypes="ccccc" /><path
+       style="display:inline;opacity:1;fill:#d4d4d8;fill-opacity:1;stroke:none;stroke-width:0.788603px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+       d="m 71.30173,68.961066 c -14.598139,26.740553 -12.66272,42.209164 4.800493,54.487974 17.12214,9.75484 25.921977,5.93474 34.107847,-4.50223 7.09442,-9.68663 9.48198,-20.532954 8.32231,-26.058403 C 117.03165,74.538397 74.439652,63.16273 71.30173,68.961066 Z"
+       id="path5-2"
+       sodipodi:nodetypes="ccccc" /><path
+       style="display:inline;opacity:1;fill:#e4e4e7;fill-opacity:1;stroke:none;stroke-width:0.788603px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+       d="M 71.474534,68.791043 C 80.069719,47.303109 123.51212,26.787417 130.94764,60.554165 133.13053,71.94619 130.26546,91.728758 118.19128,92.615566 112.87047,92.547216 68.336612,86.663541 71.474534,68.791043 Z"
+       id="path6-5"
+       sodipodi:nodetypes="cccc" /><path
+       id="path1-30-5"
+       style="display:inline;fill:#d4d4d8;fill-opacity:1;stroke:none;stroke-width:0.788603px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+       d="m 108.11691,22.989811 c -1.05689,0.05598 -2.20173,0.388556 -3.13055,0.395841 l -30.431,39.130131 c -0.616191,0.993514 -3.130416,6.281983 -3.130416,6.281983 44.954066,-1.023239 46.493426,-20.044909 47.516636,-26.661837 0.20483,-2.455762 0.40929,-5.252779 -0.40928,-8.595341 -3.13791,-5.32081 -7.43567,-9.276914 -9.00462,-10.368359 -0.42634,-0.17054 -0.90768,-0.209065 -1.41077,-0.182418 z"
+       sodipodi:nodetypes="sccccccs" /></g><g
+     inkscape:groupmode="layer"
+     id="layer4"
+     inkscape:label="stamen_base" /><g
+     inkscape:groupmode="layer"
+     id="layer3"
+     inkscape:label="stamen"
+     transform="translate(48.016835,0.13732173)" /></svg>
--- a/src/lib/assets/flower.svg
+++ b/src/lib/assets/flower.svg
@ -0,0 +1,79 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="512"
+   height="512"
+   viewBox="0 0 135.46666 135.46667"
+   version="1.1"
+   id="svg1"
+   xml:space="preserve"
+   inkscape:version="1.3.2 (091e20ef0f, 2023-11-25)"
+   sodipodi:docname="flower-v4.svg"
+   inkscape:export-filename="flower-v4.png"
+   inkscape:export-xdpi="192"
+   inkscape:export-ydpi="192"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg"><sodipodi:namedview
+     id="namedview1"
+     pagecolor="#505050"
+     bordercolor="#eeeeee"
+     borderopacity="1"
+     inkscape:showpageshadow="0"
+     inkscape:pageopacity="0"
+     inkscape:pagecheckerboard="0"
+     inkscape:deskcolor="#d1d1d1"
+     inkscape:document-units="px"
+     inkscape:zoom="1.0218084"
+     inkscape:cx="137.50132"
+     inkscape:cy="272.06667"
+     inkscape:window-width="2560"
+     inkscape:window-height="1355"
+     inkscape:window-x="30"
+     inkscape:window-y="26"
+     inkscape:window-maximized="0"
+     inkscape:current-layer="layer2" /><defs
+     id="defs1" /><g
+     inkscape:label="Layer 1"
+     inkscape:groupmode="layer"
+     id="layer1" /><g
+     inkscape:groupmode="layer"
+     id="layer2"
+     inkscape:label="flower"><path
+       style="display:inline;opacity:1;fill:#ff6665;fill-opacity:1;stroke:none;stroke-width:0.788603px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+       d="m 71.736436,68.603652 c 44.954114,-1.02324 46.182024,-19.850787 47.205234,-26.467722 0.20483,-2.455764 0.40928,-5.25259 -0.40929,-8.595155 -3.13791,-5.320815 -7.43552,-9.277345 -9.00447,-10.368791 -1.70537,-0.682158 -4.2976,0.750382 -5.59368,0 -0.61395,-0.818579 0.40929,-2.728604 -0.68216,-3.9565 -11.050947,-6.54871 -20.191844,-4.706881 -27.149847,3.137921 -14.939222,20.874002 -4.365787,46.250247 -4.365787,46.250247 z"
+       id="path1-30"
+       sodipodi:nodetypes="cccccccc" /><path
+       style="display:inline;opacity:1;fill:#ff9e9d;fill-opacity:1;stroke:none;stroke-width:0.788603px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+       d="M 71.453362,68.801004 C 91.440551,32.169169 74.396844,10.006396 63.823409,7.891696 47.315213,5.2312884 37.765024,13.690025 34.490671,19.488354 c -6.139412,11.187368 -2.66041,16.712829 -2.114685,18.895722 6.957997,16.508212 25.70711,28.234039 39.077376,30.416928 z"
+       id="path2"
+       sodipodi:nodetypes="ccccc" /><path
+       style="display:inline;opacity:1;fill:#ff6665;fill-opacity:1;stroke:none;stroke-width:0.788603px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+       d="M 71.723213,69.236517 C 51.308471,40.763158 13.818464,31.766268 6.1685152,49.08503 5.6590776,50.598312 7.4177571,52.495453 5.576126,54.939534 3.6660874,57.258875 3.0019185,60.474745 3.0701322,61.839042 2.9803593,77.516957 10.941832,81.990947 21.447045,86.766043 33.543136,92.615566 71.382149,74.148046 71.723213,69.236517 Z"
+       id="path3"
+       sodipodi:nodetypes="cccccc" /><path
+       style="display:inline;opacity:1;fill:#ff9e9d;fill-opacity:1;stroke:none;stroke-width:0.788603px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+       d="m 71.341717,68.805242 c -43.521593,7.230872 -56.360728,26.266054 -52.540648,38.681318 4.161154,9.61841 12.688112,16.23536 18.691092,18.96396 12.756332,5.52549 26.740535,-7.09442 29.878457,-16.09891 3.888304,-12.824539 6.153992,-42.092119 3.971099,-41.546368 z"
+       id="path4-9"
+       sodipodi:nodetypes="ccccc" /><path
+       style="display:inline;opacity:1;fill:#ff6665;fill-opacity:1;stroke:none;stroke-width:0.788603px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+       d="m 71.30173,68.961066 c -14.598139,26.740553 -12.66272,42.209164 4.800493,54.487974 17.12214,9.75484 25.921977,5.93474 34.107847,-4.50223 7.09442,-9.68663 9.48198,-20.532954 8.32231,-26.058403 C 117.03165,74.538397 74.439652,63.16273 71.30173,68.961066 Z"
+       id="path5-2"
+       sodipodi:nodetypes="ccccc" /><path
+       style="display:inline;opacity:1;fill:#ff9e9d;fill-opacity:1;stroke:none;stroke-width:0.788603px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+       d="M 71.474534,68.791043 C 80.069719,47.303109 123.51212,26.787417 130.94764,60.554165 133.13053,71.94619 130.26546,91.728758 118.19128,92.615566 112.87047,92.547216 68.336612,86.663541 71.474534,68.791043 Z"
+       id="path6-5"
+       sodipodi:nodetypes="cccc" /><path
+       id="path1-30-5"
+       style="display:inline;fill:#ff6665;fill-opacity:1;stroke:none;stroke-width:0.788603px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+       d="m 108.11691,22.989811 c -1.05689,0.05598 -2.20173,0.388556 -3.13055,0.395841 l -30.431,39.130131 c -0.616191,0.993514 -3.130416,6.281983 -3.130416,6.281983 44.954066,-1.023239 46.493426,-20.044909 47.516636,-26.661837 0.20483,-2.455762 0.40929,-5.252779 -0.40928,-8.595341 -3.13791,-5.32081 -7.43567,-9.276914 -9.00462,-10.368359 -0.42634,-0.17054 -0.90768,-0.209065 -1.41077,-0.182418 z"
+       sodipodi:nodetypes="sccccccs" /></g><g
+     inkscape:groupmode="layer"
+     id="layer4"
+     inkscape:label="stamen_base" /><g
+     inkscape:groupmode="layer"
+     id="layer3"
+     inkscape:label="stamen"
+     transform="translate(48.016835,0.13732173)" /></svg>
--- a/src/lib/assets/leaf.svg
+++ b/src/lib/assets/leaf.svg
@ -0,0 +1,57 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="512"
+   height="512"
+   viewBox="0 0 135.46666 135.46667"
+   version="1.1"
+   id="svg1"
+   xml:space="preserve"
+   inkscape:version="1.3.2 (091e20ef0f, 2023-11-25)"
+   sodipodi:docname="leaf.svg"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg"><sodipodi:namedview
+     id="namedview1"
+     pagecolor="#505050"
+     bordercolor="#eeeeee"
+     borderopacity="1"
+     inkscape:showpageshadow="0"
+     inkscape:pageopacity="0"
+     inkscape:pagecheckerboard="0"
+     inkscape:deskcolor="#d1d1d1"
+     inkscape:document-units="px"
+     inkscape:zoom="1.4450552"
+     inkscape:cx="177.15586"
+     inkscape:cy="260.54367"
+     inkscape:window-width="1831"
+     inkscape:window-height="1238"
+     inkscape:window-x="30"
+     inkscape:window-y="26"
+     inkscape:window-maximized="0"
+     inkscape:current-layer="svg1" /><defs
+     id="defs1" /><g
+     inkscape:label="Layer 1"
+     inkscape:groupmode="layer"
+     id="layer1"><g
+       inkscape:label="Layer 1"
+       id="layer1-9"
+       transform="translate(0.39145833,-0.50256824)" /><g
+       id="layer4"
+       inkscape:label="stamen_base"
+       transform="translate(0.39145833,-0.50256824)" /><g
+       id="layer3"
+       inkscape:label="stamen"
+       transform="translate(48.408293,-0.36524651)" /></g><g
+     id="g2"
+     transform="translate(0,4.9535631)"><path
+       style="fill:#49be95;fill-opacity:1;stroke:none;stroke-width:0.264583px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+       d="m 5.9447564,86.621179 c 0,0 28.4566516,-26.328381 41.6259236,-33.834967 C 63.137118,43.913224 74.262563,38.776995 129.98604,35.60375 120.5338,64.353283 120.9163,85.225333 87.438519,94.896362 37.828146,109.22776 5.9447564,86.621179 5.9447564,86.621179 Z"
+       id="path1"
+       sodipodi:nodetypes="cscsc" /><path
+       style="fill:#27a27b;fill-opacity:1;stroke:none;stroke-width:0.264583px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+       d="M 5.9447564,86.62118 C 85.116628,78.856181 85.974262,63.282749 129.98604,35.603751 c 0,0 -40.446902,-2.684616 -74.20599,12.768723 C 33.239912,58.6903 5.9447564,86.62118 5.9447564,86.62118 Z"
+       id="path2"
+       sodipodi:nodetypes="ccsc" /></g></svg>
--- a/src/lib/assets/lix.svg
+++ b/src/lib/assets/lix.svg
@ -0,0 +1,91 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="301.83499"
+   height="512"
+   viewBox="0 0 79.860506 135.46667"
+   version="1.1"
+   id="svg1"
+   xml:space="preserve"
+   inkscape:version="1.3.2 (091e20ef0f, 2023-11-25)"
+   sodipodi:docname="lix.svg"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg"><sodipodi:namedview
+     id="namedview1"
+     pagecolor="#505050"
+     bordercolor="#eeeeee"
+     borderopacity="1"
+     inkscape:showpageshadow="0"
+     inkscape:pageopacity="0"
+     inkscape:pagecheckerboard="0"
+     inkscape:deskcolor="#d1d1d1"
+     inkscape:document-units="px"
+     inkscape:zoom="1"
+     inkscape:cx="-263.5"
+     inkscape:cy="186.5"
+     inkscape:window-width="2560"
+     inkscape:window-height="1360"
+     inkscape:window-x="30"
+     inkscape:window-y="26"
+     inkscape:window-maximized="0"
+     inkscape:current-layer="layer2" /><defs
+     id="defs1" /><g
+     inkscape:groupmode="layer"
+     id="layer2"
+     inkscape:label="background"
+     style="display:inline"><path
+       style="display:inline;fill:#ffffff;fill-opacity:1;stroke:none;stroke-width:0.264583;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
+       d="M 48.519872,0.18579056 C 45.47737,0.16960704 43.262295,3.6409654 42.873891,5.0812989 37.301335,8.3773176 33.977117,15.376214 22.10767,24.911935 16.715232,28.86324 14.206469,29.587312 9.498087,35.177251 6.2939131,40.07506 7.0949563,45.888349 7.0262955,48.085497 1.705078,55.317775 0.18775395,57.171616 0.15342352,60.696207 c 0,3.244226 1.78052438,5.115237 2.03800268,5.492872 -1.81951308,6.408348 -3.4044347,10.894191 6.0707653,14.395895 -5.9963826,6.866087 -1.2479558,10.298736 1.7960095,11.374423 11.649461,35.634993 7.564755,40.098343 15.34632,43.188083 3.021079,0.50351 14.647652,0.0229 30.073461,0.13732 8.216417,0.22884 10.138921,-14.25857 21.216208,-57.469149 3.17197,-8.059394 0.986604,-11.967529 -0.01677,-16.563649 0,0 2.768536,-7.00252 3.027472,-12.634385 C 79.568639,45.335649 77.266367,43.39367 74.222402,40.23527 73.866365,35.736251 76.448642,30.188732 65.443847,26.013383 65.970246,21.82507 66.956013,16.615931 61.577578,11.077287 60.525649,8.6335751 53.245461,0.31525874 48.519872,0.18579056 Z"
+       id="path1"
+       sodipodi:nodetypes="cccccccccccccccccc" /></g><g
+     inkscape:groupmode="layer"
+     id="layer3"
+     inkscape:label="cone"
+     style="display:inline"><path
+       style="opacity:1;fill:#ef7627;fill-opacity:1;stroke:none;stroke-width:0.264583;stroke-linecap:butt;stroke-linejoin:miter;stroke-dasharray:none;stroke-opacity:1"
+       d="M 70.878136,76.931361 C 60.107697,126.91523 60.755327,133.05574 53.117859,132.95864 h -23.84821 c -7.781565,0.0457 -5.273199,-1.37322 -16.213165,-46.048566 z"
+       id="path2"
+       sodipodi:nodetypes="ccccc" /><path
+       id="path2-3"
+       style="opacity:1;fill:#ff9a56;fill-opacity:1;stroke:none;stroke-width:0.264583;stroke-linecap:butt;stroke-linejoin:miter;stroke-dasharray:none;stroke-opacity:1"
+       d="m 70.878361,76.931221 -19.956405,3.444235 2.973979,52.565784 c 6.825298,-0.37765 6.593169,-7.79515 16.982426,-56.010019 z" /></g><g
+     inkscape:groupmode="layer"
+     id="layer4"
+     inkscape:label="icecream"
+     style="display:inline"><path
+       id="path23"
+       style="display:inline;fill:#b55690;fill-opacity:1;stroke:none;stroke-width:0.264583px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+       d="M 48.566545,3.5232991 C 47.608988,3.676761 45.70212,6.3705551 45.70212,7.2502034 41.010663,9.6941255 37.313485,15.47089 37.313485,15.47089 l -3.47059,3.226677 4.510319,9.178768 L 54.904659,7.9250976 C 52.826127,5.8978984 50.423286,4.1224036 48.744828,3.52795 48.690278,3.514312 48.630382,3.513068 48.566545,3.5232991 Z" /><path
+       id="path22"
+       style="display:inline;fill:#a30262;fill-opacity:1;stroke:none;stroke-width:0.264583px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+       d="M 53.118013,6.3123303 38.095866,24.789185 27.202474,24.870315 24.286373,27.58126 c -1.541315,1.114365 -2.907946,2.075725 -4.132048,2.938839 l 43.081608,8.815482 7.553028,-2.620511 C 70.341668,29.739881 66.923634,31.641829 61.767806,28.09234 60.579728,26.456804 65.525628,19.732626 58.875476,13.20591 58.098215,11.155549 55.627394,8.3965908 53.118013,6.3123283 Z"
+       sodipodi:nodetypes="cccccccccc" /><path
+       id="path21"
+       style="display:inline;fill:#d162a4;fill-opacity:1;stroke:none;stroke-width:0.264583px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+       d="m 37.498933,15.192224 c -0.04009,0.06061 -0.185448,0.278666 -0.185448,0.278666 l -11.827702,10.995712 1.688786,4.379577 -5.981032,-1.05898 c -7.728675,5.455246 -10.105154,6.951177 -10.688235,13.588965 l 28.385864,3.091801 10.032463,-3.063379 -1.917713,-8.933305 -2.431893,-0.374137 z"
+       sodipodi:nodetypes="ccccccccccc" /><path
+       id="path20"
+       style="display:inline;fill:#b55690;fill-opacity:1;stroke:none;stroke-width:0.264583px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+       d="m 59.490892,13.846204 -4.884406,0.933772 -10.196277,25.116814 -13.03538,1.881022 -9.134843,1.954402 -11.602337,-1.551647 c -0.273667,1.830079 -0.321169,4.057525 -0.316315,7.003511 -0.08822,0.405821 -4.4379697,5.936757 -6.1985882,9.300207 l 67.6258462,-7.40885 0.09974,-8.318355 c -0.358917,-0.325866 -0.715117,-0.650094 -1.126547,-1.003556 0.179609,-2.653165 0.155464,-4.590108 -0.0282,-6.070071 l -8.860665,1.313255 2.90617,-7.272141 c -0.909661,-0.421805 -1.884293,-0.883896 -2.971282,-1.632225 -1.138728,-1.5676 3.403689,-7.857839 -2.134596,-14.086407 z"
+       sodipodi:nodetypes="ccccccccccccccccc" /><path
+       id="path19"
+       style="display:inline;fill:#a30262;fill-opacity:1;stroke:none;stroke-width:0.264583px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+       d="m 23.035286,31.547945 -4.866888,0.377194 c -4.138484,2.973958 -6.196051,4.835121 -7.106206,8.13777 L 22.684403,54.747046 5.0094344,56.941775 c -0.4573505,0.740799 -0.8556463,1.43289 -1.1414534,2.035504 l 3.8493774,4.118611 37.4178706,2.128036 28.507304,2.759521 0.65009,-2.650484 c -0.30341,-1.243849 -0.721898,-2.624371 -1.30483,-4.191475 1.733222,-6.597429 3.802994,-9.483708 3.207556,-12.434384 l -35.620565,4.355807 z"
+       sodipodi:nodetypes="cccccccccccccc" /><path
+       id="path18"
+       style="display:inline;fill:#d162a4;fill-opacity:1;stroke:none;stroke-width:0.264583px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+       d="M 65.003784,41.175781 46.565633,65.24408 45.099056,65.168632 7.4367554,63.048865 21.936129,74.367554 39.288558,76.145223 63.925814,56.067895 76.298702,50.065161 c 0.122074,-2.438919 -1.194915,-4.547028 -5.576921,-8.311637 0.01202,-0.177512 0.02074,-0.312905 0.03106,-0.484299 z"
+       sodipodi:nodetypes="ccccccccccc" /><path
+       id="path17"
+       style="display:inline;fill:#b55690;fill-opacity:1;stroke:none;stroke-width:0.264583px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+       d="M 76.298702,50.065161 29.023035,72.781604 4.3452825,58.058485 c -0.5521421,0.989853 -0.9502233,1.851937 -0.9847641,2.384854 0.1309249,1.723838 2.6183946,5.062424 2.5311116,5.411556 -0.4364145,0.872829 -2.0949613,7.920865 -1.418518,8.422742 4.4732495,4.145938 8.30743,2.821415 8.292,5.405871 -0.0444,2.699866 -5.7280554,5.62209 -3.5284665,7.886857 L 42.647526,84.121997 61.379199,72.735095 74.547904,66.494132 c -0.300116,-1.524918 -0.788455,-3.278191 -1.560111,-5.352644 1.467972,-5.587766 3.179701,-8.51904 3.310909,-11.076327 z"
+       sodipodi:nodetypes="ccccccccccccc" /><path
+       id="path16"
+       style="display:inline;fill:#d162a4;fill-opacity:1;stroke:none;stroke-width:0.264583px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+       d="m 74.538086,66.445557 -10.181291,4.792989 -10.503235,6.479707 5.672006,5.517493 c 6.493037,-2.731431 9.319025,-5.994183 9.837125,-5.846155 2.880338,5.106052 -5.467805,9.864436 -0.841809,11.522811 1.876583,0.480057 2.660136,-1.132284 5.179012,-12.558406 0.640769,-2.327003 1.862135,-4.75982 0.838192,-9.908439 z" /><path
+       id="path15"
+       style="display:inline;fill:#a30262;fill-opacity:1;stroke:none;stroke-width:0.264583px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+       d="m 63.940283,56.102002 -8.856824,0.956531 -12.250931,24.224361 -32.38407,2.170927 c -1.8278499,2.093028 -3.3221982,4.078946 1.689302,5.555733 0.987387,2.651216 1.465275,8.224707 4.078304,10.324951 l -1.229899,-5.890596 c -0.229116,-1.603823 0.325578,-2.461779 0.129191,-2.816366 -0.08728,-0.201842 -0.183763,-1.642563 0.84181,-2.362646 0,0 7.733411,1.982644 21.458638,-1.465027 16.556176,0.536104 25.360933,-4.739781 29.332576,-7.61659 l -5.986714,0.526066 8.270296,-17.065108 z" /></g></svg>
--- a/src/lib/assets/petal.svg
+++ b/src/lib/assets/petal.svg
@ -0,0 +1,57 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="512"
+   height="512"
+   viewBox="0 0 135.46666 135.46667"
+   version="1.1"
+   id="svg1"
+   xml:space="preserve"
+   inkscape:version="1.3.2 (091e20ef0f, 2023-11-25)"
+   sodipodi:docname="petal.svg"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg"><sodipodi:namedview
+     id="namedview1"
+     pagecolor="#505050"
+     bordercolor="#eeeeee"
+     borderopacity="1"
+     inkscape:showpageshadow="0"
+     inkscape:pageopacity="0"
+     inkscape:pagecheckerboard="0"
+     inkscape:deskcolor="#d1d1d1"
+     inkscape:document-units="px"
+     inkscape:zoom="0.72252765"
+     inkscape:cx="231.82504"
+     inkscape:cy="226.28892"
+     inkscape:window-width="1482"
+     inkscape:window-height="988"
+     inkscape:window-x="30"
+     inkscape:window-y="26"
+     inkscape:window-maximized="0"
+     inkscape:current-layer="svg1" /><defs
+     id="defs1" /><g
+     inkscape:label="Layer 1"
+     inkscape:groupmode="layer"
+     id="layer1"><g
+       inkscape:label="Layer 1"
+       id="layer1-9"
+       transform="translate(0.39145833,-0.50256824)" /><g
+       id="layer4"
+       inkscape:label="stamen_base"
+       transform="translate(0.39145833,-0.50256824)" /><g
+       id="layer3"
+       inkscape:label="stamen"
+       transform="translate(48.408293,-0.36524651)" /></g><g
+     id="g1"
+     transform="matrix(0.83206019,0.33412272,-0.33412272,0.83206019,38.961186,-9.777432)"><path
+       style="display:inline;opacity:1;fill:#ff6665;fill-opacity:1;stroke:none;stroke-width:1.70806px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+       d="M 19.039792,124.95005 C 97.553068,126.5082 118.40125,97.230897 124.44237,72.62228 125.89647,66.698993 127.46153,60.966004 124.839,53.988905 120.13159,41.465054 110.15502,32.834282 106.92754,30.242053 103.89655,28.03009 99.255779,32.060252 96.459255,30.41665 94.206806,29.092826 93.317901,17.661166 89.384863,15.814783 71.972911,6.0185455 56.038876,10.210319 38.471929,23.876745 13.475765,43.322827 9.3107292,82.426994 19.039792,124.95005 Z"
+       id="path1-30"
+       sodipodi:nodetypes="csscscsc" /><path
+       style="fill:#ff9e9d;fill-opacity:1;stroke:none;stroke-width:0.264583px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+       d="m 19.039792,124.95005 c 0,0 109.231808,-27.438225 87.887748,-94.707998 0,0 19.4742,15.213687 19.31236,32.206385 C 120.28436,135.20955 19.039792,124.95005 19.039792,124.95005 Z"
+       id="path1"
+       sodipodi:nodetypes="cccc" /></g></svg>
--- a/src/lib/components/FlowerDivider.svelte
+++ b/src/lib/components/FlowerDivider.svelte
@ -0,0 +1,17 @@
+<script lang="ts">
+	import { range } from "moderndash"
+</script>
+
+<div class="flex w-full justify-center gap-x-12">
+	{#snippet flower(alt)}
+		{#if alt}
+			<enhanced:img src="$lib/assets/flower-gray.svg" width="24" height="24" alt="flower" />
+		{:else}
+			<enhanced:img src="$lib/assets/flower.svg" width="24" height="24" alt="flower" />
+		{/if}
+	{/snippet}
+
+	{#each range(1, 5) as i}
+		{@render flower(i % 2 == 0)}
+	{/each}
+</div>
--- a/src/lib/components/Footer.svelte
+++ b/src/lib/components/Footer.svelte
--- a/src/lib/components/LinkChip.svelte
+++ b/src/lib/components/LinkChip.svelte
@ -0,0 +1,9 @@
+<script lang="ts">
+	import clsx from "clsx";
+
+	let props = $props();
+</script>
+
+<a {...props} class={clsx(props.class, "no-link-style flex gap-x-2 px-2 pr-4 py-1 rounded-full border-2 border-zinc-200 w-fit transform translate-y-0 transition-all hover:translate-y-[-2px] active:translate-y-[2px] active:bg-zinc-100")}>
+	{@render props.children?.()}
+</a>
--- a/src/lib/components/Nav.svelte
+++ b/src/lib/components/Nav.svelte
@ -0,0 +1,12 @@
+<script lang="ts">
+	import NavLink from "./NavLink.svelte";
+	import Search from "./Search.svelte";
+</script>
+
+<div
+	class="max-md:hidden flex gap-x-4 h-full items-center grow"
+>
+	<Search />
+	<NavLink href="/docs/intro">Docs</NavLink>
+	<NavLink href="https://fleurixos.org" class="text-coral-600 font-semibold">Try {DISTRO}</NavLink>
+</div>
--- a/src/lib/components/NavLink.svelte
+++ b/src/lib/components/NavLink.svelte
@ -0,0 +1,10 @@
+<script lang="ts">
+	let props = $props()
+</script>
+
+<a
+	{...props}
+	class="{props.class ?? ""} no-link-style hover:underline"
+>
+	{@render props.children?.()}
+</a>
--- a/src/lib/components/Search.svelte
+++ b/src/lib/components/Search.svelte
@ -0,0 +1,8 @@
+<div class="flex grow justify-end pl-4">
+	<input
+		type="text"
+		placeholder="Search..."
+		class="rounded-md bg-zinc-200 px-4 py-[6px] text-md/10 grow-0
+   			   focus:grow max-w-96 transition-all hover:ring-1 hover:ring-zinc-500 focus:outline-none focus:ring-2 focus:ring-coral-300 placeholder:text-zinc-600"
+	/>
+</div>
--- a/src/lib/docs/index.ts
+++ b/src/lib/docs/index.ts
@ -0,0 +1,32 @@
+import { readFile } from "fs/promises";
+import rehypeStringify from "rehype-stringify";
+import remarkParse from "remark-parse";
+import remarkRehype from "remark-rehype";
+import { unified } from "unified";
+import rehypeSlug from "rehype-slug-custom-id";
+import { join } from "path";
+import { remarkInclude } from "./remark-include";
+import rehypeAutolinkHeadings from "rehype-autolink-headings";
+// import rehypeSanitize from "rehype-sanitize";
+
+export async function renderToHtml(
+	{ base, path }: {
+		base: string,
+		path: string
+	}
+) {
+	const md = await readFile(join(base, path + ".md"), { encoding: "utf-8" });
+
+	const html = await unified()
+		.use(remarkParse)
+		.use(remarkInclude, { resolveFrom: join(base, path.split("/").slice(0, -1).join("/")) })
+		.use(remarkRehype)
+		.use(rehypeSlug, { enableCustomId: true })
+		.use(rehypeAutolinkHeadings)
+		// .use(rehypeSanitize) TODO
+		.use(rehypeStringify)
+		.process(md)
+		.then(vfile => vfile.toString());
+
+	return html;
+}
--- a/src/lib/docs/remark-include.ts
+++ b/src/lib/docs/remark-include.ts
@ -0,0 +1,68 @@
+/**
+ * https://github.com/hashicorp/remark-plugins
+ * Copyright (c) HashiCorp, Inc.
+ * SPDX-License-Identifier: MPL-2.0
+ */
+
+import path from "path";
+import { remark } from "remark";
+import flatMap from "unist-util-flatmap";
+import { readSync } from "to-vfile";
+import type { Node, Root, Code } from "mdast";
+import type { Plugin } from "unified";
+
+export const remarkInclude: Plugin<[], Root> = ({ resolveFrom }: { resolveFrom: string }) => {
+	return (tree, file) => {
+		return flatMap(tree, (node: Code) => {
+			if (!(node.type == "code"
+				&& node.lang == "{=include=}"
+				&& node.meta !== "options"))
+				return [node];
+
+			// TODO: temporarily !== "options" because those are special, parsed from options.json:
+			// https://github.com/NixOS/nixpkgs/blob/d31617bedffa3e5fe067feba1c68b1a7f644cb4f/pkgs/tools/nix/nixos-render-docs/src/nixos_render_docs/manual.py#L81-L102
+
+			const includes = node.value.split("\n");
+
+			return includes.flatMap(included => {
+				// read the file contents
+				const includePath = path.join(resolveFrom ?? file.dirname, included);
+				let includeContents;
+				try {
+					includeContents = readSync(includePath, "utf8");
+				} catch (err) {
+					throw new Error(
+						`The {=include=} file path at ${includePath} was not found.\n\nInclude Location: ${file.path}:${node.position.start.line}:${node.position.start.column}`
+					);
+				}
+
+				// if we are including a ".md" or ".mdx" file, we add the contents as processed markdown
+				// if any other file type, they are embedded into a code block
+				if (includePath.match(/\.md(?:x)?$/)) {
+					// return the file contents in place of the @include
+					// (takes a couple steps because we're processing includes with remark)
+					const processor = remark();
+					// use the includeMarkdown plugin to allow recursive includes
+					processor.use(remarkInclude, { resolveFrom });
+					// Process the file contents, then return them
+					const ast = processor.parse(includeContents);
+					return processor.runSync(ast, includeContents).children;
+				} else {
+					throw new Error("noop: unused by petalpkgs");
+					// trim trailing newline
+					includeContents.contents = includeContents.contents.trim();
+
+					// return contents wrapped inside a "code" node
+					return [
+						{
+							type: "code",
+							lang: includePath.match(/\.(\w+)$/)?.[1],
+							value: includeContents
+						}
+					];
+				}
+
+			})
+		});
+	};
+};
--- a/src/lib/uwu.ts
+++ b/src/lib/uwu.ts
@ -0,0 +1,4 @@
+import { page } from "$app/stores";
+import { get } from "svelte/store";
+
+export const isUwU = () => get(page).url.searchParams.has("uwu");
--- a/src/main.css
+++ b/src/main.css
@ -17,40 +17,33 @@
 html {
 	@apply h-full;
 }
+
 body {
 	@apply min-h-[100%] flex bg-zinc-50;
-	> div {
+
+	>div {
 		line-height: inherit;
-		> * {
+
+		>* {
 			/* The layout's root node */
 			flex: 1 1 0;
 		}
 	}
 }

-b {
-	@apply text-coral-700;
+a:not(.no-link-style),
+button.link-style {
+	@apply link-style-u;
 }

-a:not(.no-link-style), button.link-style {
-    @apply link-style-u;
-}
-
-h1:not(.no-heading-style) {
-    @apply text-4xl lg:text-5xl my-4;
-}
-h2:not(.no-heading-style) {
-    @apply text-teal-600 text-2xl font-semibold my-1;
-}
-
-
@layer utilities {
-    .link-style-u {
-        @apply text-coral-700 hover:text-coral-800 active:text-coral-950 visited:text-teal-500 visited:hover:text-teal-700 active:text-teal-950 underline;
-    }
-    .container {
-        /* container like the builtin one, but limited to lg */
-        /* lg diverges from the canonical lg size defined in tailwind.config */
-        @apply max-w-full sm:max-w-[640px] md:max-w-[768px] lg:max-w-[1200px];
-    }
+	.link-style-u {
+		@apply text-teal-500 hover:text-teal-400 active:text-teal-600 underline;
+	}
+
+	.container {
+		/* container like the builtin one, but limited to lg */
+		/* lg diverges from the canonical lg size defined in tailwind.config */
+		@apply max-w-full sm:max-w-[640px] md:max-w-[768px] lg:max-w-[1200px];
+	}
 }
--- a/src/routes/+layout.svelte
+++ b/src/routes/+layout.svelte
@ -1,7 +1,12 @@
-<script>
+<script lang="ts">
 	import { page } from "$app/stores";
 	import "../main.css";
-	import Footer from "./footer.svelte";
+	import Footer from "$lib/components/Footer.svelte";
+	import Nav from "$lib/components/Nav.svelte";
+	import { isUwU } from "$lib/uwu";
+	import clsx from "clsx";
+
+	let { children } = $props();
 	globalThis.PKGS = "petalpkgs";
 	globalThis.DISTRO = "FleurixOS";
 </script>
@ -10,35 +15,32 @@
    <title>floral.systems</title>
    <meta property="og:title" content="floral.systems" />
    <meta property="og:type" content="website" />
-    <meta property="og:url" content={$page.url} />
+    <meta property="og:url" content={$page.url?.toString()} />
    <meta name="theme-color" content="#136951">
 </svelte:head>

-<div class="flex flex-col text-blue-950 underline-offset-[4px]">
-	<nav class="min-h-16 h-16 bg-teal-700 text-coral-50 mb-2">
+<div class="flex flex-col underline-offset-[4px]">
+	<nav class="min-h-16 h-16 bg-zinc-50 mb-2">
 		<div class="mx-auto container flex h-full justify-between">
-			<a class="flex h-full flex-col justify-center font-aladin text-4xl
-					  text-coral-50 hover:text-coral-100 no-link-style"
+			<a class="group flex h-full items-center justify-center font-aladin text-3xl/10
+					  text-coral-970 transition-colors duration-75 no-link-style gap-x-2
+					  hover:bg-clip-text hover:bg-gradient-to-r hover:from-coral-500 hover:from-15% hover:to-coral-400 hover:text-transparent"
 			   href="/">
-				█▌floral.systems
+				<enhanced:img src="$lib/assets/flower.svg" width="32" height="32"
+					alt="flower"
+					class={clsx(isUwU() && "transform rotate-0 group-hover:rotate-[360deg] transition-transform ease-in-out duration-500")}
+				/>
+				floral.systems
 			</a>
 			<span></span>

-			<div
-				class="max-md:hidden text-lg flex gap-2 h-full items-center
-						*:py-1 *:px-2 *:h-min *:bg-coral-100 *:rounded-md *:border-b-2 *:border-r-2 *:border-coral-200 text-blue-950
-						*:hover:bg-coral-200 <-TODO-fix-that-hover"
-			>
-				<a href="/colors" class="no-link-style">colors</a>
-				<a href="https://fleurixos.org" class="no-link-style">Try {DISTRO}</a>
-				<a href="https://petalpkgs.org" class="no-link-style">Use {PKGS}</a>
-			</div>
+			<Nav />
 		</div>
 	</nav>

 	<section class="Layout-content container w-full mx-auto">
 		<div class="m-1">
-			<slot />
+			{@render children?.()}
 		</div>
 	</section>

--- a/src/routes/+page.svelte
+++ b/src/routes/+page.svelte
@ -1,28 +1,56 @@
 <script>
 	import Highlight from "$lib/Highlight.svelte";
+	import LinkChip from "$lib/components/LinkChip.svelte";
+	import FlowerDivider from "$lib/components/FlowerDivider.svelte";
+
 	import nix from "svelte-highlight/languages/nix";

 	import demo1 from "./demo1/vm.nix?raw";
 	import forkGraph from "./fork.svg?raw";
 </script>

-<div class="flex flex-col gap-12">
-	<div>
-		<h1>An all-encompassing, declarative<br> <span class="text-blue-800">package ecosystem</span>.</h1>
-		<!-- <p class="text-xl lg:text-2xl">Build your *nix programs with <b>{PKGS}</b>'s extensive collection of <b>68368</b> packages<wbr>
-			then manage your systems with <b>{DISTRO}</b> using the <a href="https://nix.dev/manual/nix/latest/language/">Nix</a> language.</p> -->
-		<p class="text-xl lg:text-2xl">
+<div class="flex flex-col gap-y-24">
+	<div class="mt-16">
+		<h1 class="text-6xl text-balance">A declarative, comprehensive <span class="text-teal-500 font-aladin font-bold">package&nbsp;ecosystem</span></h1>
+		<p class="mt-4 text-xl lg:text-2xl max-w-4xl text-balance">
 			Declaratively own your Linux systems with<wbr>
-			full end-to-end&nbsp;customizability of <b>{PKGS}</b>'s <b>67589</b> packages
-			using the <a href="https://lix.systems">Lix</a> package manager.
+			full end-to-end&nbsp;customizability of <b class="text-teal-500">67,589</b> packages.
 		</p>
+		<div class="flex pt-4 gap-x-2">
+			<LinkChip
+				href="https://fleurixos.org"
+				target="_blank"
+				class="hover:border-teal-200"
+			>
+				<enhanced:img src="$lib/assets/leaf.svg" width="24" height="24" />
+				<span>FleurixOS</span>
+			</LinkChip>
+			<LinkChip
+				href="https://petalpkgs.org"
+				target="_blank"
+				class="hover:border-coral-200"
+			>
+				<enhanced:img src="$lib/assets/petal.svg" width="24" height="24" />
+				<span>Petalpkgs</span>
+			</LinkChip>
+			<LinkChip
+				href="https://lix.systems"
+				target="_blank"
+				class="hover:border-[#df92c0]"
+			>
+				<enhanced:img src="$lib/assets/lix.svg" width="12" height="24" />
+				<span>Lix</span>
+			</LinkChip>
+		</div>
 	</div>

-	<div>
-		<h2 class="border-t-2 border-teal-800 w-fit">
-			{DISTRO} — our linux distribution
+	<FlowerDivider />
+
+	<div class="">
+		<h2 class="w-fit text-4xl pb-4">
+			<span class="text-teal-500">{DISTRO}</span> — our linux distribution
 		</h2>
-		<div class="grid lg:grid-cols-[1.15fr,auto,1fr] gap-2 items-end">
+		<div class="grid lg:grid-cols-[1.15fr,calc(theme(gap.12)),1fr] items-end">
 			<div class="clear-left text-xl flex flex-col h-full">
 				Gain certainty in your deployed system configuration by
 				replacing your opaque state with code.
@ -37,10 +65,12 @@
 			<div class="text-4xl flex justify-center items-center h-full">
 				⇒
 			</div>
-			<div class="float-right drop-shadow flex flex-col rounded">
-				<div class="p-2 pb-4 bg-gradient-to-b from-zinc-100 from-40% to-white w-full flex justify-between">
-					<div><span class="text-zinc-700">http://</span><b>localhost</b>:80</div>
-					<span class="text-blue-700 font-black text-lg select-none -mt-[2px]">⨯</span>
+			<div class="float-right drop-shadow flex flex-col rounded overflow-hidden">
+				<div class="p-2 bg-gradient-to-b from-zinc-100 from-40% to-white w-full flex justify-between grow bg-teal-500">
+					<div class="p-1 px-3 bg-zinc-200 w-full rounded-sm">
+						<span class="text-zinc-700">http://</span><b>localhost</b>:80
+					</div>
+					<span class="text-zinc-700 font-black text-lg select-none pl-2">⨯</span>
 				</div>
 				<!-- screenshot taken as Responsive (3660x2121), DPR=1 in Firefox DevTools (@the phone/tablet icon) -->
 				<enhanced:img src="./demo1/mediawiki.png?format=png"
@ -50,17 +80,13 @@
 		</div>
 	</div>

-	<div>
-		<h2 class="border-t-2 border-teal-800 w-fit ms-auto">
-			a reimagining of the NixOS community
+	<FlowerDivider />
+
+	<div class="pb-60">
+		<h2 class="text-4xl w-fit pb-4">
+			A <span class="text-teal-500">reimagining</span> of the NixOS community
 		</h2>
-		<div class="grid lg:grid-cols-[1.1fr,1fr] gap-12">
-			<div class="float-right drop-shadow flex flex-col rounded">
-				<!-- screenshot taken as Responsive (1500x800), DPR=1, Zoom=150% in Firefox  -->
-				<enhanced:img src="./gerrit.png?format=png"
-					alt="Gerrit change list page"
-				/>
-			</div>
+		<div class="grid lg:grid-cols-[1.15fr,1fr] gap-12">
 			<div class="text-xl flex flex-col gap-4">
 				<p>
 					<b>Floral</b> was created to oversee <b>{PKGS}</b> — our nixpkgs fork,
@ -73,17 +99,26 @@
 				</p>

 				<div class="lg:h-0 mt-4">
-					<enhanced:img src="./fork.svg" class="lg:w-[75%] max-w-[400px] mx-auto">
+					<enhanced:img src="./fork.svg" class="lg:w-[75%] max-w-[400px] mx-auto" alt="a visual representation of the progression from Nixpkgs to Petalpkgs, NixOS to FleurixOS, and CppNix to Lix">
 				</div>
 			</div>
+			<div class="drop-shadow flex flex-col rounded overflow-hidden">
+				<!-- screenshot taken as Responsive (1500x800), DPR=1, Zoom=150% in Firefox  -->
+				<enhanced:img
+					src="./gerrit.png?format=png"
+					alt="Gerrit change list page"
+				/>
+			</div>
 		</div>
 	</div>

+	<FlowerDivider />
+
 	<div>
-		<h2 class="border-t-2 border-teal-800 w-fit">
-			…and much more!
+		<h2 class="text-4xl w-fit pb-4">
+			And much <span class="text-teal-500">more</span>!
 		</h2>
-		<div class="grid lg:grid-cols-[1fr,1fr]">
+		<div class="grid lg:grid-cols-[1.15fr,1fr]">
 			<div class="clear-left text-xl">
 				With <b>{DISTRO}</b> and <b>{PKGS}</b>, you can:
 				<ul class="ms-2 list-disc list-inside text-lg">
@ -111,7 +146,8 @@

 <!-- https://pad.lix.systems/v0Bew569R_2IB0abRSy4kA?view=#Pretty-much-final-draft-About-us -->

-<div class="grid lg:grid-cols-3 gap-6 justify-center my-8 w-full xl:w-[115%] xl:-ms-[7.5%] opacity-[0.4] hidden">
+{#if false}
+<div class="grid lg:grid-cols-3 gap-6 justify-center my-8 w-full xl:w-[115%] xl:-ms-[7.5%] opacity-[0.4]">
 	<div class="bg-blue-50 p-4 rounded-lg drop-shadow-lg">
 		<h3 class="text-2xl font-bold text-coral-600">Community Focused</h3>
 		Floral is a non-profit organization ran by volunteer developers.<br>
@ -130,5 +166,6 @@
 		you should have an easy time compared to traditional *nix distributions.
 	</div>
 </div>
+{/if}

 <!-- show nixos tests -->
--- a/src/routes/colors/Color.svelte
+++ b/src/routes/colors/Color.svelte
@ -1,14 +1,13 @@
 <script lang="ts">
-  export let colors;
-  export let name;
-  export let path = [];
+  import Color from "./Color.svelte";
+  let { colors, name, path = [] } = $props();
 </script>

 {#if typeof colors[name] == "object"}
  <h3 class="mb-0 text-xl text-center">{name}</h3>
  <div class="p-4 grid gap-4 grid-cols-2 lg:grid-cols-4 xl:grid-cols-6 auto-rows-auto">
    {#each Object.keys(colors[name]) as n}
-      <svelte:self name={n} colors={colors[name]} path={[...path, name]} />
+      <Color name={n} colors={colors[name]} path={[...path, name]} />
    {/each}
  </div>
  <hr />
--- a/src/routes/docs/+layout.svelte
+++ b/src/routes/docs/+layout.svelte
@ -1,4 +1,8 @@
-<div class="Layout-docs-root flex max-xl:flex-col lg:gap-2 justify-around">
+<script lang="ts">
+	let { children } = $props();
+</script>
+
+<div class="Layout-docs-root flex max-xl:flex-col lg:gap-8 justify-around">
 	<div class="grow xl:relative">
 		<nav class="mt-12 xl:absolute lg:right-0">
 			<ul
@ -13,15 +17,32 @@
 			</ul>
 		</nav>
 	</div>
-	<div class="Layout-docs-content max-w-[700px]"><slot /></div>
+	<div class="Layout-docs-content max-w-[740px] text-lg">{@render children?.()}</div>
 	<div class="grow"></div>
 </div>

 <style>
 	:global(.Layout-docs-content p:not(.no-docs-style)) {
-		@apply text-xl tracking-tight mb-1;
+		@apply mb-1;
 	}
+
 	:global(.Layout-docs-content h1:not(.no-docs-style)) {
-		@apply text-center underline underline-offset-8 decoration-teal-700 font-aladin text-teal-950;
+		@apply text-4xl lg:text-5xl my-4 text-center underline underline-offset-8 decoration-teal-800 font-aladin text-teal-950;
+	}
+
+	:global(.Layout-docs-content h2:not(.no-docs-style)) {
+		@apply text-teal-600 text-2xl font-semibold my-1;
+	}
+
+	:global(.Layout-docs-content h3:not(.no-docs-style)) {
+		@apply text-teal-600 text-xl font-semibold my-1;
+	}
+
+	:global(.Layout-docs-content h4:not(.no-docs-style)) {
+		@apply text-teal-700 font-semibold my-1;
+	}
+
+	:global(.Layout-docs-content [id]:not(.no-docs-style) > a > .icon.icon-link) {
+		@apply after:opacity-10 after:hover:opacity-100 after:inline-block after:font-sans after:content-['¶']  after:-ms-[1em] after:me-2 after:align-middle after:text-3xl after:text-zinc-400;
 	}
 </style>
--- a/src/routes/docs/petal/[...rest]/+page.server.ts
+++ b/src/routes/docs/petal/[...rest]/+page.server.ts
@ -0,0 +1,26 @@
+import type { PageServerLoad } from "./$types";
+import { join } from "path";
+import { renderToHtml } from "$lib/docs";
+import { stat } from "fs/promises";
+
+
+export const load: PageServerLoad = async (event) => {
+	let userPath = event.params.rest;
+	// we shouldn't need this, but it doesn't hurt.
+	if (userPath.split("/").find(c => /^\.*$/.test(c)))
+		throw new Error("url is sus");
+
+	const base = join(process.cwd(), ".petalpkgs");
+
+	{
+		const isFolder = await stat(join(base, userPath))
+			.then(f => f.isDirectory())
+			.catch(() => false);
+
+		if (isFolder) userPath += "/index";
+	}
+
+	return {
+		html: await renderToHtml({ base, path: userPath })
+	};
+};
--- a/src/routes/docs/petal/[...rest]/+page.svelte
+++ b/src/routes/docs/petal/[...rest]/+page.svelte
@ -0,0 +1,5 @@
+<script lang="ts">
+	import { page } from "$app/stores";
+</script>
+
+{@html $page.data.html}
--- a/static/favicon.png
+++ b/static/favicon.png
--- a/svelte.config.js
+++ b/svelte.config.js
@ -1,12 +1,9 @@
-import adapter from "@sveltejs/adapter-auto";
+import adapter from "@sveltejs/adapter-node";
 import { vitePreprocess } from "@sveltejs/vite-plugin-svelte";

 /** @type {import('@sveltejs/kit').Config} */
 const config = {
 	kit: {
-		// adapter-auto only supports some environments, see https://kit.svelte.dev/docs/adapter-auto for a list.
-		// If your environment is not supported, or you settled on a specific environment, switch out the adapter.
-		// See https://kit.svelte.dev/docs/adapters for more information about adapters.
 		adapter: adapter()
 	},
 	preprocess: vitePreprocess()
--- a/tailwind.config.js
+++ b/tailwind.config.js
@ -39,6 +39,7 @@ export default {
 				'800': '#a41110',
 				'900': '#881514',
 				'950': '#4a0505',
+                '970': '#1f0202',
 			},
 			teal: {
 				'50': '#eefbf5',
--- a/vite.config.js
+++ b/vite.config.js
@ -4,9 +4,13 @@ import { defineConfig } from "vite";

 export default defineConfig({
 	plugins: [sveltekit(), enhancedImages()],
-    server: {
-        fs: {
-            allow: ["./tailwind.config.js"]
-        }
-    }
+	server: {
+		watch: {
+			// absurdly big
+			ignored: (file) => /\/(\.direnv|\.petalpkgs)$/.test(file)
+		},
+		fs: {
+			allow: ["./tailwind.config.js", "./.petalpkgs"]
+		}
+	}
 });
Author	SHA1	Message	Date
mei (ckie)	bea68b93d5	feat(Highlight): fix svelte warn (aria-hidden)	2024-11-24 02:44:36 +02:00
mei (ckie)	9474e7d3f0	fix(remark-include): disable scary codepath	2024-11-24 02:26:24 +02:00
mei (ckie)	b39a017918	feat: Support implicit index.md in /docs/petal/…/folder	2024-11-24 02:26:24 +02:00
mei (ckie)	f8db23ad7d	cleanup(remark-include): stray log; clarify	2024-11-24 02:26:24 +02:00
mei (ckie)	f82f51be6f	fix(vite.config): also ignore .direnv	2024-11-24 02:26:24 +02:00
mei (ckie)	74f52215d1	feat($lib/docs): introduce new docs pipeline	2024-11-24 02:26:24 +02:00
mei (ckie)	db034e7731	chore(svelte.config): switch to adapter-node	2024-11-24 02:26:24 +02:00
mei (ckie)	21db765fed	feat(flake): make petalpkgs src available for docs	2024-11-24 02:26:24 +02:00
mei (ckie)	a62087432e	fix(docs): return styling to pre-regression (global style removal)	2024-10-27 01:39:38 +03:00
Jake Hamilton	2bfe24b195	feat(root page): break out hero links into chips, add accent colors on hover	2024-10-27 01:31:14 +03:00
Jake Hamilton	99800ce829	feat(root page): redesign the hero element, add dividers between sections	2024-10-27 01:30:33 +03:00
Jake Hamilton	18dfb6face	feat(root page): redesign the hero element, add dividers between sections Co-authored-by: ckie <git-525ff67@ckie.dev>	2024-10-27 01:23:33 +03:00
mei (ckie)	11ca9cd554	feat: setup lint-staged with prettier	2024-10-27 00:42:30 +03:00
mei (ckie)	f530be0493	fix(/): don't include old blocks in DOM	2024-10-25 16:34:09 +03:00
mei (ckie)	c83929cbdd	fix(package.json): move "@sveltejs/enhanced-img" to devDeps	2024-10-25 01:55:28 +03:00
mei (ckie)	518fbaf61e	feat(layout): ?uwu qs == spin Co-authored-by: Jake Hamilton <jake.hamilton@hey.com>	2024-10-25 01:51:56 +03:00
mei (ckie)	d3ba4573c9	chore(Footer): move to $lib/components	2024-10-25 01:30:09 +03:00
mei (ckie)	7619e48d75	refactor(layout): adjust title text colors, introduce new colors.coral.970	2024-10-25 01:29:49 +03:00
mei (ckie)	285237cf7a	fix(layout): use same color-set for unhovered state	2024-10-25 01:10:48 +03:00
mei (ckie)	4b25036169	refactor(Search): constrain max width	2024-10-25 01:06:27 +03:00
mei (ckie)	1eddddd7d1	fix(Nav): make special link semibold	2024-10-25 00:57:54 +03:00
Jake Hamilton	86eecefea4	refactor(header): extract nav link component, add search widget stub, recolor header refactor(search): darken colors	2024-10-24 14:42:19 -07:00
mei (ckie)	bc3b7aa618	feat(favicon): update to rendered flower.svg	2024-10-24 16:27:43 +00:00
Jake Hamilton	7ea2efd2a5	fix(header): add alt text for logo image	2024-10-24 16:27:43 +00:00
Jake Hamilton	11bc2e9241	refactor(logo): use solid colors, simplify design	2024-10-24 16:27:43 +00:00
Jake Hamilton	6bb585f305	feat: add logo assets	2024-10-24 16:27:43 +00:00
mei (ckie)	ddbd99a5e8	feat(Nav): split out from layout, use snippet	2024-10-24 16:49:41 +03:00
mei (ckie)	6e5337f50a	fix(docs/layout): constrain default width	2024-10-24 16:33:35 +03:00
mei (ckie)	06db3533f0	feat(*): migrate to svelte 5 with `bunx sv migrate`	2024-10-24 16:31:12 +03:00
mei (ckie)	61b65cd2b8	feat(layout): add link to docs	2024-10-24 16:00:56 +03:00
mei (ckie)	477e096874	fix(/): fix intergrid alignment	2024-10-23 22:14:08 +03:00
mei (ckie)	7fc3f406dd	fix(Highlight): remove <hidden> tags in code examples	2024-10-23 22:14:02 +03:00
Jake Hamilton	5f9c951db4	refactor: make example preview look more like a recognizable application window	2024-10-23 18:37:07 +00:00
Jake Hamilton	1e09cd6705	fix: clip corners of gerrit preview image	2024-10-23 10:17:02 -07:00