adds starlight docs

docs/.gitignore

@@ -0,0 +1,21 @@
+# build output
+dist/
+# generated types
+.astro/
+
+# dependencies
+node_modules/
+
+# logs
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+
+
+# environment variables
+.env
+.env.production
+
+# macOS-specific files
+.DS_Store

docs/README.md

@@ -0,0 +1,55 @@
+# Starlight Starter Kit: Tailwind
+
+[![Built with Starlight](https://astro.badg.es/v2/built-with-starlight/tiny.svg)](https://starlight.astro.build)
+
+```
+npm create astro@latest -- --template starlight/tailwind
+```
+
+[![Open in StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/withastro/starlight/tree/main/examples/tailwind)
+[![Open with CodeSandbox](https://assets.codesandbox.io/github/button-edit-lime.svg)](https://codesandbox.io/p/sandbox/github/withastro/starlight/tree/main/examples/tailwind)
+[![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/clone?repository-url=https%3A%2F%2Fgithub.com%2Fwithastro%2Fstarlight%2Ftree%2Fmain%2Fexamples%2Ftailwind&project-name=my-starlight-docs&repository-name=my-starlight-docs)
+
+> 🧑‍🚀 **Seasoned astronaut?** Delete this file. Have fun!
+
+## 🚀 Project Structure
+
+Inside of your Astro + Starlight project, you'll see the following folders and files:
+
+```
+.
+├── public/
+├── src/
+│   ├── assets/
+│   ├── content/
+│   │   ├── docs/
+│   │   └── config.ts
+│   └── env.d.ts
+├── astro.config.mjs
+├── package.json
+├── tailwind.config.mjs
+└── tsconfig.json
+```
+
+Starlight looks for `.md` or `.mdx` files in the `src/content/docs/` directory. Each file is exposed as a route based on its file name.
+
+Images can be added to `src/assets/` and embedded in Markdown with a relative link.
+
+Static assets, like favicons, can be placed in the `public/` directory.
+
+## 🧞 Commands
+
+All commands are run from the root of the project, from a terminal:
+
+| Command                   | Action                                           |
+| :------------------------ | :----------------------------------------------- |
+| `npm install`             | Installs dependencies                            |
+| `npm run dev`             | Starts local dev server at `localhost:4321`      |
+| `npm run build`           | Build your production site to `./dist/`          |
+| `npm run preview`         | Preview your build locally, before deploying     |
+| `npm run astro ...`       | Run CLI commands like `astro add`, `astro check` |
+| `npm run astro -- --help` | Get help using the Astro CLI                     |
+
+## 👀 Want to learn more?
+
+Check out [Starlight’s docs](https://starlight.astro.build/), read [the Astro documentation](https://docs.astro.build), or jump into the [Astro Discord server](https://astro.build/chat).

docs/astro.config.mjs

@@ -0,0 +1,37 @@
+import { defineConfig } from 'astro/config';
+import starlight from '@astrojs/starlight';
+import tailwind from '@astrojs/tailwind';
+
+import svelte from "@astrojs/svelte";
+
+// https://astro.build/config
+export default defineConfig({
+  integrations: [starlight({
+    title: 'Docs with Tailwind',
+    logo: {
+      light: '/src/assets/logo_dark.svg',
+      dark: '/src/assets/logo_light.svg',
+      replacesTitle: true
+    },
+    social: {
+      github: 'https://github.com/flomp/wanderer'
+    },
+    sidebar: [{
+      label: 'Guides',
+      items: [
+      // Each item here is one entry in the navigation menu.
+      {
+        label: 'Example Guide',
+        link: '/guides/example/'
+      }]
+    }, {
+      label: 'Reference',
+      autogenerate: {
+        directory: 'reference'
+      }
+    }],
+    customCss: ['./src/tailwind.css', '@fontsource/ibm-plex-sans/400.css', '@fontsource/ibm-plex-sans/600.css', '@fontsource/ibm-plex-mono/400.css', '@fontsource/ibm-plex-mono/600.css']
+  }), tailwind({
+    applyBaseStyles: false
+  }), svelte()]
+});

docs/package.json

@@ -0,0 +1,26 @@
+{
+  "name": "docs",
+  "type": "module",
+  "version": "0.0.1",
+  "scripts": {
+    "dev": "astro dev",
+    "start": "astro dev",
+    "build": "astro check && astro build",
+    "preview": "astro preview",
+    "astro": "astro"
+  },
+  "dependencies": {
+    "@astrojs/check": "^0.7.0",
+    "@astrojs/starlight": "^0.24.0",
+    "@astrojs/starlight-tailwind": "^2.0.3",
+    "@astrojs/svelte": "^5.5.0",
+    "@astrojs/tailwind": "^5.1.0",
+    "@fontsource/ibm-plex-mono": "^5.0.13",
+    "@fontsource/ibm-plex-sans": "^5.0.20",
+    "astro": "^4.8.6",
+    "sharp": "^0.32.5",
+    "svelte": "^4.2.18",
+    "tailwindcss": "^3.4.1",
+    "typescript": "^5.4.5"
+  }
+}

docs/public/favicon.svg

@@ -0,0 +1,23 @@
+<svg width="512" height="512" viewBox="0 0 512 512" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M282.194 510.676C411.274 497.557 512 388.542 512 256C512 114.615 397.385 0 256 0C114.615 0 0 114.615 0 256C0 352.324 53.199 436.222 131.818 479.917C180.739 464.052 227.195 443.583 237.5 421C244.301 406.097 233.287 391.002 223.456 377.528C216.971 368.639 211 360.456 211 353.5C211 320.569 300.5 310 300.5 310H331.5C331.5 310 248.5 320.5 252.5 353.5C253.84 364.557 262.721 373.406 272.808 383.458C282.974 393.588 294.364 404.939 300.5 421C315.277 459.681 289.253 500.629 282.194 510.676Z" fill="#242734"/>
+<path d="M348.212 206.014C349.872 203.329 354.021 203.329 355.681 206.014L416.362 304.207C418.022 306.893 415.947 310.25 412.628 310.25H291.265C287.945 310.25 285.871 306.893 287.531 304.207L348.212 206.014Z" fill="white"/>
+<path d="M164.723 183.276C166.612 180.005 171.334 180.005 173.223 183.276L242.282 302.889C244.17 306.161 241.809 310.25 238.032 310.25H99.9145C96.137 310.25 93.776 306.161 95.6648 302.889L164.723 183.276Z" fill="white"/>
+<path d="M266.25 155C268.56 151 274.333 151 276.643 155L361.08 301.25C363.389 305.25 360.503 310.25 355.884 310.25H187.009C182.39 310.25 179.503 305.25 181.813 301.25L266.25 155Z" fill="white"/>
+<path d="M148.413 115.398C139.829 115.398 132.87 126.079 132.87 139.255H163.957C163.957 126.079 156.998 115.398 148.413 115.398Z" fill="white"/>
+<path d="M123.11 115.398C108.138 115.398 96 126.079 96 139.255H150.221C150.221 126.079 138.083 115.398 123.11 115.398Z" fill="white"/>
+<path d="M134.316 106C125.532 106 118.411 115.386 118.411 126.965H150.221C150.221 115.386 143.1 106 134.316 106Z" fill="white"/>
+<path d="M276 67C264.402 67 255 79.9837 255 96H297C297 79.9837 287.598 67 276 67Z" fill="white"/>
+<path d="M250 79C237.85 79 228 86.6112 228 96H272C272 86.6112 262.15 79 250 79Z" fill="white"/>
+<path d="M255 63C245.611 63 238 72.402 238 84H272C272 72.402 264.389 63 255 63Z" fill="white"/>
+<path d="M396.5 139C387.94 139 381 147.954 381 159H412C412 147.954 405.06 139 396.5 139Z" fill="white"/>
+<path d="M365 138C352.85 138 343 147.402 343 159H387C387 147.402 377.15 138 365 138Z" fill="white"/>
+<path d="M377 127C364.297 127 354 136.402 354 148H400C400 136.402 389.703 127 377 127Z" fill="white"/>
+<path d="M113.567 421.162C113.567 419.505 114.91 418.162 116.567 418.162H123.285C124.942 418.162 126.285 419.505 126.285 421.162V425.76C126.285 427.417 124.942 428.76 123.285 428.76H116.567C114.91 428.76 113.567 427.417 113.567 425.76V421.162Z" fill="white"/>
+<path d="M117.379 394.3C118.857 393.079 120.994 393.079 122.473 394.3L144.391 412.402C147.282 414.79 145.594 419.487 141.844 419.487H98.008C94.258 419.487 92.5695 414.79 95.4607 412.402L117.379 394.3Z" fill="white"/>
+<path d="M117.172 382.093C118.715 380.627 121.136 380.627 122.68 382.093L142.519 400.927C145.14 403.416 143.379 407.828 139.765 407.828H100.086C96.4722 407.828 94.7112 403.416 97.3322 400.928L117.172 382.093Z" fill="white"/>
+<path d="M116.856 370.436C118.455 368.521 121.397 368.521 122.996 370.436L139.007 389.606C141.182 392.211 139.33 396.17 135.937 396.17H103.915C100.521 396.17 98.6693 392.211 100.845 389.606L116.856 370.436Z" fill="white"/>
+<path d="M347.567 397.162C347.567 395.505 348.91 394.162 350.567 394.162H357.285C358.942 394.162 360.285 395.505 360.285 397.162V401.76C360.285 403.417 358.942 404.76 357.285 404.76H350.567C348.91 404.76 347.567 403.417 347.567 401.76V397.162Z" fill="white"/>
+<path d="M351.379 370.3C352.857 369.079 354.994 369.079 356.473 370.3L378.391 388.402C381.282 390.79 379.594 395.487 375.844 395.487H332.008C328.258 395.487 326.569 390.79 329.461 388.402L351.379 370.3Z" fill="white"/>
+<path d="M351.172 358.093C352.715 356.627 355.136 356.627 356.68 358.093L376.519 376.927C379.14 379.416 377.379 383.828 373.765 383.828H334.086C330.472 383.828 328.711 379.416 331.332 376.928L351.172 358.093Z" fill="white"/>
+<path d="M350.856 346.436C352.455 344.521 355.397 344.521 356.996 346.436L373.007 365.606C375.182 368.211 373.33 372.17 369.937 372.17H337.915C334.521 372.17 332.669 368.211 334.845 365.606L350.856 346.436Z" fill="white"/>
+</svg>

docs/src/components/button.svelte

@@ -0,0 +1,34 @@
+<script lang="ts">
+    export let type: "button" | "submit" | "reset" | null | undefined =
+        undefined;
+    export let icon: string = "";
+    export let extraClasses: string = "";
+    export let primary: boolean = false;
+    export let secondary: boolean = false;
+    export let large: boolean = false;
+    export let loading: boolean = false;
+    export let disabled: boolean = false;
+    export let tooltip: string = "";
+</script>
+
+<button
+    class="{extraClasses} flex items-center justify-center"
+    class:btn-primary={primary}
+    class:btn-secondary={secondary}
+    class:btn-large={large}
+    class:btn-disabled={disabled || loading}
+    disabled={disabled || loading}
+    class:tooltip={tooltip.length > 0}
+    data-title={tooltip}
+    on:click
+    {type}
+>
+    {#if !loading}
+        {#if icon}
+            <i class="fa fa-{icon} mr-2"></i>
+        {/if}
+        <slot />
+    {:else}
+        <div class="spinner"></div>
+    {/if}
+</button>

docs/src/content/config.ts

@@ -0,0 +1,6 @@
+import { defineCollection } from 'astro:content';
+import { docsSchema } from '@astrojs/starlight/schema';
+
+export const collections = {
+	docs: defineCollection({ schema: docsSchema() }),
+};

docs/src/content/docs/guides/example.md

@@ -0,0 +1,11 @@
+---
+title: Example Guide
+description: A guide in my new Starlight docs site.
+---
+
+Guides lead a user through a specific task they want to accomplish, often with a sequence of steps.
+Writing a good guide requires thinking about what your users are trying to do.
+
+## Further reading
+
+- Read [about how-to guides](https://diataxis.fr/how-to-guides/) in the Diátaxis framework

docs/src/content/docs/index.mdx

@@ -0,0 +1,50 @@
+---
+title: Welcome to wanderer
+description: The self-hosted trail database
+template: splash
+hero:
+  title: |
+    Welcome to <span class="-tracking-[0.075em] s-y_bCXRrkrYfP">wanderer</span>
+  tagline: <span class="-tracking-[0.075em] s-y_bCXRrkrYfP">wanderer</span> is a self-hosted trail database. You can upload your recorded GPS tracks or create new ones and add various metadata to build an easily searchable catalogue.
+  image:
+    file: ../../assets/logo_dark.svg
+  actions:
+    - text: Read the docs
+      link: /guides/example/
+      icon: right-arrow
+      variant: primary
+    - text: Visit the demo
+      link: https://demo.wanderer.sh
+      icon: external
+---
+
+import { Card, CardGrid } from '@astrojs/starlight/components';
+import Button from '../../components/button.svelte';
+
+## Features
+
+<div class="grid grid-cols-1 md:grid-cols-3 gap-4">
+  <div class="mt-4">
+    <Card title="Manage your trails" icon="pencil">
+      Upload your trails from multiple file formats (like GPX or TCX) or plan a new trail directly in <span class="-tracking-[0.075em] s-y_bCXRrkrYfP">wanderer</span> with the route drawing tool.
+
+      [Learn more →]()
+    </Card>
+  </div>
+	<Card title="Advanced filters and search" icon="magnifier">
+		<span class="-tracking-[0.075em] s-y_bCXRrkrYfP">wanderer</span> comes with extensive filter and search functionality right out of the box, so you can focus only on the trails relevant to you.
+	</Card>
+	<Card title="Full API support" icon="open-book">
+		Use <span class="-tracking-[0.075em] s-y_bCXRrkrYfP">wanderer</span>'s API to interact with your trail data directly and automate the tasks that you don't want to do manually.
+
+    [API reference →]()
+	</Card>
+</div>
+
+## Contributing
+
+Help is welcome at any time. Check out the [GitHub repository](https://github.com/Flomp/wanderer). to get started. If you are not sure where you can help, check the [roadmap](https://github.com/users/Flomp/projects/2) for features in the backlog. If you would like to contribute a translation, you can do so [here](https://crowdin.com/project/wanderer).
+
+## Support <span class="-tracking-[0.075em] s-y_bCXRrkrYfP">wanderer</span>
+
+<span class="-tracking-[0.075em] s-y_bCXRrkrYfP">wanderer</span> is a passion project and will always stay free and open-source. If you like <span class="-tracking-[0.075em] s-y_bCXRrkrYfP">wanderer</span> and want to support it's development you can make a small donation and [buy me a coffee](https://buymeacoffee.com/wanderertrails).

docs/src/content/docs/reference/example.md

@@ -0,0 +1,11 @@
+---
+title: Example Reference
+description: A reference page in my new Starlight docs site.
+---
+
+Reference pages are ideal for outlining how things work in terse and clear terms.
+Less concerned with telling a story or addressing a specific use case, they should give a comprehensive outline of what your documenting.
+
+## Further reading
+
+- Read [about reference](https://diataxis.fr/reference/) in the Diátaxis framework

docs/src/env.d.ts

@@ -0,0 +1,2 @@
+/// <reference path="../.astro/types.d.ts" />
+/// <reference types="astro/client" />

docs/src/tailwind.css

@@ -0,0 +1,8 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+/*
+Add additional Tailwind styles to this file, for example with @layer:
+https://tailwindcss.com/docs/adding-custom-styles#using-css-and-layer
+*/

docs/svelte.config.js

@@ -0,0 +1,5 @@
+import { vitePreprocess } from '@astrojs/svelte';
+
+export default {
+	preprocess: vitePreprocess(),
+}

docs/tailwind.config.mjs

@@ -0,0 +1,24 @@
+import colors from 'tailwindcss/colors';
+import starlightPlugin from '@astrojs/starlight-tailwind';
+
+/** @type {import('tailwindcss').Config} */
+export default {
+	content: ['./src/**/*.{astro,html,js,jsx,md,mdx,svelte,ts,tsx,vue}'],
+	theme: {
+		extend: {
+			colors: {
+				// Your preferred accent color. Indigo is closest to Starlight’s defaults.
+				accent: colors.blue,
+				// Your preferred gray scale. Zinc is closest to Starlight’s defaults.
+				gray: "#242734",
+			},
+			fontFamily: {
+				// Deine bevorzugte Schriftart. Starlight verwendet standardmäßig eine Systemschriftart.
+				sans: ['"IBM Plex Sans"'],
+				// Deine bevorzugte Code-Schriftart. Starlight verwendet standardmäßig die Systemschriftart Monospace.
+				mono: ['"IBM Plex Mono"'],
+			},
+		},
+	},
+	plugins: [starlightPlugin()],
+};

docs/tsconfig.json

@@ -0,0 +1,3 @@
+{
+  "extends": "astro/tsconfigs/strict"
+}