0.0.22 • Published 1 year ago

@acdh-oeaw/tailwindcss-preset v0.0.22

Weekly downloads
-
License
MIT
Repository
-
Last release
1 year ago

acdh-oeaw tailwindcss preset

this is a customisable preset for tailwindcss. it includes animation utilities from tailwindcss-animate and typography styles from @tailwindcss/typography.

how to install

npm install tailwindcss @acdh-oeaw/tailwindcss-preset

how to setup

// tailwind.config.ts

import { type Config } from "tailwindcss";
import { preset } from "@acdh-oeaw/tailwindcss-preset";

const config = {
	content: ["./src/**/*.@(ts|tsx)"],
	presets: [preset],
} satisfies Config;

export default config;

how to toggle dark mode

dark mode can be toggled via data attribute on the root element:

<html data-color-scheme="dark">
	<!-- ... -->
</html>

how to customise

design tokens can be customised via css custom properties. note that colors must be defined as hsl channels.

:root {
	--color-foreground: 240deg 6% 10%;
}

:root[data-color-scheme="dark"] {
	--color-foreground: 240deg 6% 90%;
}
@tailwindcss/typographytailwindcss-animate
@everything-registry/sub-chunk-24
0.0.22

1 year ago

0.0.21

1 year ago

0.0.20

1 year ago

0.0.18

1 year ago

0.0.19

1 year ago

0.0.17

2 years ago

0.0.16

2 years ago

0.0.15

2 years ago

0.0.14

2 years ago

0.0.13

2 years ago

0.0.12

2 years ago

0.0.11

2 years ago

0.0.10

2 years ago

0.0.9

2 years ago

0.0.8

2 years ago

0.0.7

2 years ago

0.0.6

2 years ago

0.0.5

2 years ago

0.0.4

2 years ago

0.0.3

2 years ago

0.0.2

2 years ago

0.0.1

2 years ago