feat(brand): wire anhh-* tokens, fonts, ~/ vite alias, WHP sidebar
This commit is contained in:
@@ -1,26 +1,64 @@
|
||||
// @ts-check
|
||||
import { defineConfig } from 'astro/config';
|
||||
import starlight from '@astrojs/starlight';
|
||||
import sitemap from '@astrojs/sitemap';
|
||||
import { fileURLToPath } from 'node:url';
|
||||
|
||||
// https://astro.build/config
|
||||
export default defineConfig({
|
||||
integrations: [
|
||||
starlight({
|
||||
title: 'My Docs',
|
||||
social: [{ icon: 'github', label: 'GitHub', href: 'https://github.com/withastro/starlight' }],
|
||||
sidebar: [
|
||||
{
|
||||
label: 'Guides',
|
||||
items: [
|
||||
// Each item here is one entry in the navigation menu.
|
||||
{ label: 'Example Guide', slug: 'guides/example' },
|
||||
],
|
||||
},
|
||||
{
|
||||
label: 'Reference',
|
||||
items: [{ autogenerate: { directory: 'reference' } }],
|
||||
},
|
||||
],
|
||||
}),
|
||||
],
|
||||
site: 'https://kb.anhonesthost.com',
|
||||
vite: {
|
||||
resolve: {
|
||||
alias: {
|
||||
// `~` resolves to /src so partial imports are depth-independent:
|
||||
// import SignIn from '~/content/partials/signing-in.mdx';
|
||||
'~': fileURLToPath(new URL('./src', import.meta.url)),
|
||||
},
|
||||
},
|
||||
},
|
||||
integrations: [
|
||||
starlight({
|
||||
title: 'An Honest Host KB',
|
||||
description: 'Customer documentation for WHP and other An Honest Host services.',
|
||||
logo: {
|
||||
src: './src/assets/logo.svg',
|
||||
replacesTitle: false,
|
||||
},
|
||||
customCss: [
|
||||
'@fontsource-variable/inter',
|
||||
'@fontsource-variable/jetbrains-mono',
|
||||
'./src/styles/anhh-tokens.css',
|
||||
],
|
||||
editLink: {
|
||||
baseUrl: 'https://repo.anhonesthost.net/cloud-hosting-platform/kb-anhonesthost/_edit/main/',
|
||||
},
|
||||
sidebar: [
|
||||
{
|
||||
label: 'WHP',
|
||||
items: [
|
||||
{
|
||||
label: 'Getting started',
|
||||
items: [{ autogenerate: { directory: 'whp/getting-started' } }],
|
||||
},
|
||||
{
|
||||
label: 'How-to guides',
|
||||
items: [{ autogenerate: { directory: 'whp/how-to' } }],
|
||||
},
|
||||
{
|
||||
label: 'Reference',
|
||||
items: [{ autogenerate: { directory: 'whp/reference' } }],
|
||||
},
|
||||
{
|
||||
label: 'Add-ons',
|
||||
items: [{ autogenerate: { directory: 'whp/add-ons' } }],
|
||||
},
|
||||
],
|
||||
},
|
||||
// Future products only appear once they have content.
|
||||
],
|
||||
pagefind: true,
|
||||
lastUpdated: true,
|
||||
}),
|
||||
sitemap(),
|
||||
],
|
||||
});
|
||||
|
||||
@@ -7,6 +7,7 @@
|
||||
"start": "astro dev",
|
||||
"build": "astro build",
|
||||
"preview": "astro preview",
|
||||
"check": "astro check",
|
||||
"astro": "astro"
|
||||
},
|
||||
"dependencies": {
|
||||
|
||||
4
src/assets/logo.svg
Normal file
4
src/assets/logo.svg
Normal file
@@ -0,0 +1,4 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 120 32" width="120" height="32">
|
||||
<text x="0" y="22" font-family="Inter,system-ui,sans-serif" font-size="20" font-weight="700" fill="#00d4aa">AHH</text>
|
||||
<text x="50" y="22" font-family="Inter,system-ui,sans-serif" font-size="20" font-weight="400" fill="currentColor">KB</text>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 340 B |
85
src/styles/anhh-tokens.css
Normal file
85
src/styles/anhh-tokens.css
Normal file
@@ -0,0 +1,85 @@
|
||||
/*
|
||||
* An Honest Host brand tokens, mapped onto Starlight's CSS custom properties.
|
||||
* Source palette: design spec § 8.
|
||||
*/
|
||||
|
||||
:root {
|
||||
/* Brand palette — constants across modes */
|
||||
--anhh-primary: #1a56db;
|
||||
--anhh-primary-hover: #2563eb;
|
||||
--anhh-accent: #00d4aa;
|
||||
|
||||
/* Typography */
|
||||
--sl-font: 'Inter Variable', 'Inter', system-ui, -apple-system, sans-serif;
|
||||
--sl-font-mono: 'JetBrains Mono Variable', 'JetBrains Mono', ui-monospace, monospace;
|
||||
|
||||
/* Map brand → Starlight accent (both modes) */
|
||||
--sl-color-accent: var(--anhh-primary);
|
||||
--sl-color-accent-high: var(--anhh-primary-hover);
|
||||
--sl-color-accent-low: rgba(26, 86, 219, 0.15);
|
||||
}
|
||||
|
||||
/* Dark mode — Starlight default */
|
||||
:root,
|
||||
:root[data-theme='dark'] {
|
||||
--anhh-bg: #0a1628;
|
||||
--anhh-bg-elevated: #111827;
|
||||
--anhh-bg-surface: #1e293b;
|
||||
--anhh-text-primary: #f0f4ff;
|
||||
--anhh-text-secondary: #94a3b8;
|
||||
--anhh-text-muted: #64748b;
|
||||
--anhh-border-color: #334155;
|
||||
--anhh-accent-dim: rgba(0, 212, 170, 0.1);
|
||||
--anhh-accent-border: rgba(0, 212, 170, 0.2);
|
||||
|
||||
--sl-color-bg: var(--anhh-bg);
|
||||
--sl-color-bg-nav: var(--anhh-bg-elevated);
|
||||
--sl-color-bg-sidebar: var(--anhh-bg-elevated);
|
||||
--sl-color-bg-inline-code: var(--anhh-bg-surface);
|
||||
--sl-color-text: var(--anhh-text-primary);
|
||||
--sl-color-text-accent: var(--anhh-accent);
|
||||
--sl-color-gray-1: var(--anhh-text-primary);
|
||||
--sl-color-gray-2: var(--anhh-text-secondary);
|
||||
--sl-color-gray-3: var(--anhh-text-muted);
|
||||
--sl-color-gray-4: var(--anhh-border-color);
|
||||
--sl-color-hairline: var(--anhh-border-color);
|
||||
}
|
||||
|
||||
/* Light mode */
|
||||
:root[data-theme='light'] {
|
||||
--anhh-bg: #f0f4ff;
|
||||
--anhh-bg-elevated: #ffffff;
|
||||
--anhh-bg-surface: #e2e8f0;
|
||||
--anhh-text-primary: #0f172a;
|
||||
--anhh-text-secondary: #475569;
|
||||
--anhh-text-muted: #94a3b8;
|
||||
--anhh-border-color: #cbd5e1;
|
||||
--anhh-accent-dim: rgba(0, 212, 170, 0.08);
|
||||
--anhh-accent-border: rgba(0, 212, 170, 0.3);
|
||||
|
||||
--sl-color-bg: var(--anhh-bg);
|
||||
--sl-color-bg-nav: var(--anhh-bg-elevated);
|
||||
--sl-color-bg-sidebar: var(--anhh-bg-elevated);
|
||||
--sl-color-bg-inline-code: var(--anhh-bg-surface);
|
||||
--sl-color-text: var(--anhh-text-primary);
|
||||
--sl-color-text-accent: var(--anhh-accent);
|
||||
--sl-color-gray-1: var(--anhh-text-primary);
|
||||
--sl-color-gray-2: var(--anhh-text-secondary);
|
||||
--sl-color-gray-3: var(--anhh-text-muted);
|
||||
--sl-color-gray-4: var(--anhh-border-color);
|
||||
--sl-color-hairline: var(--anhh-border-color);
|
||||
}
|
||||
|
||||
/* Accent-teal callout — used by paid-addon-callout.mdx, support-link.mdx, tip <Aside>s */
|
||||
.anhh-accent-callout {
|
||||
background: var(--anhh-accent-dim);
|
||||
border: 1px solid var(--anhh-accent-border);
|
||||
border-radius: 0.5rem;
|
||||
padding: 1rem 1.25rem;
|
||||
margin: 1rem 0;
|
||||
}
|
||||
|
||||
/* Tighten body line-height a touch for docs density */
|
||||
body {
|
||||
line-height: 1.6;
|
||||
}
|
||||
Reference in New Issue
Block a user