mirror of
https://github.com/pockethost/pockethost.git
synced 2025-03-30 15:08:30 +00:00
refactor doc sidebar links
This commit is contained in:
Ben Allfree
parent
3da1c5522f
commit
d5e8360045
@ -16,6 +16,7 @@
|
||||
"esbuild",
|
||||
"eventsource",
|
||||
"Flouder's",
|
||||
"Frontends",
|
||||
"fullchain",
|
||||
"geoip",
|
||||
"getenv",
|
||||
|
||||
@ -1,52 +1,57 @@
|
||||
<script>
|
||||
// Define the width of the sidebar
|
||||
const sidebarWidth = '300px'
|
||||
import { page } from '$app/stores';
|
||||
import { page } from '$app/stores'
|
||||
import DocLink from './DocLink.svelte'
|
||||
</script>
|
||||
|
||||
<div class="container-fluid mt-4 flex gap-6 flex-col-reverse md:flex-row">
|
||||
<div class="w-full md:w-fit bg-base-200 rounded-r-lg py-4">
|
||||
<ul class="menu text-base">
|
||||
<li class="menu-title">Overview</li>
|
||||
<li><a class:active={$page.url.pathname.endsWith("/docs")} href="/docs">Introduction</a></li>
|
||||
<li><a class:active={$page.url.pathname.endsWith("/docs/getting-started")} href="/docs/getting-started">Getting Started</a></li>
|
||||
<DocLink path="introduction" title="Introduction" />
|
||||
<DocLink path="getting-started" title="Getting Started" />
|
||||
</ul>
|
||||
<ul class="menu">
|
||||
<li class="menu-title">Instance Management</li>
|
||||
<li><a class:active={$page.url.pathname.endsWith("/docs/create")} href="/docs/create">Create</a></li>
|
||||
<li><a class:active={$page.url.pathname.endsWith("/docs/accessing")} href="/docs/accessing">Connect</a></li>
|
||||
<li><a class:active={$page.url.pathname.endsWith("/docs/power")} href="/docs/power">Power</a></li>
|
||||
<li><a class:active={$page.url.pathname.endsWith("/docs/rename-instance")} href="/docs/rename-instance">Rename</a></li>
|
||||
<li><a class:active={$page.url.pathname.endsWith("/docs/delete")} href="/docs/delete">Delete</a></li>
|
||||
<li><a class:active={$page.url.pathname.endsWith("/docs/limits")} href="/docs/limits">Limits</a></li>
|
||||
<li><a class:active={$page.url.pathname.endsWith("/docs/smtp")} href="/docs/smtp">Outgoing Email</a></li>
|
||||
<li><a class:active={$page.url.pathname.endsWith("/docs/versions")} href="/docs/versions">Changing Versions</a></li>
|
||||
<li><a class:active={$page.url.pathname.endsWith("/docs/s3")} href="/docs/s3">Using S3 Storage</a></li>
|
||||
<li><a class:active={$page.url.pathname.endsWith("/docs/custiom-binaries")} href="/docs/custom-binaries">Custom Binaries</a></li>
|
||||
<li><a class:active={$page.url.pathname.endsWith("/docs/custom-domains")} href="/docs/custom-domains">Custom Domains</a></li>
|
||||
<li><a class:active={$page.url.pathname.endsWith("/docs/backup-restore")} href="/docs/backup-restore">Backup/Restore</a></li>
|
||||
<DocLink path="create" title="Create" />
|
||||
<DocLink path="accessing" title="Connect" />
|
||||
<DocLink path="power" title="Power" />
|
||||
<DocLink path="rename-instance" title="Rename" />
|
||||
<DocLink path="delete" title="Delete" />
|
||||
<DocLink path="limits" title="Limits" />
|
||||
<DocLink path="smtp" title="Outgoing Email" />
|
||||
<DocLink path="versions" title="Changing Versions" />
|
||||
<DocLink path="s3" title="Using S3 Storage" />
|
||||
<DocLink path="custom-binaries" title="Custom Binaries" />
|
||||
<DocLink path="custom-domains" title="Custom Domains" />
|
||||
<DocLink path="backup-restore" title="Backup/Restore" />
|
||||
</ul>
|
||||
<ul class="menu">
|
||||
<li class="menu-title">Daily Use Guide</li>
|
||||
<li><a class:active={$page.url.pathname.endsWith("/docs/logs")} href="/docs/logs">Logging</a></li>
|
||||
<li><a class:active={$page.url.pathname.endsWith("/docs/dev-mode")} href="/docs/dev-mode">Dev Mode</a></li>
|
||||
<li><a class:active={$page.url.pathname.endsWith("/docs/secrets")} href="/docs/secrets">Secrets</a></li>
|
||||
<li><a class:active={$page.url.pathname.endsWith("/docs/ftp")} href="/docs/ftp">FTP Access</a></li>
|
||||
<li><a class:active={$page.url.pathname.endsWith("/docs/admin-sync")} href="/docs/admin-sync">Admin Sync</a></li>
|
||||
<li><a class:active={$page.url.pathname.endsWith("/docs/js")} href="/docs/js">Extending via JS</a></li>
|
||||
<DocLink path="logs" title="Logging" />
|
||||
<DocLink path="dev-mode" title="Dev Mode" />
|
||||
<DocLink path="secrets" title="Secrets" />
|
||||
<DocLink path="ftp" title="FTP Access" />
|
||||
<DocLink path="admin-sync" title="Admin Sync" />
|
||||
<DocLink path="js" title="Extending via JS" />
|
||||
</ul>
|
||||
<ul class="menu">
|
||||
<li class="menu-title">Programming Guide</li>
|
||||
<li><a class:active={$page.url.pathname.endsWith("/docs/programming")} href="/docs/programming">Frontends and JS Hooks</a></li>
|
||||
<DocLink path="programming" title="Frontends and JS Hooks" />
|
||||
<DocLink
|
||||
path="server-side-pocketbase-antipattern"
|
||||
title="Server-Side PocketBase is an Anti-Pattern"
|
||||
/>
|
||||
</ul>
|
||||
<ul class="menu">
|
||||
<li class="menu-title">Appendix</li>
|
||||
<li><a class:active={$page.url.pathname.endsWith("/docs/account-creation")} href="/docs/account-creation">Account Creation</a></li>
|
||||
<li><a class:active={$page.url.pathname.endsWith("/docs/pricing-ethos")} href="/docs/pricing-ethos">Pricing Ethos</a></li>
|
||||
<li><a class:active={$page.url.pathname.endsWith("/docs/faq")} href="/docs/faq">FAQ</a></li>
|
||||
<li><a class:active={$page.url.pathname.endsWith("/docs/gs-gmail")} href="/docs/gs-gmail">Google Suite Gmail Setup</a></li>
|
||||
<li><a class:active={$page.url.pathname.endsWith("/docs/ses")} href="/docs/ses">Amazon SES Setup</a></li>
|
||||
<li><a class:active={$page.url.pathname.endsWith("/docs/self-hosting")} href="/docs/self-hosting">Self-Hosting</a></li>
|
||||
<DocLink path="account-creation" title="Account Creation" />
|
||||
<DocLink path="pricing-ethos" title="Pricing Ethos" />
|
||||
<DocLink path="faq" title="FAQ" />
|
||||
<DocLink path="gs-gmail" title="Google Suite Gmail Setup" />
|
||||
<DocLink path="ses" title="Amazon SES Setup" />
|
||||
<DocLink path="self-hosting" title="Self-Hosting" />
|
||||
</ul>
|
||||
</div>
|
||||
<div class="docs-content prose p-5 w-full md:w-fit md:max-w-[50%]">
|
||||
@ -55,7 +60,8 @@
|
||||
</div>
|
||||
|
||||
<style lang="scss">
|
||||
.menu, .menu-title {
|
||||
@apply text-base
|
||||
.menu,
|
||||
.menu-title {
|
||||
@apply text-base;
|
||||
}
|
||||
</style>
|
||||
|
||||
18
packages/dashboard/src/routes/(static)/docs/DocLink.svelte
Normal file
18
packages/dashboard/src/routes/(static)/docs/DocLink.svelte
Normal file
@ -0,0 +1,18 @@
|
||||
<script lang="ts">
|
||||
import { page } from '$app/stores'
|
||||
|
||||
export let path: string
|
||||
export let title: string
|
||||
|
||||
$: isActive = $page.url.pathname.endsWith(`/docs/${path}`)
|
||||
</script>
|
||||
|
||||
<li class:active={isActive} class="w-48">
|
||||
<a href={`/docs/${path}`}>{title}</a>
|
||||
</li>
|
||||
|
||||
<style lang="scss">
|
||||
li.active {
|
||||
@apply bg-neutral rounded-md;
|
||||
}
|
||||
</style>
|
||||
Loading…
x
Reference in New Issue
Block a user