123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778 |
- /** @type {import('tailwindcss').Config} */
- module.exports = {
- content: [
- './index.html',
- './src/**/*.{js,ts,jsx,tsx}',
- './node_modules/react-tailwindcss-datepicker/dist/index.esm.js',
- ],
- darkMode: 'class',
- theme: {
- extend: {
- colors: {
- text: {
- title: 'var(--color-text-title)',
- caption: 'var(--color-text-caption)',
- placeholder: 'var(--color-text-placeholder)',
- disabled: 'var(--color-text-disabled)',
- link: {
- default: 'var(--color-text-link-default)',
- hover: 'var(--color-text-link-hover)',
- pressed: 'var(--color-text-link-pressed)',
- disabled: 'var(--color-text-link-disabled)',
- }
- },
- content: {
- default: 'var(--color-content-default)',
- hover: 'var(--color-content-hover)',
- pressed: 'var(--color-content-pressed)',
- disabled: 'var(--color-content-disabled)',
- onfill: 'var(--color-content-onfill)',
- },
- icon: {
- default: 'var(--color-icon-default)',
- secondary: 'var(--color-icon-secondary)',
- disabled: 'var(--color-icon-disabled)',
- },
- fill: {
- default: 'var(--color-fill-default)',
- hover: 'var(--color-fill-hover)',
- selector: 'var(--color-fill-selector)',
- active: 'var(--color-fill-active)',
- },
- line: {
- divider: 'var(--color-line-divider)',
- border: 'var(--color-line-border)',
- },
- bg: {
- body: 'var(--color-bg-body)',
- base: 'var(--color-bg-base)',
- mask: 'var(--color-bg-mask)',
- brand: 'var(--color-bg-brand)',
- tips: 'var(--color-bg-tips)',
- },
- function: {
- success: 'var(--color-function-success)',
- warning: 'var(--color-function-warning)',
- error: 'var(--color-function-error)',
- info: 'var(--color-function-info)',
- },
- tint: {
- 1: 'var(--color-tint-1)',
- 2: 'var(--color-tint-2)',
- 3: 'var(--color-tint-3)',
- 4: 'var(--color-tint-4)',
- 5: 'var(--color-tint-5)',
- 6: 'var(--color-tint-6)',
- 7: 'var(--color-tint-7)',
- 8: 'var(--color-tint-8)',
- 9: 'var(--color-tint-9)',
- }
- },
- boxShadow: {
- md: '0px 0px 20px rgba(0, 0, 0, 0.1);',
- },
- },
- },
- plugins: [],
- };
|