vikingowl
a3db6f8b00
Complete rewrite of the portfolio site from Vue 3 + Vuetify to SvelteKit with Svelte 5, Tailwind CSS, and static adapter for SSG prerendering. - Reframe identity as Founder & Engineer with Go/Svelte/TS/Postgres stack - Featured projects: Marktvogt and Infinity Tales with full descriptions - Experience timeline: add herzkarten.de role, update PromoData end date - svelte-i18n for EN/DE localization with reactive locale switching - Fix dark mode (Skeleton Labs CSS variable format mismatch) - Fix nav responsiveness across medium/large viewports - Fix experience card double-border on landing page - Update prettier config for Svelte parser support
114 lines
3.4 KiB
TypeScript
114 lines
3.4 KiB
TypeScript
import { join } from 'path'
|
|
import type { Config } from 'tailwindcss'
|
|
import { skeleton } from '@skeletonlabs/tw-plugin'
|
|
|
|
const config = {
|
|
darkMode: 'class',
|
|
content: [
|
|
'./src/**/*.{html,js,svelte,ts}',
|
|
join(require.resolve('@skeletonlabs/skeleton'), '../**/*.{html,js,svelte,ts}'),
|
|
],
|
|
theme: {
|
|
extend: {
|
|
colors: {
|
|
// Nightfall theme colors preserved from Vuetify
|
|
primary: '#7C5CFF',
|
|
secondary: '#1F2027',
|
|
accent: '#FF4EC7',
|
|
'accent-alt': '#FF70CC',
|
|
info: '#4CC9F0',
|
|
success: '#22C55E',
|
|
warning: '#FACC15',
|
|
error: '#F97316',
|
|
background: '#0F1015',
|
|
surface: '#16171F',
|
|
'surface-bright': '#1F2027',
|
|
'surface-variant': '#242630',
|
|
outline: '#3B3C46',
|
|
'text-default': '#F4F4FF',
|
|
'text-muted': '#A6A7B5',
|
|
},
|
|
fontFamily: {
|
|
sans: ['Inter', 'Roboto', 'Segoe UI', 'sans-serif'],
|
|
heading: ['Inter', 'Roboto', 'Segoe UI', 'sans-serif'],
|
|
},
|
|
spacing: {
|
|
18: '4.5rem',
|
|
22: '5.5rem',
|
|
},
|
|
},
|
|
},
|
|
plugins: [
|
|
require('@tailwindcss/forms'),
|
|
skeleton({
|
|
themes: {
|
|
custom: [
|
|
{
|
|
name: 'nightfall',
|
|
properties: {
|
|
// Surface colors
|
|
'--color-surface-50': '#f4f4ff',
|
|
'--color-surface-100': '#e8e8f5',
|
|
'--color-surface-200': '#c4c5d0',
|
|
'--color-surface-300': '#a6a7b5',
|
|
'--color-surface-400': '#6b6c7a',
|
|
'--color-surface-500': '#3b3c46',
|
|
'--color-surface-600': '#242630',
|
|
'--color-surface-700': '#1f2027',
|
|
'--color-surface-800': '#16171f',
|
|
'--color-surface-900': '#0f1015',
|
|
// Primary (purple)
|
|
'--color-primary-50': '#f3f0ff',
|
|
'--color-primary-100': '#e5deff',
|
|
'--color-primary-200': '#c8baff',
|
|
'--color-primary-300': '#a892ff',
|
|
'--color-primary-400': '#9177ff',
|
|
'--color-primary-500': '#7c5cff',
|
|
'--color-primary-600': '#6b4de6',
|
|
'--color-primary-700': '#5a3ecc',
|
|
'--color-primary-800': '#4a2fb3',
|
|
'--color-primary-900': '#392099',
|
|
// Secondary (magenta/pink accent)
|
|
'--color-secondary-50': '#fff0fa',
|
|
'--color-secondary-100': '#ffdcf2',
|
|
'--color-secondary-200': '#ffb8e5',
|
|
'--color-secondary-300': '#ff8ed7',
|
|
'--color-secondary-400': '#ff70cc',
|
|
'--color-secondary-500': '#ff4ec7',
|
|
'--color-secondary-600': '#e63eaf',
|
|
'--color-secondary-700': '#cc2e97',
|
|
'--color-secondary-800': '#b31e7f',
|
|
'--color-secondary-900': '#990e67',
|
|
// Tertiary (cyan/info)
|
|
'--color-tertiary-50': '#e6f9ff',
|
|
'--color-tertiary-100': '#ccf3ff',
|
|
'--color-tertiary-200': '#99e7ff',
|
|
'--color-tertiary-300': '#66dbff',
|
|
'--color-tertiary-400': '#4cc9f0',
|
|
'--color-tertiary-500': '#33b7e0',
|
|
'--color-tertiary-600': '#1aa5d0',
|
|
'--color-tertiary-700': '#0093c0',
|
|
'--color-tertiary-800': '#0081b0',
|
|
'--color-tertiary-900': '#006fa0',
|
|
// Success
|
|
'--color-success-500': '#22C55E',
|
|
// Warning
|
|
'--color-warning-500': '#FACC15',
|
|
// Error
|
|
'--color-error-500': '#F97316',
|
|
// Border radius
|
|
'--theme-rounded-base': '12px',
|
|
'--theme-rounded-container': '16px',
|
|
// Font
|
|
'--theme-font-family-base': "'Inter', 'Roboto', 'Segoe UI', sans-serif",
|
|
'--theme-font-family-heading': "'Inter', 'Roboto', 'Segoe UI', sans-serif",
|
|
},
|
|
},
|
|
],
|
|
},
|
|
}),
|
|
],
|
|
} satisfies Config
|
|
|
|
export default config
|