| 1 |
const colors = require('tailwindcss/colors'); |
| 2 |
delete colors['lightBlue']; |
| 3 |
delete colors['warmGray']; |
| 4 |
delete colors['trueGray']; |
| 5 |
delete colors['coolGray']; |
| 6 |
delete colors['blueGray']; |
| 7 |
|
| 8 |
// See postcss.config.js for more parsing options. |
| 9 |
module.exports = { |
| 10 |
// Tnis should match the namespace you use in your css styles. |
| 11 |
important: '.code-block-pro', |
| 12 |
theme: { |
| 13 |
screens: { |
| 14 |
xxs: '280px', |
| 15 |
xs: '480px', |
| 16 |
sm: '600px', |
| 17 |
md: '782px', |
| 18 |
md2: '960px', // admin sidebar auto folds |
| 19 |
lg: '1080px', // adminbar goes big |
| 20 |
xl: '1280px', |
| 21 |
'2xl': '1440px', |
| 22 |
'3xl': '1600px', |
| 23 |
'4xl': '1920px', |
| 24 |
}, |
| 25 |
colors: { |
| 26 |
...colors, |
| 27 |
'wp-theme': { |
| 28 |
500: 'var(--wp-admin-theme-color)', |
| 29 |
600: 'var(--wp-admin-theme-color-darker-10)', |
| 30 |
700: 'var(--wp-admin-theme-color-darker-20)', |
| 31 |
}, |
| 32 |
wp: { |
| 33 |
alert: { |
| 34 |
yellow: '#f0b849', |
| 35 |
red: '#cc1818', |
| 36 |
green: '#4ab866', |
| 37 |
}, |
| 38 |
}, |
| 39 |
website: { |
| 40 |
main: '#272335', |
| 41 |
'main-dark': '#1E1A2B', |
| 42 |
accent: '#FF7EDB', |
| 43 |
'accent-yellow': '#FEDE5D', |
| 44 |
}, |
| 45 |
// https://github.com/WordPress/gutenberg/blob/trunk/packages/base-styles/_colors.scss |
| 46 |
gray: { |
| 47 |
50: '#fbfbfb', |
| 48 |
100: '#f0f0f0', |
| 49 |
150: '#eaeaea', // This wasn't a variable but I saw it on buttons |
| 50 |
200: '#e0e0e0', // Used sparingly for light borders. |
| 51 |
300: '#dddddd', // Used for most borders. |
| 52 |
400: '#cccccc', |
| 53 |
500: '#cccccc', |
| 54 |
600: '#949494', // Meets 3:1 UI or large text contrast against white. |
| 55 |
700: '#757575', // Meets 4.6:1 text contrast against white. |
| 56 |
900: '#1e1e1e', |
| 57 |
}, |
| 58 |
}, |
| 59 |
extend: { |
| 60 |
zIndex: { |
| 61 |
high: '99999', |
| 62 |
max: '2147483647', // max int values - don't block WP re-auth modal |
| 63 |
}, |
| 64 |
ringWidth: { |
| 65 |
wp: 'var(--wp-admin-border-width-focus)', |
| 66 |
}, |
| 67 |
}, |
| 68 |
}, |
| 69 |
plugins: [], |
| 70 |
corePlugins: { |
| 71 |
preflight: false, |
| 72 |
animation: false, |
| 73 |
container: false, |
| 74 |
}, |
| 75 |
}; |
| 76 |
|
