website/uno.config.ts at main · ankddev/website · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
import {
	defineConfig,
	presetIcons,
	presetMini,
	transformerDirectives,
	type UserConfig
} from 'unocss';

import { LINKS } from './src/lib/data/links';

const CUSTOM_COLORS = {
	// Primarly used for foregrounds
	driftwood: {
		'50': '#f9f5ed',
		'100': '#efe7d2',
		'200': '#e1cda7',
		'300': '#d0ad74',
		'400': '#c1904e',
		'500': '#b88142',
		'600': '#996335',
		'700': '#7b4a2d',
		'800': '#683d2b',
		'900': '#5a3529',
		'950': '#331b15'
	},

	// Primarly used for backgrounds
	frangipani: {
		'50': '#fff7ed',
		'100': '#ffedd5',
		'200': '#ffdbb3',
		'300': '#ffb972',
		'400': '#fd903a',
		'500': '#fc7113',
		'600': '#ed5509',
		'700': '#c43e0a',
		'800': '#9c3210',
		'900': '#7d2b11',
		'950': '#441306'
	}
};

let safelist: string[] = [];
// links icon classes
safelist = [...safelist, ...LINKS.map((link) => link.icon_class)];

export default defineConfig({
	theme: {
		colors: {
			...CUSTOM_COLORS,
			brand: {
				foreground: CUSTOM_COLORS.driftwood['950'],
				surface: CUSTOM_COLORS.frangipani['50']
			}
		}
	},
	presets: [
		presetMini(),
		presetIcons({
			warn: true,
			extraProperties: {
				display: 'inline-block',
				'vertical-align': 'middle'
			}
		})
	],
	transformers: [transformerDirectives()],
	safelist: safelist
}) as UserConfig<{
	colors: {
		frangipani: Record<`${number}`, string>;
		driftwood: Record<`${number}`, string>;
		brand: {
			foreground: string;
			surface: string;
		};
	};
}>;