Files
helix/tailwind.config.js

39 lines
1019 B
JavaScript
Raw Normal View History

/** @type {import('tailwindcss').Config} */
export default {
content: ['./src/**/*.{html,js,svelte,ts}'],
theme: {
extend: {
colors: {
feat: rebrand to R&D-lab + WBD palette + lab-slide cards Identity refresh aligned to Waterschap Brabantse Delta. Brand - HELIX → R&D-lab everywhere user-facing (SITE.name; literal "HELIX"s swept across routes, app.html, login, error messages, seed). - New tagline: "Projects, innovations, and every strand between." - Site description updated. Palette (sourced from the official WSBD-logo.svg) - Primary #0d4f9e, secondary #1fa0db, accent #bed137 — added as --wbd-blue / --wbd-cyan / --wbd-lime CSS vars and as wbd.* in tailwind.config.js. helix.* aliases now point to the WBD palette. - Strand A (Projects) → #1fa0db cyan. Strand B (Innovations) → #bed137 lime. - Body vignette + scroll-bar + legend dots repainted accordingly. Composite logo - New 24px nav glyph + favicon.svg: WBD-style tilted-square mark in WBD blues at the centre, helix strands (lime + cyan) wrapping it, lime "active site" dot at the crossing. Says "R&D-lab × Brabantse Delta" in one mark. Lab-slide cards (VerticalHelix) - Frosted-glass surface (backdrop-filter blur+saturate). - Thick 5px strand-coloured stripe on the helix-facing edge (gradient, glowing shadow). Slide rounds the stripe corners; the rest is square. - Slide header has the strand badge and a monospace serial number (01/03 etc) — lab-specimen feel. - Dashed footer rule + "Open detail →" CTA. - Inline link chips (Gitea / Dashboard / Demo / Docs / Paper / Video) with inline SVG icons + short labels. Hover lights up in the strand colour. Capped at 5 visible, "+N" overflow indicator. - Real <a> chips inside the card without nested <a>: overlay-link pattern (transparent slide-link absolute fills the card, chips sit on z-index: 2 above it). Server load - + Page now fetches each project's links in one Drizzle relational query (db.query.projects.findMany with: { links }), capped at 12. - + Form: strand picker (Project / Innovation radios) reads + persists the new column. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-05-20 12:13:57 +02:00
// Waterschap Brabantse Delta brand palette (from WSBD-logo.svg)
wbd: {
deep: '#0a3d80',
blue: '#0d4f9e',
cyan: '#1fa0db',
lime: '#bed137'
},
helix: {
feat: rebrand to R&D-lab + WBD palette + lab-slide cards Identity refresh aligned to Waterschap Brabantse Delta. Brand - HELIX → R&D-lab everywhere user-facing (SITE.name; literal "HELIX"s swept across routes, app.html, login, error messages, seed). - New tagline: "Projects, innovations, and every strand between." - Site description updated. Palette (sourced from the official WSBD-logo.svg) - Primary #0d4f9e, secondary #1fa0db, accent #bed137 — added as --wbd-blue / --wbd-cyan / --wbd-lime CSS vars and as wbd.* in tailwind.config.js. helix.* aliases now point to the WBD palette. - Strand A (Projects) → #1fa0db cyan. Strand B (Innovations) → #bed137 lime. - Body vignette + scroll-bar + legend dots repainted accordingly. Composite logo - New 24px nav glyph + favicon.svg: WBD-style tilted-square mark in WBD blues at the centre, helix strands (lime + cyan) wrapping it, lime "active site" dot at the crossing. Says "R&D-lab × Brabantse Delta" in one mark. Lab-slide cards (VerticalHelix) - Frosted-glass surface (backdrop-filter blur+saturate). - Thick 5px strand-coloured stripe on the helix-facing edge (gradient, glowing shadow). Slide rounds the stripe corners; the rest is square. - Slide header has the strand badge and a monospace serial number (01/03 etc) — lab-specimen feel. - Dashed footer rule + "Open detail →" CTA. - Inline link chips (Gitea / Dashboard / Demo / Docs / Paper / Video) with inline SVG icons + short labels. Hover lights up in the strand colour. Capped at 5 visible, "+N" overflow indicator. - Real <a> chips inside the card without nested <a>: overlay-link pattern (transparent slide-link absolute fills the card, chips sit on z-index: 2 above it). Server load - + Page now fetches each project's links in one Drizzle relational query (db.query.projects.findMany with: { links }), capped at 12. - + Form: strand picker (Project / Innovation radios) reads + persists the new column. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-05-20 12:13:57 +02:00
area: '#0a3d80',
process: '#0d4f9e',
unit: '#1fa0db',
equipment: '#6fc3ec',
control: '#b8dff5',
bg: '#07111d',
'bg-2': '#0c1c30',
'bg-3': '#122842',
border: '#1f3a5e',
ink: '#e6f1fb',
'ink-dim': '#8fa6b8',
'ink-faint': '#5b7388',
feat: rebrand to R&D-lab + WBD palette + lab-slide cards Identity refresh aligned to Waterschap Brabantse Delta. Brand - HELIX → R&D-lab everywhere user-facing (SITE.name; literal "HELIX"s swept across routes, app.html, login, error messages, seed). - New tagline: "Projects, innovations, and every strand between." - Site description updated. Palette (sourced from the official WSBD-logo.svg) - Primary #0d4f9e, secondary #1fa0db, accent #bed137 — added as --wbd-blue / --wbd-cyan / --wbd-lime CSS vars and as wbd.* in tailwind.config.js. helix.* aliases now point to the WBD palette. - Strand A (Projects) → #1fa0db cyan. Strand B (Innovations) → #bed137 lime. - Body vignette + scroll-bar + legend dots repainted accordingly. Composite logo - New 24px nav glyph + favicon.svg: WBD-style tilted-square mark in WBD blues at the centre, helix strands (lime + cyan) wrapping it, lime "active site" dot at the crossing. Says "R&D-lab × Brabantse Delta" in one mark. Lab-slide cards (VerticalHelix) - Frosted-glass surface (backdrop-filter blur+saturate). - Thick 5px strand-coloured stripe on the helix-facing edge (gradient, glowing shadow). Slide rounds the stripe corners; the rest is square. - Slide header has the strand badge and a monospace serial number (01/03 etc) — lab-specimen feel. - Dashed footer rule + "Open detail →" CTA. - Inline link chips (Gitea / Dashboard / Demo / Docs / Paper / Video) with inline SVG icons + short labels. Hover lights up in the strand colour. Capped at 5 visible, "+N" overflow indicator. - Real <a> chips inside the card without nested <a>: overlay-link pattern (transparent slide-link absolute fills the card, chips sit on z-index: 2 above it). Server load - + Page now fetches each project's links in one Drizzle relational query (db.query.projects.findMany with: { links }), capped at 12. - + Form: strand picker (Project / Innovation radios) reads + persists the new column. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-05-20 12:13:57 +02:00
accent: '#bed137',
'accent-2': '#d8e36a'
}
},
fontFamily: {
sans: ['Inter', 'system-ui', '-apple-system', 'Segoe UI', 'sans-serif'],
mono: ['JetBrains Mono', 'ui-monospace', 'SFMono-Regular', 'monospace']
}
}
},
plugins: []
};