website/tailwind.config.js at svelte · 90-008/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
import typography from '@tailwindcss/typography';
import forms from '@tailwindcss/forms';

/** @type {import('tailwindcss').Config} */
export default {
	content: ['./src/**/*.{html,js,svelte,ts,md}'],
	theme: {
		extend: {
			typography: ({ theme }) => ({
				ralsei: {
					css: {
						'--tw-prose-body': theme('colors.ralsei.white'),
						'--tw-prose-headings': theme('colors.ralsei.pink.neon'),
						'--tw-prose-lead': theme('colors.ralsei.white'),
						'--tw-prose-links': theme('colors.ralsei.green.light'),
						'--tw-prose-bold': theme('colors.ralsei.white'),
						'--tw-prose-counters': theme('colors.ralsei.pink.regular'),
						'--tw-prose-bullets': theme('colors.ralsei.pink.regular'),
						'--tw-prose-hr': theme('colors.ralsei.white'),
						'--tw-prose-quotes': theme('colors.ralsei.white'),
						'--tw-prose-quote-borders': theme('colors.ralsei.white'),
						'--tw-prose-captions': theme('colors.ralsei.white'),
						'--tw-prose-code': theme('colors.ralsei.pink.regular'),
						'--tw-prose-pre-code': theme('colors.ralsei.white'),
						'--tw-prose-pre-bg': theme('colors.ralsei.green.dark'),
						'--tw-prose-th-borders': theme('colors.ralsei.white'),
						'--tw-prose-td-borders': theme('colors.ralsei.white')
					}
				}
			}),
			animation: {
				'bounce-slow': 'bounce 3s infinite',
				'bounce-fast': 'bounce 0.5s infinite',
				'pulse-fast': 'pulse 1s cubic-bezier(0.4, 0, 0.6, 1) infinite',
				blink: 'blink 1s step-start infinite'
			},
			colors: {
				ralsei: {
					white: '#fff9fe',
					black: '#000801',
					green: {
						light: 'hsla(180, 90%, 42.5%, 1.00)',
						dark: 'hsla(240, 45%, 8%, 1.00)'
					},
					pink: {
						regular: 'hsla(260, 90%, 65%, 1.0)',
						neon: 'hsla(270, 95%, 68%, 1.0)'
					}
				}
			}
		},
		fontFamily: {
			'sans-serif': ['"Fusion Pixel 8px Proportional SC", sans-serif'],
			monospace: ['"Fusion Pixel 8px Monospaced SC", monospace']
		}
	},
	plugins: [typography, forms]
};