const defaultTheme = require('tailwindcss/defaultTheme'); const colors = require('tailwindcss/colors'); /** @type {import('tailwindcss').Config} */ module.exports = { //... presets: [ require('./vendor/wireui/wireui/tailwind.config.js') ], content: [ './vendor/laravel/framework/src/Illuminate/Pagination/resources/views/*.blade.php', './vendor/laravel/jetstream/**/*.blade.php', './storage/framework/views/*.php', './resources/views/**/*.blade.php', "./vendor/wireui/wireui/src/*.php", "./vendor/wireui/wireui/ts/**/*.ts", "./vendor/wireui/wireui/src/WireUi/**/*.php", "./vendor/wireui/wireui/src/Components/**/*.php", './vendor/namu/wirechat/resources/views/**/*.blade.php', './vendor/namu/wirechat/src/Livewire/**/*.php' ], theme: { extend: { fontFamily: { sans: ['Poppins', ...defaultTheme.fontFamily.sans], }, ringColor: { DEFAULT: 'rgb(var(--color-primary-200) / 0.5)', }, lineClamp: { 7: '7', 8: '8', 9: '9', 10: '10', }, invert: { 25: '.25', 50: '.5', 75: '.75', 100: '1', }, colors: { // Theme-aware primary colors using CSS custom properties primary: { 50: 'rgb(var(--color-primary-50) / )', 100: 'rgb(var(--color-primary-100) / )', 200: 'rgb(var(--color-primary-200) / )', 300: 'rgb(var(--color-primary-300) / )', 400: 'rgb(var(--color-primary-400) / )', 500: 'rgb(var(--color-primary-500) / )', 600: 'rgb(var(--color-primary-600) / )', 700: 'rgb(var(--color-primary-700) / )', 800: 'rgb(var(--color-primary-800) / )', 900: 'rgb(var(--color-primary-900) / )', }, // Theme-aware semantic colors 'theme-secondary': 'rgb(var(--color-secondary) / )', 'theme-accent': 'rgb(var(--color-accent) / )', 'theme-brand': 'rgb(var(--color-brand) / )', 'theme-background': 'rgb(var(--color-background) / )', 'theme-surface': 'rgb(var(--color-surface) / )', 'theme-text': { primary: 'rgb(var(--color-text-primary) / )', secondary: 'rgb(var(--color-text-secondary) / )', light: 'rgb(var(--color-text-light) / )', surface: 'rgb(var(--color-text-surface) / )', background: 'rgb(var(--color-text-background) / )', }, 'theme-logo': 'rgb(var(--color-logo) / )', // Fallback to original colors for WireUI compatibility secondary: colors.gray, positive: colors.gray, negative: colors.red, warning: colors.amber, info: colors.gray, // Theme-specific colors (only available in specific themes) 'uuro-success': 'rgb(var(--color-success, 107 114 128) / )', 'uuro-danger': 'rgb(var(--color-danger, 239 68 68) / )', 'uuro-warning': 'rgb(var(--color-warning, 245 158 11) / )', 'uuro-info': 'rgb(var(--color-info, 59 130 246) / )', 'vegetable-success': 'rgb(var(--color-success, 34 197 94) / )', 'vegetable-surface-alt': 'rgb(var(--color-surface-alt, 249 250 251) / )', 'yellow-accent-dark': 'rgb(var(--color-accent-dark, 51 65 85) / )', 'yellow-neutral': { dark: 'rgb(var(--color-neutral-dark, 55 65 81) / )', medium: 'rgb(var(--color-neutral-medium, 107 114 128) / )', light: 'rgb(var(--color-neutral-light, 229 231 235) / )', }, 'yellow-surface-dark': 'rgb(var(--color-surface-dark, 17 24 39) / )', 'yellow-text-inverse': 'rgb(var(--color-text-inverse, 255 255 255) / )', }, transitionDelay: { '500': '500ms', '700': '700', '1000': '1000ms', }, }, }, safelist: [ 'hover:bg-slate-200', 'hover:bg-gray-200', 'hover:bg-zinc-200', 'hover:bg-neutral-200', 'hover:bg-stone-200', 'hover:bg-red-200', 'hover:bg-orange-200', 'hover:bg-amber-200', 'hover:bg-yellow-200', 'hover:bg-lime-200', 'hover:bg-green-200', 'hover:bg-emerald-200', 'hover:bg-teal-200', 'hover:bg-cyan-200', 'hover:bg-sky-200', 'hover:bg-blue-200', 'hover:bg-indigo-200', 'hover:bg-violet-200', 'hover:bg-purple-200', 'hover:bg-fuchsia-200', 'hover:bg-pink-200', 'hover:bg-rose-200', 'bg-slate-200', 'bg-gray-200', 'bg-zinc-200', 'bg-neutral-200', 'bg-stone-200', 'bg-red-200', 'bg-orange-200', 'bg-amber-200', 'bg-yellow-200', 'bg-lime-200', 'bg-green-200', 'bg-emerald-200', 'bg-teal-200', 'bg-cyan-200', 'bg-sky-200', 'bg-blue-200', 'bg-indigo-200', 'bg-violet-200', 'bg-purple-200', 'bg-fuchsia-200', 'bg-pink-200', 'bg-rose-200', 'bg-slate-400', 'bg-gray-400', 'bg-zinc-400', 'bg-neutral-400', 'bg-stone-400', 'bg-red-400', 'bg-orange-400', 'bg-amber-400', 'bg-yellow-400', 'bg-lime-400', 'bg-green-400', 'bg-emerald-400', 'bg-teal-400', 'bg-cyan-400', 'bg-sky-400', 'bg-blue-400', 'bg-indigo-400', 'bg-violet-400', 'bg-purple-400', 'bg-fuchsia-400', 'bg-pink-400', 'bg-rose-400', // Post content link styles '[&_a]:underline', '[&_a:hover]:text-theme-secondary', ], plugins: [ require('@tailwindcss/forms'), require('@tailwindcss/typography'), function({ addUtilities }) { addUtilities({ '.post-links-underlined a': { 'text-decoration': 'underline', }, '.post-links-underlined a:hover': { 'color': 'rgb(var(--color-text-secondary))', }, }) }, ], };