import { join } from 'path'; import forms from '@tailwindcss/forms'; import typography from '@tailwindcss/typography'; import { skeleton } from '@skeletonlabs/tw-plugin'; import { vinTheme } from './vin-theme'; /** @type {import('tailwindcss').Config} */ export default { darkMode: 'class', content: ['./src/**/*.{html,js,svelte,ts}', join(require.resolve('@skeletonlabs/skeleton'), '../**/*.{html,js,svelte,ts}')], theme: { fontFamily: { sans: ['Circular', 'sans-serif'], mono: ['CircularMono', 'sans-serif'], }, extend: { // colors: { // 'red': { // 50: '#fdf3f3', // 100: '#fbe5e5', // 200: '#f8d0d0', // 300: '#f2afaf', // 400: '#e87d7d', // 500: '#db5858', // 600: '#c73b3b', // 700: '#a72e2e', // 800: '#8b2929', // 900: '#742828', // 950: '#3e1111', // }, // 'yellow': { // 50: '#fcfaee', // 100: '#f6f1cf', // 200: '#ede19a', // 300: '#e8d67d', // 400: '#ddbc42', // 500: '#d5a12b', // 600: '#bc7f23', // 700: '#9c5e21', // 800: '#804a20', // 900: '#693e1e', // 950: '#3c200c', // }, // 'green': { // 50: '#ecfdf3', // 100: '#d1fae1', // 200: '#a8f2c8', // 300: '#7de8b2', // 400: '#36d188', // 500: '#12b76e', // 600: '#079459', // 700: '#05774a', // 800: '#075e3d', // 900: '#074d33', // 950: '#022c1d', // }, // 'cyan': { // 50: '#eefdfc', // 100: '#d5f8f7', // 200: '#b0f1ef', // 300: '#7de8e8', // 400: '#3bd3d5', // 500: '#1fb6bb', // 600: '#1d939d', // 700: '#1e7680', // 800: '#216069', // 900: '#1f515a', // 950: '#0f353d', // }, // 'blue': { // 50: '#f1f7fd', // 100: '#dfedfa', // 200: '#c7dff6', // 300: '#a1caef', // 400: '#7db3e8', // 500: '#5390de', // 600: '#3e74d2', // 700: '#3561c0', // 800: '#31509c', // 900: '#2c467c', // 950: '#1f2c4c', // }, // 'indigo': { // 50: '#eff3fe', // 100: '#e3e7fc', // 200: '#cbd4fa', // 300: '#acb7f5', // 400: '#8b92ee', // 500: '#7d7de8', // 600: '#5d53d8', // 700: '#5044be', // 800: '#41399a', // 900: '#38357a', // 950: '#221f47', // }, // 'gray': { // 50: '#e6e6e6', // 100: '#d9d9d9', // 200: '#c2c2c2', // 300: '#a1a1a1', // 400: '#787878', // 500: '#5e5e5e', // 600: '#4d4d4d', // 700: '#404040', // 800: '#363636', // 900: '#2e2e2e', // 950: '#1a1a1a', // }, // }, }, }, plugins: [ forms, typography, skeleton({ themes: { custom: [ vinTheme ] } }), ], }