2026-03-08 18:55:45 +01:00
|
|
|
import type { ThemeConfig, SettingsYaml } from './schema';
|
|
|
|
|
|
|
|
|
|
export const THEME_PRESETS: Record<string, ThemeConfig> = {
|
2026-03-12 11:30:45 +00:00
|
|
|
studio: {
|
|
|
|
|
preset: 'studio',
|
|
|
|
|
accent: '#e60012',
|
|
|
|
|
fonts: { heading: 'Playfair Display', body: 'DM Sans', caption: 'EB Garamond' },
|
|
|
|
|
radius: 0,
|
|
|
|
|
photoFrame: 'passepartout',
|
|
|
|
|
grain: true,
|
|
|
|
|
headerDot: true,
|
|
|
|
|
heroStyle: 'split',
|
|
|
|
|
},
|
chore(release): v0.10.0 (#400)
Photo Essay mode, client proofing, studio-modern preset, admin panel overhaul, watermark, cookieless analytics, subpage toggle, SEO title templates. Analytics API now admin-only, Trivy scan on publish. Album order mirrors the Immich timeline; map theme, admin status panel, lightbox counter and Docker health check fixed.
See CHANGELOG.md for the full list and the health-check upgrade note.
2026-08-10 09:56:20 +02:00
|
|
|
'studio-modern': {
|
|
|
|
|
preset: 'studio-modern',
|
|
|
|
|
accent: '#e60012',
|
|
|
|
|
fonts: { heading: 'Archivo', body: 'Archivo', caption: 'IBM Plex Mono' },
|
|
|
|
|
radius: 0,
|
|
|
|
|
photoFrame: 'none',
|
|
|
|
|
grain: false,
|
|
|
|
|
headerDot: true,
|
|
|
|
|
heroStyle: 'split',
|
|
|
|
|
},
|
2026-03-12 11:30:45 +00:00
|
|
|
minimal: {
|
|
|
|
|
preset: 'minimal',
|
|
|
|
|
accent: '#000000',
|
|
|
|
|
fonts: { heading: 'Geist', body: 'Geist', caption: 'IBM Plex Mono' },
|
|
|
|
|
radius: 0,
|
|
|
|
|
photoFrame: 'none',
|
|
|
|
|
grain: false,
|
|
|
|
|
headerDot: false,
|
|
|
|
|
heroStyle: 'fullbleed',
|
|
|
|
|
},
|
|
|
|
|
editorial: {
|
|
|
|
|
preset: 'editorial',
|
|
|
|
|
accent: '#8B2500',
|
|
|
|
|
fonts: { heading: 'Bodoni Moda', body: 'Newsreader', caption: 'Spectral' },
|
|
|
|
|
radius: 0,
|
|
|
|
|
photoFrame: 'shadow',
|
|
|
|
|
grain: false,
|
|
|
|
|
headerDot: false,
|
|
|
|
|
heroStyle: 'split',
|
|
|
|
|
},
|
|
|
|
|
classic: {
|
|
|
|
|
preset: 'classic',
|
|
|
|
|
accent: '#c49a3c',
|
|
|
|
|
fonts: { heading: 'Cinzel', body: 'Crimson Pro', caption: 'Crimson Pro' },
|
|
|
|
|
radius: 12,
|
|
|
|
|
photoFrame: 'passepartout',
|
|
|
|
|
grain: false,
|
|
|
|
|
headerDot: true,
|
|
|
|
|
heroStyle: 'minimal',
|
|
|
|
|
},
|
|
|
|
|
noir: {
|
|
|
|
|
preset: 'noir',
|
|
|
|
|
accent: '#ff6b35',
|
|
|
|
|
fonts: { heading: 'Libre Baskerville', body: 'Source Sans 3', caption: 'Space Mono' },
|
|
|
|
|
radius: 0,
|
|
|
|
|
photoFrame: 'passepartout',
|
|
|
|
|
grain: true,
|
|
|
|
|
headerDot: false,
|
|
|
|
|
heroStyle: 'fullbleed',
|
|
|
|
|
},
|
|
|
|
|
monograph: {
|
|
|
|
|
preset: 'monograph',
|
|
|
|
|
accent: '#333333',
|
|
|
|
|
fonts: { heading: 'Instrument Serif', body: 'Inter', caption: 'IBM Plex Mono' },
|
|
|
|
|
radius: 0,
|
|
|
|
|
photoFrame: 'none',
|
|
|
|
|
grain: false,
|
|
|
|
|
headerDot: false,
|
|
|
|
|
heroStyle: 'typographic',
|
|
|
|
|
},
|
2026-03-08 18:55:45 +01:00
|
|
|
};
|
|
|
|
|
|
|
|
|
|
export const VALID_PHOTO_FRAMES = ['none', 'passepartout', 'shadow'];
|
2026-03-12 11:30:45 +00:00
|
|
|
export const VALID_HERO_STYLES = [
|
|
|
|
|
'split',
|
|
|
|
|
'fullbleed',
|
|
|
|
|
'minimal',
|
|
|
|
|
'stacked',
|
|
|
|
|
'typographic',
|
|
|
|
|
'mosaic',
|
experimental: portfolio features (justified layout, unlisted pages, captions, per-album grid, focal point, nav links, cover hero) (#431)
## Was ist das?
Sieben neue Portfolio-Features, alle als **experimental** gekennzeichnet
— in YAML-Kommentaren, Admin-Panel-Labels und Commit-Scopes, damit sie
einzeln nachvollziehbar und revertierbar bleiben.
## Features (je ein Commit)
| Commit | Feature |
| --- | --- |
| `justified rows gallery layout` | Neues Grid-Layout `justified`:
zeilenbasiert, gleiche Höhen, volle Breite — Flexbox ohne JS-Messung,
letzte Zeile bleibt natürlich klein |
| `hide subpages from navigation` | `hidden: true`: Seite aus
Nav/Homepage raus, per Direktlink erreichbar — im Gegensatz zu `enabled:
false` (404) |
| `lightbox captions` | Immich-Asset-Description als Bildunterschrift im
Info-Panel; EXIF-Route liefert bei `exifOnHover: false` jetzt nur noch
die Caption statt 403 |
| `per-album grid overrides` | `grid:` pro Album-Eintrag, Präzedenz
global < Subpage < Album |
| `per-album cover focal point` | `coverPosition:` → `object-position`
auf Cover-Karten, strikt validiert |
| `external links in header navigation` | `navLinks:` in settings.yaml,
nur http(s), sanitisiert |
| `cover splash hero style` | `heroStyle: cover`: Fullscreen-Splash mit
Enter-Link ins Portfolio |
Alle Optionen sind im Admin-Panel editierbar (PageBuilder /
SettingsEditor).
## Tests
- 356 Unit-Tests grün (13 neue: deriveGallery hidden/grid/coverPosition,
sanitizeNavLinks, EXIF-Route-Captions, justified-Layout-Validierung)
- `npx tsc --noEmit`: 0 Fehler
- `npm run build`: sauber
- Justified-Zeilenmathematik und Cover-Splash per Browser-Harness
visuell/numerisch verifiziert (volle Zeilen enden exakt an der
Containerkante, letzte Zeile bleibt natürlich)
---------
Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: ralksta <ralksta@users.noreply.github.com>
Co-authored-by: Claude Opus 5 (1M context) <noreply@anthropic.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Co-authored-by: lancetm714 <108419425+lancetm714@users.noreply.github.com>
2026-08-14 17:56:22 +02:00
|
|
|
'cover', // EXPERIMENTAL: fullscreen splash with a single "Enter" link
|
|
|
|
|
];
|
|
|
|
|
export const VALID_LAYOUTS = [
|
|
|
|
|
'masonry',
|
|
|
|
|
'uniform',
|
|
|
|
|
'showcase',
|
|
|
|
|
'filmstrip',
|
|
|
|
|
'editorial-flow',
|
|
|
|
|
'essay',
|
|
|
|
|
'justified', // EXPERIMENTAL: row-based layout with equal heights
|
2026-03-12 11:30:45 +00:00
|
|
|
];
|
2026-03-08 18:55:45 +01:00
|
|
|
|
|
|
|
|
export function resolveTheme(raw?: SettingsYaml['theme']): ThemeConfig {
|
2026-03-12 11:30:45 +00:00
|
|
|
if (!raw) return { ...THEME_PRESETS.studio };
|
2026-03-08 18:55:45 +01:00
|
|
|
|
2026-03-12 11:30:45 +00:00
|
|
|
if (typeof raw === 'string') {
|
|
|
|
|
const preset = THEME_PRESETS[raw];
|
|
|
|
|
if (!preset) {
|
|
|
|
|
throw new Error(
|
|
|
|
|
`Unknown theme preset "${raw}". Valid presets: ${Object.keys(THEME_PRESETS).join(', ')}`,
|
|
|
|
|
);
|
2026-03-08 18:55:45 +01:00
|
|
|
}
|
2026-03-12 11:30:45 +00:00
|
|
|
return { ...preset };
|
|
|
|
|
}
|
2026-03-08 18:55:45 +01:00
|
|
|
|
2026-03-12 11:30:45 +00:00
|
|
|
const baseName = raw.preset ?? 'studio';
|
|
|
|
|
const base = THEME_PRESETS[baseName];
|
|
|
|
|
if (!base) {
|
|
|
|
|
throw new Error(
|
|
|
|
|
`Unknown theme preset "${baseName}". Valid presets: ${Object.keys(THEME_PRESETS).join(', ')}`,
|
|
|
|
|
);
|
|
|
|
|
}
|
2026-03-08 18:55:45 +01:00
|
|
|
|
2026-03-12 11:30:45 +00:00
|
|
|
return {
|
|
|
|
|
preset: baseName,
|
|
|
|
|
accent: raw.accent ?? base.accent,
|
|
|
|
|
fonts: {
|
|
|
|
|
heading: raw.fonts?.heading ?? base.fonts.heading,
|
|
|
|
|
body: raw.fonts?.body ?? base.fonts.body,
|
|
|
|
|
caption: raw.fonts?.caption ?? base.fonts.caption,
|
|
|
|
|
},
|
|
|
|
|
radius: raw.radius ?? base.radius,
|
|
|
|
|
photoFrame: VALID_PHOTO_FRAMES.includes(raw.photoFrame ?? '')
|
|
|
|
|
? (raw.photoFrame as ThemeConfig['photoFrame'])
|
|
|
|
|
: base.photoFrame,
|
|
|
|
|
grain: raw.grain ?? base.grain,
|
|
|
|
|
headerDot: raw.headerDot ?? base.headerDot,
|
|
|
|
|
heroStyle: VALID_HERO_STYLES.includes(raw.heroStyle ?? '')
|
|
|
|
|
? (raw.heroStyle as ThemeConfig['heroStyle'])
|
|
|
|
|
: base.heroStyle,
|
|
|
|
|
};
|
2026-03-08 18:55:45 +01:00
|
|
|
}
|
|
|
|
|
|
|
|
|
|
export function getGoogleFontsUrl(theme: ThemeConfig): string {
|
2026-03-12 11:30:45 +00:00
|
|
|
const weights = '300;400;500;600';
|
|
|
|
|
const families = [...new Set([theme.fonts.heading, theme.fonts.body, theme.fonts.caption])];
|
|
|
|
|
const params = families.map((f) => `family=${f.replace(/ /g, '+')}:wght@${weights}`).join('&');
|
|
|
|
|
return `https://fonts.googleapis.com/css2?${params}&display=swap`;
|
2026-03-08 18:55:45 +01:00
|
|
|
}
|