Skip to content

Commit bbef3bd

Browse files
committed
fix(build): change output dir to pages, add custom styles and favicon
- Set astro outDir to pages/ to separate build output from src - Update CI workflow to upload pages/ artifact instead of dist/ - Add custom CSS to match VitePress visual style in Starlight - Add favicon.svg and docs/tsconfig.json for Astro - Remove outdated logo.png (replaced by inline SVG or Astro asset) - Ignore .mjs and .astro in eslint; exclude docs/dist from tsconfig - Bump dev dependency versions and remove esbuild override
1 parent 5e00b13 commit bbef3bd

11 files changed

Lines changed: 3582 additions & 3633 deletions

File tree

.github/workflows/deploy-docs.yml

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -44,7 +44,7 @@ jobs:
4444
- name: Upload artifact
4545
uses: actions/upload-pages-artifact@v3
4646
with:
47-
path: dist
47+
path: pages
4848

4949
deploy:
5050
needs: build

.gitignore

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@
33
cache/
44
coverage/
55
dist/
6+
pages/
67
node_modules/
78

89
# Astro

astro.config.mjs

Lines changed: 9 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,10 +2,14 @@ import { defineConfig } from 'astro/config';
22
import starlight from '@astrojs/starlight';
33

44
export default defineConfig({
5+
outDir: './pages',
56
srcDir: './docs',
67
site: 'https://knowledgecode.github.io',
78
base: '/date-and-time',
89
trailingSlash: 'never',
10+
devToolbar: {
11+
enabled: false,
12+
},
913
markdown: {
1014
shikiConfig: {
1115
themes: {
@@ -16,6 +20,9 @@ export default defineConfig({
1620
},
1721
integrations: [
1822
starlight({
23+
customCss: [
24+
'./docs/styles/custom.css',
25+
],
1926
title: 'date-and-time',
2027
description: 'The simplest, most intuitive date and time library',
2128
logo: {
@@ -30,7 +37,7 @@ export default defineConfig({
3037
{
3138
label: 'Getting Started',
3239
items: [
33-
{ label: 'Introduction', link: '/guide/' },
40+
{ label: 'Introduction', link: '/guide' },
3441
{ label: 'Installation', link: '/guide/installation' },
3542
{ label: 'Quick Start', link: '/guide/quick-start' },
3643
],
@@ -39,7 +46,7 @@ export default defineConfig({
3946
label: 'API Reference',
4047
collapsed: true,
4148
items: [
42-
{ label: 'Overview', link: '/api/' },
49+
{ label: 'Overview', link: '/api' },
4350
{
4451
label: 'Core Functions',
4552
items: [

docs/styles/custom.css

Lines changed: 148 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,148 @@
1+
/* ─── Font sizes (match VitePress heading scale) ─── */
2+
:root {
3+
--sl-text-h1: 1.75rem;
4+
--sl-text-h2: 1.5rem;
5+
--sl-text-h3: 1.25rem;
6+
--sl-text-h4: 1.125rem;
7+
}
8+
@media (min-width: 50em) {
9+
:root {
10+
--sl-text-h1: 1.75rem;
11+
--sl-text-h2: 1.5rem;
12+
--sl-text-h3: 1.25rem;
13+
--sl-text-h4: 1.125rem;
14+
}
15+
}
16+
17+
/* ─── Colors (neutral, matching VitePress) ─── */
18+
:root {
19+
--sl-color-text: rgba(235, 235, 245, 0.86);
20+
/* Accent: #5672cd — dark mode */
21+
--sl-color-accent-low: hsl(226, 40%, 18%);
22+
--sl-color-accent: hsl(226, 54%, 57%);
23+
--sl-color-accent-high: hsl(226, 80%, 85%);
24+
}
25+
:root[data-theme='light'] {
26+
--sl-color-text: rgba(60, 60, 67);
27+
--sl-color-hairline: rgba(60, 60, 67, 0.12);
28+
--sl-color-hairline-light: rgba(60, 60, 67, 0.08);
29+
/* Accent: #5672cd — light mode */
30+
--sl-color-accent-low: hsl(226, 60%, 94%);
31+
--sl-color-accent: hsl(226, 54%, 47%);
32+
--sl-color-accent-high: hsl(226, 54%, 28%);
33+
}
34+
35+
/* ─── h2 border-top (VitePress section divider style) ─── */
36+
.sl-markdown-content h2:not(:where(.not-content *)) {
37+
border-top: 1px solid var(--sl-color-hairline);
38+
padding-top: 24px;
39+
margin-top: 2em;
40+
}
41+
42+
/* ─── Left sidebar menu line-height ─── */
43+
.sidebar-content a,
44+
.sidebar-content summary {
45+
line-height: 1.6;
46+
}
47+
48+
/* ─── "On this page" TOC line-height ─── */
49+
starlight-toc a {
50+
line-height: 1.6;
51+
}
52+
53+
/* ─── Tables ─── */
54+
.sl-markdown-content table:not(:where(.not-content *)) {
55+
border-collapse: collapse;
56+
margin: 20px 0;
57+
font-size: 14px;
58+
width: 100%;
59+
}
60+
.sl-markdown-content tr:not(:where(.not-content *)) {
61+
border-top: 1px solid var(--sl-color-hairline);
62+
border-bottom: 1px solid var(--sl-color-hairline);
63+
transition: background-color 0.25s;
64+
}
65+
/* Zebra stripe (dark mode default) */
66+
.sl-markdown-content tr:nth-child(2n):not(:where(.not-content *)) {
67+
background-color: var(--sl-color-gray-6);
68+
}
69+
:root[data-theme='light'] .sl-markdown-content tr:nth-child(2n):not(:where(.not-content *)) {
70+
background-color: var(--sl-color-gray-7);
71+
}
72+
/* th (dark mode default) */
73+
.sl-markdown-content th:not(:where(.not-content *)) {
74+
border: var(--ec-brdWd) solid var(--ec-brdCol);
75+
padding: 8px 16px;
76+
background-color: var(--sl-color-gray-6);
77+
color: var(--sl-color-gray-3);
78+
}
79+
:root[data-theme='light'] .sl-markdown-content th:not(:where(.not-content *)) {
80+
background-color: var(--sl-color-gray-7);
81+
}
82+
.sl-markdown-content td:not(:where(.not-content *)) {
83+
border: var(--ec-brdWd) solid var(--ec-brdCol);
84+
padding: 8px 16px;
85+
}
86+
87+
/* ─── Pagination ─── */
88+
.pagination-links {
89+
margin-top: 40px;
90+
padding-top: 24px;
91+
border-top: 1px solid var(--sl-color-hairline);
92+
}
93+
.pagination-links a {
94+
align-items: center;
95+
gap: 0.75rem;
96+
border-color: var(--sl-color-hairline);
97+
border-radius: 8px;
98+
padding: 16px;
99+
box-shadow: none;
100+
transition: border-color 0.25s;
101+
}
102+
.pagination-links a:hover {
103+
border-color: var(--sl-color-accent);
104+
}
105+
.pagination-links a > span {
106+
font-size: 0.75rem;
107+
color: var(--sl-color-gray-3);
108+
letter-spacing: 0.4px;
109+
}
110+
.pagination-links .link-title {
111+
font-size: var(--sl-text-base);
112+
line-height: 1.4;
113+
color: var(--sl-color-white);
114+
margin-top: 4px;
115+
}
116+
:root[data-theme='light'] .pagination-links .link-title {
117+
color: var(--sl-color-gray-1);
118+
}
119+
.pagination-links svg {
120+
color: var(--sl-color-accent);
121+
flex-shrink: 0;
122+
}
123+
124+
/* ─── Hero image ─── */
125+
.hero img {
126+
width: 320px;
127+
height: 320px;
128+
}
129+
130+
/* ─── Cards ─── */
131+
/* Dark mode default */
132+
article.card {
133+
background-color: var(--sl-color-gray-6);
134+
border: 1px solid var(--sl-color-gray-6);
135+
border-radius: 12px;
136+
transition: border-color 0.25s;
137+
}
138+
/* Light mode override */
139+
:root[data-theme='light'] article.card {
140+
background-color: var(--sl-color-gray-7);
141+
border-color: var(--sl-color-gray-7);
142+
}
143+
article.card:hover {
144+
border-color: var(--sl-color-accent);
145+
}
146+
article.card .title {
147+
color: inherit;
148+
}

docs/tsconfig.json

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
{
2+
"extends": "astro/tsconfigs/base",
3+
"include": ["../.astro/types.d.ts", "./**/*"],
4+
"exclude": ["../node_modules"]
5+
}

eslint.config.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ export default defineConfig(
88
tseslint.configs.strictTypeChecked,
99
tseslint.configs.stylisticTypeChecked,
1010
{
11-
ignores: ["**/*.js", "coverage", "dist", "docs"]
11+
ignores: ["**/*.js", "**/*.mjs", "coverage", "dist", "docs", ".astro"]
1212
},
1313
{
1414
files: ['**/*.ts'],

0 commit comments

Comments
 (0)