| 1 |
/** @type {import('tailwindcss').Config} */ |
| 2 |
module.exports = { |
| 3 |
content: [ |
| 4 |
'./src/admin/**/*.{js,jsx}', |
| 5 |
'../ultimate-store-kit-pro/src/admin/**/*.{js,jsx}', |
| 6 |
], |
| 7 |
|
| 8 |
// Scope utilities under the WP admin mount node (see Dashboard.php). `important` as a |
| 9 |
// selector emits `.ultimate-store-kit-admin-root .w-full { … }` (descendant), NOT chained. |
| 10 |
// So width/height/flex utilities on the SAME element as `ultimate-store-kit-admin-root` |
| 11 |
// never match — put Tailwind classes only on descendants, or use a wrapper with |
| 12 |
// `display: contents` around portaled UI (see OfferEditor). |
| 13 |
important: '.ultimate-store-kit-admin-root', |
| 14 |
|
| 15 |
corePlugins: { |
| 16 |
preflight: false, |
| 17 |
}, |
| 18 |
|
| 19 |
theme: { |
| 20 |
extend: { |
| 21 |
fontFamily: { |
| 22 |
sans: [ |
| 23 |
'-apple-system', |
| 24 |
'BlinkMacSystemFont', |
| 25 |
'"Segoe UI"', |
| 26 |
'Roboto', |
| 27 |
'Oxygen', |
| 28 |
'Ubuntu', |
| 29 |
'sans-serif', |
| 30 |
], |
| 31 |
}, |
| 32 |
colors: { |
| 33 |
uks: { |
| 34 |
brand: '#00216A', |
| 35 |
'brand-dark': '#00216A', |
| 36 |
dark: '#1a2332', |
| 37 |
/** ~darken($dark, 3%) for sidebar promo */ |
| 38 |
'dark-deep': '#161e2a', |
| 39 |
surface: '#f1f5f9', |
| 40 |
border: '#e2e8f0', |
| 41 |
muted: '#64748b', |
| 42 |
}, |
| 43 |
}, |
| 44 |
borderRadius: { |
| 45 |
usk: '10px', |
| 46 |
}, |
| 47 |
boxShadow: { |
| 48 |
usk: '0 2px 8px rgba(0, 0, 0, 0.06)', |
| 49 |
}, |
| 50 |
keyframes: { |
| 51 |
uskSlideIn: { |
| 52 |
from: { opacity: '0', transform: 'translateY(-8px)' }, |
| 53 |
to: { opacity: '1', transform: 'translateY(0)' }, |
| 54 |
}, |
| 55 |
/** Offer editor drawer (slides in from right) */ |
| 56 |
offerDrawerSlide: { |
| 57 |
from: { transform: 'translateX(100%)' }, |
| 58 |
to: { transform: 'translateX(0)' }, |
| 59 |
}, |
| 60 |
}, |
| 61 |
animation: { |
| 62 |
'usk-slide-in': 'uskSlideIn 0.3s ease', |
| 63 |
'offer-drawer': 'offerDrawerSlide 200ms ease-out', |
| 64 |
}, |
| 65 |
}, |
| 66 |
}, |
| 67 |
|
| 68 |
plugins: [], |
| 69 |
|
| 70 |
// Pro admin JSX (../ultimate-store-kit-pro/...) is in `content`, but arbitrary utilities |
| 71 |
// are easy to miss after edits if the free admin CSS isn’t rebuilt — keep critical layout classes emitted. |
| 72 |
safelist: [ |
| 73 |
'w-[400px]', |
| 74 |
'min-w-[400px]', |
| 75 |
'max-w-[400px]', |
| 76 |
'w-[min(1200px,100vw)]', |
| 77 |
'max-w-[min(1200px,100vw)]', |
| 78 |
'z-[159000]', |
| 79 |
'sm:grid-cols-2', |
| 80 |
'sm:grid-cols-3', |
| 81 |
'lg:grid-cols-2', |
| 82 |
'lg:grid-cols-3', |
| 83 |
'xl:grid-cols-2', |
| 84 |
'xl:grid-cols-4', |
| 85 |
'2xl:grid-cols-4', |
| 86 |
], |
| 87 |
}; |
| 88 |
|
