fix: better background (more neutral)

This commit is contained in:
2026-02-22 11:44:28 +01:00
parent 2f2d502ca9
commit 5ff4f0a2b9
3 changed files with 24 additions and 3 deletions

View File

@@ -1,5 +1,9 @@
<style>
:root { color-scheme: light dark; }
@media only screen and (prefers-color-scheme: dark) {
:root:not([data-theme]) { --pico-background-color: #13171f; }
}
[data-theme='dark'] { --pico-background-color: #13171f; }
body { max-width: 960px; margin: 0 auto; padding: 2rem 1rem 4rem; background: var(--pico-background-color, var(--background-color)); color: var(--pico-color, var(--color)); }
main { display: grid; gap: 1rem; }
.blog-menu { border-top: 1px solid var(--pico-muted-border-color, var(--muted-border-color)); border-bottom: 1px solid var(--pico-muted-border-color, var(--muted-border-color)); padding: .4rem 0; margin: -.15rem 0 .2rem; }

View File

@@ -186,6 +186,7 @@ describe('BlogGenerationEngine', () => {
maxPostsPerPage: number;
language: string;
pageTitle: string;
picoTheme: string;
categorySettings: Record<string, { renderInLists: boolean; showTitle: boolean }>;
categoryMetadata: Record<string, { renderInLists: boolean; showTitle: boolean; title: string }>;
menu: MenuDocument;
@@ -203,6 +204,7 @@ describe('BlogGenerationEngine', () => {
maxPostsPerPage: options?.maxPostsPerPage,
language: options?.language,
pageTitle: options?.pageTitle,
picoTheme: options?.picoTheme as any,
categorySettings: options?.categorySettings,
categoryMetadata: options?.categoryMetadata,
menu: options?.menu,
@@ -371,6 +373,20 @@ describe('BlogGenerationEngine', () => {
expect(html).toContain('14.01.2025');
});
it('uses anthracite page background override for all pico themes in dark mode', async () => {
const posts = [
makePost({ id: '1', slug: 'first', title: 'First Post', createdAt: new Date('2025-01-15T10:00:00Z') }),
];
await generate(posts, { picoTheme: 'green' });
const indexPath = path.join(tempDir, 'html', 'index.html');
const html = await readFile(indexPath, 'utf-8');
expect(html).toContain('href="/assets/pico.green.min.css"');
expect(html).toContain('@media only screen and (prefers-color-scheme: dark)');
expect(html).toContain('--pico-background-color: #13171f;');
});
it('generates single post pages at /{year}/{month}/{day}/{slug}/index.html', async () => {
const posts = [
makePost({ id: '1', slug: 'hello-world', createdAt: new Date('2025-03-15T10:00:00Z') }),

View File

@@ -547,7 +547,7 @@ describe('PreviewServer', () => {
async getProjectMetadata() {
return {
maxPostsPerPage: 50,
picoTheme: 'slate',
picoTheme: 'green',
};
},
} as any,
@@ -556,12 +556,13 @@ describe('PreviewServer', () => {
await server.start(0);
const response = await fetch(`${server.getBaseUrl()}/__style-preview?theme=slate&mode=dark`);
const response = await fetch(`${server.getBaseUrl()}/__style-preview?theme=green&mode=dark`);
expect(response.status).toBe(200);
const html = await response.text();
expect(html).toContain('<html lang="en" data-theme="dark">');
expect(html).toContain('href="/assets/pico.slate.min.css"');
expect(html).toContain('href="/assets/pico.green.min.css"');
expect(html).toContain('--pico-background-color: #13171f;');
});
it('limits list routes to 50 posts', async () => {