Created
September 2, 2020 22:01
-
-
Save kodiyak/acf12c2b21c468e480a9c07edbf79775 to your computer and use it in GitHub Desktop.
Tailwind Config V1
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| module.exports = { | |
| purge: [], | |
| target: 'relaxed', | |
| prefix: '', | |
| important: false, | |
| separator: ':', | |
| theme: { | |
| themeVariants: ['dark', 'light'], | |
| screens: { | |
| sm: '640px', | |
| md: '768px', | |
| lg: '1024px', | |
| xl: '1280px' | |
| }, | |
| colors: { | |
| transparent: 'transparent', | |
| current: 'currentColor', | |
| black: '#000', | |
| white: '#fff', | |
| darken: { | |
| 100: 'rgba(0,0,0,.2)', | |
| 200: 'rgba(0,0,0,.3)', | |
| 300: 'rgba(0,0,0,.4)', | |
| 400: 'rgba(0,0,0,.5)', | |
| 500: 'rgba(0,0,0,.6)', | |
| 600: 'rgba(0,0,0,.7)', | |
| 700: 'rgba(0,0,0,.8)', | |
| 800: 'rgba(0,0,0,.9)', | |
| 900: 'rgba(0,0,0,1)' | |
| }, | |
| lighten: { | |
| 100: 'rgba(255,255,255,.2)', | |
| 200: 'rgba(255,255,255,.3)', | |
| 300: 'rgba(255,255,255,.4)', | |
| 400: 'rgba(255,255,255,.5)', | |
| 500: 'rgba(255,255,255,.6)', | |
| 600: 'rgba(255,255,255,.7)', | |
| 700: 'rgba(255,255,255,.8)', | |
| 800: 'rgba(255,255,255,.9)', | |
| 900: 'rgba(255,255,255,1)' | |
| }, | |
| gray: { | |
| 100: '#f7fafc', | |
| 200: '#edf2f7', | |
| 300: '#e2e8f0', | |
| 400: '#cbd5e0', | |
| 500: '#a0aec0', | |
| 600: '#718096', | |
| 700: '#4a5568', | |
| 800: '#2d3748', | |
| 900: '#1a202c' | |
| }, | |
| red: { | |
| 100: '#fff5f5', | |
| 200: '#fed7d7', | |
| 300: '#feb2b2', | |
| 400: '#fc8181', | |
| 500: '#f56565', | |
| 600: '#e53e3e', | |
| 700: '#c53030', | |
| 800: '#9b2c2c', | |
| 900: '#742a2a' | |
| }, | |
| orange: { | |
| 100: '#fffaf0', | |
| 200: '#feebc8', | |
| 300: '#fbd38d', | |
| 400: '#f6ad55', | |
| 500: '#ed8936', | |
| 600: '#dd6b20', | |
| 700: '#c05621', | |
| 800: '#9c4221', | |
| 900: '#7b341e' | |
| }, | |
| yellow: { | |
| 100: '#fffff0', | |
| 200: '#fefcbf', | |
| 300: '#faf089', | |
| 400: '#f6e05e', | |
| 500: '#ecc94b', | |
| 600: '#d69e2e', | |
| 700: '#b7791f', | |
| 800: '#975a16', | |
| 900: '#744210' | |
| }, | |
| green: { | |
| 100: '#f0fff4', | |
| 200: '#c6f6d5', | |
| 300: '#9ae6b4', | |
| 400: '#68d391', | |
| 500: '#48bb78', | |
| 600: '#38a169', | |
| 700: '#2f855a', | |
| 800: '#276749', | |
| 900: '#22543d' | |
| }, | |
| teal: { | |
| 100: '#e6fffa', | |
| 200: '#b2f5ea', | |
| 300: '#81e6d9', | |
| 400: '#4fd1c5', | |
| 500: '#38b2ac', | |
| 600: '#319795', | |
| 700: '#2c7a7b', | |
| 800: '#285e61', | |
| 900: '#234e52' | |
| }, | |
| blue: { | |
| 100: '#ebf8ff', | |
| 200: '#bee3f8', | |
| 300: '#90cdf4', | |
| 400: '#63b3ed', | |
| 500: '#4299e1', | |
| 600: '#3182ce', | |
| 700: '#2b6cb0', | |
| 800: '#2c5282', | |
| 900: '#2a4365' | |
| }, | |
| indigo: { | |
| 100: '#ebf4ff', | |
| 200: '#c3dafe', | |
| 300: '#a3bffa', | |
| 400: '#7f9cf5', | |
| 500: '#667eea', | |
| 600: '#5a67d8', | |
| 700: '#4c51bf', | |
| 800: '#434190', | |
| 900: '#3c366b' | |
| }, | |
| purple: { | |
| 100: '#bb96ff', | |
| 200: '#a782fd', | |
| 300: '#936ee9', | |
| 400: '#7f5ad5', | |
| 500: '#6b46c1', | |
| 600: '#5732ad', | |
| 700: '#431e99', | |
| 800: '#2f0a85', | |
| 900: '#1b0071' | |
| }, | |
| pink: { | |
| 100: '#ff8fdc', | |
| 200: '#ff7bc8', | |
| 300: '#fd67b4', | |
| 400: '#e953a0', | |
| 500: '#d53f8c', | |
| 600: '#c12b78', | |
| 700: '#ad1764', | |
| 800: '#990350', | |
| 900: '#85003c' | |
| }, | |
| danger: { | |
| 100: '#ff82a9', | |
| 200: '#ff6e95', | |
| 300: '#ff5a81', | |
| 400: '#ff466d', | |
| 500: '#FD3259', | |
| 600: '#e91e45', | |
| 700: '#d50a31', | |
| 800: '#c1001d', | |
| 900: '#ad0009' | |
| }, | |
| warning: { | |
| 100: '#ffe576', | |
| 200: '#ffd162', | |
| 300: '#ffbd4e', | |
| 400: '#ffa93a', | |
| 500: '#FE9526', | |
| 600: '#ea8112', | |
| 700: '#d66d00', | |
| 800: '#c25900', | |
| 900: '#ae4500' | |
| }, | |
| success: { | |
| 100: '#a3ffba', | |
| 200: '#8fffa6', | |
| 300: '#7bff92', | |
| 400: '#67ec7e', | |
| 500: '#53D86A', | |
| 600: '#3fc456', | |
| 700: '#2bb042', | |
| 800: '#179c2e', | |
| 900: '#03881a' | |
| }, | |
| secondary: { | |
| 100: '#a8a9c0', | |
| 200: '#9495ac', | |
| 300: '#808198', | |
| 400: '#6c6d84', | |
| 500: '#585970', | |
| 600: '#44455c', | |
| 700: '#303148', | |
| 800: '#1C1D34', | |
| 900: '#080920' | |
| }, | |
| primary: { | |
| 100: '#9499ff', | |
| 200: '#8085ff', | |
| 300: '#6c71ff', | |
| 400: '#585dff', | |
| 500: '#4449FB', | |
| 600: '#3035e7', | |
| 700: '#1c21d3', | |
| 800: '#080dbf', | |
| 900: '#0000ab' | |
| }, | |
| body: { | |
| 60: '#faf7ff', | |
| 70: '#e6e3eb', | |
| 80: '#d2cfd7', | |
| 90: '#bebbc3', | |
| 100: '#aaa7af', | |
| 200: '#96939b', | |
| 300: '#827f87', | |
| 400: '#6e6b73', | |
| 500: '#5a575f', | |
| 600: '#46434b', | |
| 700: '#322f37', | |
| 800: '#1e1b23', | |
| 900: '#0A070F' | |
| } | |
| }, | |
| spacing: { | |
| px: '1px', | |
| 0: '0', | |
| 1: '0.25rem', | |
| 2: '0.5rem', | |
| 3: '0.75rem', | |
| 4: '1rem', | |
| 5: '1.25rem', | |
| 6: '1.5rem', | |
| 8: '2rem', | |
| 10: '2.5rem', | |
| 12: '3rem', | |
| 14: '3.5rem', | |
| 16: '4rem', | |
| 20: '5rem', | |
| 24: '6rem', | |
| 28: '7rem', | |
| 32: '8rem', | |
| 36: '9rem', | |
| 40: '10rem', | |
| 48: '12rem', | |
| 56: '14rem', | |
| 64: '16rem' | |
| }, | |
| backgroundColor: theme => theme('colors'), | |
| backgroundImage: { | |
| none: 'none', | |
| 'gradient-to-t': 'linear-gradient(to top, var(--gradient-color-stops))', | |
| 'gradient-to-tr': 'linear-gradient(to top right, var(--gradient-color-stops))', | |
| 'gradient-to-r': 'linear-gradient(to right, var(--gradient-color-stops))', | |
| 'gradient-to-br': 'linear-gradient(to bottom right, var(--gradient-color-stops))', | |
| 'gradient-to-b': 'linear-gradient(to bottom, var(--gradient-color-stops))', | |
| 'gradient-to-bl': 'linear-gradient(to bottom left, var(--gradient-color-stops))', | |
| 'gradient-to-l': 'linear-gradient(to left, var(--gradient-color-stops))', | |
| 'gradient-to-tl': 'linear-gradient(to top left, var(--gradient-color-stops))' | |
| }, | |
| gradientColorStops: theme => theme('colors'), | |
| backgroundOpacity: theme => theme('opacity'), | |
| backgroundPosition: { | |
| bottom: 'bottom', | |
| center: 'center', | |
| left: 'left', | |
| 'left-bottom': 'left bottom', | |
| 'left-top': 'left top', | |
| right: 'right', | |
| 'right-bottom': 'right bottom', | |
| 'right-top': 'right top', | |
| top: 'top' | |
| }, | |
| backgroundSize: { | |
| auto: 'auto', | |
| cover: 'cover', | |
| contain: 'contain' | |
| }, | |
| borderColor: theme => ({ | |
| ...theme('colors'), | |
| default: theme('colors.gray.300', 'currentColor') | |
| }), | |
| borderOpacity: theme => theme('opacity'), | |
| borderRadius: { | |
| none: '0', | |
| sm: '0.125rem', | |
| default: '0.25rem', | |
| md: '0.375rem', | |
| lg: '0.5rem', | |
| full: '9999px' | |
| }, | |
| borderWidth: { | |
| default: '1px', | |
| 0: '0', | |
| 2: '2px', | |
| 4: '4px', | |
| 8: '8px' | |
| }, | |
| boxShadow: { | |
| xs: '0 0 0 1px rgba(0, 0, 0, 0.05)', | |
| sm: '0 1px 2px 0 rgba(0, 0, 0, 0.05)', | |
| default: '0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06)', | |
| md: '0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06)', | |
| lg: '0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05)', | |
| xl: '0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04)', | |
| '2xl': '0 25px 50px -12px rgba(0, 0, 0, 0.25)', | |
| inner: 'inset 0 2px 4px 0 rgba(0, 0, 0, 0.06)', | |
| outline: '0 0 0 3px rgba(66, 153, 225, 0.5)', | |
| none: 'none' | |
| }, | |
| container: {}, | |
| cursor: { | |
| auto: 'auto', | |
| default: 'default', | |
| pointer: 'pointer', | |
| wait: 'wait', | |
| text: 'text', | |
| move: 'move', | |
| 'not-allowed': 'not-allowed' | |
| }, | |
| divideColor: theme => theme('borderColor'), | |
| divideOpacity: theme => theme('borderOpacity'), | |
| divideWidth: theme => theme('borderWidth'), | |
| fill: { | |
| current: 'currentColor' | |
| }, | |
| flex: { | |
| 1: '1 1 0%', | |
| auto: '1 1 auto', | |
| initial: '0 1 auto', | |
| none: 'none' | |
| }, | |
| flexGrow: { | |
| 0: '0', | |
| default: '1' | |
| }, | |
| flexShrink: { | |
| 0: '0', | |
| default: '1' | |
| }, | |
| fontFamily: { | |
| header: [ | |
| 'Roboto' | |
| ], | |
| sans: [ | |
| '"Poppins"', | |
| '"Exo 2"', | |
| 'Alata', | |
| 'Roboto', | |
| 'system-ui', | |
| '-apple-system', | |
| 'BlinkMacSystemFont', | |
| '"Segoe UI"', | |
| '"Helvetica Neue"', | |
| 'Arial', | |
| '"Noto Sans"', | |
| 'sans-serif', | |
| '"Apple Color Emoji"', | |
| '"Segoe UI Emoji"', | |
| '"Segoe UI Symbol"', | |
| '"Noto Color Emoji"' | |
| ], | |
| serif: ['Georgia', 'Cambria', '"Times New Roman"', 'Times', 'serif'], | |
| mono: ['Menlo', 'Monaco', 'Consolas', '"Liberation Mono"', '"Courier New"', 'monospace'] | |
| }, | |
| fontSize: { | |
| xs: '0.75rem', | |
| sm: '0.85rem', | |
| base: '0.95rem', | |
| lg: '1rem', | |
| xl: '1.25rem', | |
| '2xl': '1.5rem', | |
| '3xl': '1.875rem', | |
| '4xl': '2.25rem', | |
| '5xl': '3rem', | |
| '6xl': '4rem' | |
| }, | |
| fontWeight: { | |
| hairline: '100', | |
| thin: '200', | |
| light: '300', | |
| normal: '400', | |
| medium: '500', | |
| semibold: '600', | |
| bold: '700', | |
| extrabold: '800', | |
| black: '900' | |
| }, | |
| height: theme => ({ | |
| auto: 'auto', | |
| ...theme('spacing'), | |
| full: '100%', | |
| screen: '100vh' | |
| }), | |
| inset: { | |
| 0: '0', | |
| auto: 'auto' | |
| }, | |
| letterSpacing: { | |
| tighter: '-0.05em', | |
| tight: '-0.025em', | |
| normal: '0', | |
| wide: '0.025em', | |
| wider: '0.05em', | |
| widest: '0.1em' | |
| }, | |
| lineHeight: { | |
| none: '1', | |
| tight: '1.25', | |
| snug: '1.375', | |
| normal: '1.5', | |
| relaxed: '1.625', | |
| loose: '2', | |
| 3: '.75rem', | |
| 4: '1rem', | |
| 5: '1.25rem', | |
| 6: '1.5rem', | |
| 7: '1.75rem', | |
| 8: '2rem', | |
| 9: '2.25rem', | |
| 10: '2.5rem' | |
| }, | |
| listStyleType: { | |
| none: 'none', | |
| disc: 'disc', | |
| decimal: 'decimal' | |
| }, | |
| margin: (theme, { negative }) => ({ | |
| auto: 'auto', | |
| ...theme('spacing'), | |
| ...negative(theme('spacing')) | |
| }), | |
| maxHeight: { | |
| full: '100%', | |
| screen: '100vh' | |
| }, | |
| maxWidth: (theme, { breakpoints }) => ({ | |
| none: 'none', | |
| xs: '20rem', | |
| sm: '24rem', | |
| md: '28rem', | |
| lg: '32rem', | |
| xl: '36rem', | |
| '2xl': '42rem', | |
| '3xl': '48rem', | |
| '4xl': '56rem', | |
| '5xl': '64rem', | |
| '6xl': '72rem', | |
| full: '100%', | |
| ...breakpoints(theme('screens')) | |
| }), | |
| minHeight: { | |
| 0: '0', | |
| full: '100%', | |
| screen: '100vh' | |
| }, | |
| minWidth: { | |
| 0: '0', | |
| full: '100%' | |
| }, | |
| objectPosition: { | |
| bottom: 'bottom', | |
| center: 'center', | |
| left: 'left', | |
| 'left-bottom': 'left bottom', | |
| 'left-top': 'left top', | |
| right: 'right', | |
| 'right-bottom': 'right bottom', | |
| 'right-top': 'right top', | |
| top: 'top' | |
| }, | |
| opacity: { | |
| 0: '0', | |
| 25: '0.25', | |
| 50: '0.5', | |
| 75: '0.75', | |
| 100: '1' | |
| }, | |
| order: { | |
| first: '-9999', | |
| last: '9999', | |
| none: '0', | |
| 1: '1', | |
| 2: '2', | |
| 3: '3', | |
| 4: '4', | |
| 5: '5', | |
| 6: '6', | |
| 7: '7', | |
| 8: '8', | |
| 9: '9', | |
| 10: '10', | |
| 11: '11', | |
| 12: '12' | |
| }, | |
| padding: theme => theme('spacing'), | |
| placeholderColor: theme => theme('colors'), | |
| placeholderOpacity: theme => theme('opacity'), | |
| space: (theme, { negative }) => ({ | |
| ...theme('spacing'), | |
| ...negative(theme('spacing')) | |
| }), | |
| stroke: { | |
| current: 'currentColor' | |
| }, | |
| strokeWidth: { | |
| 0: '0', | |
| 1: '1', | |
| 2: '2' | |
| }, | |
| textColor: theme => theme('colors'), | |
| textOpacity: theme => theme('opacity'), | |
| width: theme => ({ | |
| auto: 'auto', | |
| ...theme('spacing'), | |
| '1/2': '50%', | |
| '1/3': '33.333333%', | |
| '2/3': '66.666667%', | |
| '1/4': '25%', | |
| '2/4': '50%', | |
| '3/4': '75%', | |
| '1/5': '20%', | |
| '2/5': '40%', | |
| '3/5': '60%', | |
| '4/5': '80%', | |
| '1/6': '16.666667%', | |
| '2/6': '33.333333%', | |
| '3/6': '50%', | |
| '4/6': '66.666667%', | |
| '5/6': '83.333333%', | |
| '1/12': '8.333333%', | |
| '2/12': '16.666667%', | |
| '3/12': '25%', | |
| '4/12': '33.333333%', | |
| '5/12': '41.666667%', | |
| '6/12': '50%', | |
| '7/12': '58.333333%', | |
| '8/12': '66.666667%', | |
| '9/12': '75%', | |
| '10/12': '83.333333%', | |
| '11/12': '91.666667%', | |
| full: '100%', | |
| screen: '100vw' | |
| }), | |
| zIndex: { | |
| auto: 'auto', | |
| 0: '0', | |
| 10: '10', | |
| 20: '20', | |
| 30: '30', | |
| 40: '40', | |
| 50: '50' | |
| }, | |
| gap: theme => theme('spacing'), | |
| gridTemplateColumns: { | |
| none: 'none', | |
| 1: 'repeat(1, minmax(0, 1fr))', | |
| 2: 'repeat(2, minmax(0, 1fr))', | |
| 3: 'repeat(3, minmax(0, 1fr))', | |
| 4: 'repeat(4, minmax(0, 1fr))', | |
| 5: 'repeat(5, minmax(0, 1fr))', | |
| 6: 'repeat(6, minmax(0, 1fr))', | |
| 7: 'repeat(7, minmax(0, 1fr))', | |
| 8: 'repeat(8, minmax(0, 1fr))', | |
| 9: 'repeat(9, minmax(0, 1fr))', | |
| 10: 'repeat(10, minmax(0, 1fr))', | |
| 11: 'repeat(11, minmax(0, 1fr))', | |
| 12: 'repeat(12, minmax(0, 1fr))' | |
| }, | |
| gridColumn: { | |
| auto: 'auto', | |
| 'span-1': 'span 1 / span 1', | |
| 'span-2': 'span 2 / span 2', | |
| 'span-3': 'span 3 / span 3', | |
| 'span-4': 'span 4 / span 4', | |
| 'span-5': 'span 5 / span 5', | |
| 'span-6': 'span 6 / span 6', | |
| 'span-7': 'span 7 / span 7', | |
| 'span-8': 'span 8 / span 8', | |
| 'span-9': 'span 9 / span 9', | |
| 'span-10': 'span 10 / span 10', | |
| 'span-11': 'span 11 / span 11', | |
| 'span-12': 'span 12 / span 12' | |
| }, | |
| gridColumnStart: { | |
| auto: 'auto', | |
| 1: '1', | |
| 2: '2', | |
| 3: '3', | |
| 4: '4', | |
| 5: '5', | |
| 6: '6', | |
| 7: '7', | |
| 8: '8', | |
| 9: '9', | |
| 10: '10', | |
| 11: '11', | |
| 12: '12', | |
| 13: '13' | |
| }, | |
| gridColumnEnd: { | |
| auto: 'auto', | |
| 1: '1', | |
| 2: '2', | |
| 3: '3', | |
| 4: '4', | |
| 5: '5', | |
| 6: '6', | |
| 7: '7', | |
| 8: '8', | |
| 9: '9', | |
| 10: '10', | |
| 11: '11', | |
| 12: '12', | |
| 13: '13' | |
| }, | |
| gridTemplateRows: { | |
| none: 'none', | |
| 1: 'repeat(1, minmax(0, 1fr))', | |
| 2: 'repeat(2, minmax(0, 1fr))', | |
| 3: 'repeat(3, minmax(0, 1fr))', | |
| 4: 'repeat(4, minmax(0, 1fr))', | |
| 5: 'repeat(5, minmax(0, 1fr))', | |
| 6: 'repeat(6, minmax(0, 1fr))' | |
| }, | |
| gridRow: { | |
| auto: 'auto', | |
| 'span-1': 'span 1 / span 1', | |
| 'span-2': 'span 2 / span 2', | |
| 'span-3': 'span 3 / span 3', | |
| 'span-4': 'span 4 / span 4', | |
| 'span-5': 'span 5 / span 5', | |
| 'span-6': 'span 6 / span 6' | |
| }, | |
| gridRowStart: { | |
| auto: 'auto', | |
| 1: '1', | |
| 2: '2', | |
| 3: '3', | |
| 4: '4', | |
| 5: '5', | |
| 6: '6', | |
| 7: '7' | |
| }, | |
| gridRowEnd: { | |
| auto: 'auto', | |
| 1: '1', | |
| 2: '2', | |
| 3: '3', | |
| 4: '4', | |
| 5: '5', | |
| 6: '6', | |
| 7: '7' | |
| }, | |
| transformOrigin: { | |
| center: 'center', | |
| top: 'top', | |
| 'top-right': 'top right', | |
| right: 'right', | |
| 'bottom-right': 'bottom right', | |
| bottom: 'bottom', | |
| 'bottom-left': 'bottom left', | |
| left: 'left', | |
| 'top-left': 'top left' | |
| }, | |
| scale: { | |
| 0: '0', | |
| 50: '.5', | |
| 75: '.75', | |
| 90: '.9', | |
| 95: '.95', | |
| 100: '1', | |
| 105: '1.05', | |
| 110: '1.1', | |
| 125: '1.25', | |
| 150: '1.5' | |
| }, | |
| rotate: { | |
| '-180': '-180deg', | |
| '-90': '-90deg', | |
| '-45': '-45deg', | |
| 0: '0', | |
| 45: '45deg', | |
| 90: '90deg', | |
| 180: '180deg' | |
| }, | |
| translate: (theme, { negative }) => ({ | |
| ...theme('spacing'), | |
| ...negative(theme('spacing')), | |
| '-full': '-100%', | |
| '-1/2': '-50%', | |
| '1/2': '50%', | |
| full: '100%' | |
| }), | |
| skew: { | |
| '-12': '-12deg', | |
| '-6': '-6deg', | |
| '-3': '-3deg', | |
| 0: '0', | |
| 3: '3deg', | |
| 6: '6deg', | |
| 12: '12deg' | |
| }, | |
| transitionProperty: { | |
| none: 'none', | |
| all: 'all', | |
| default: 'background-color, border-color, color, fill, stroke, opacity, box-shadow, transform', | |
| colors: 'background-color, border-color, color, fill, stroke', | |
| opacity: 'opacity', | |
| shadow: 'box-shadow', | |
| transform: 'transform' | |
| }, | |
| transitionTimingFunction: { | |
| linear: 'linear', | |
| in: 'cubic-bezier(0.4, 0, 1, 1)', | |
| out: 'cubic-bezier(0, 0, 0.2, 1)', | |
| 'in-out': 'cubic-bezier(0.4, 0, 0.2, 1)', | |
| 'in-back': 'cubic-bezier(0.6, -0.28, 0.735, 0.045)', | |
| 'in-circ': 'cubic-bezier(0.6, 0.04, 0.98, 0.335)', | |
| 'in-cubic': 'cubic-bezier(0.55, 0.055, 0.675, 0.19)', | |
| 'in-expo': 'cubic-bezier(0.95, 0.05, 0.795, 0.035)', | |
| 'in-quad': 'cubic-bezier(0.55, 0.085, 0.68, 0.53)', | |
| 'in-quart': 'cubic-bezier(0.895, 0.03, 0.685, 0.22)', | |
| 'in-quint': 'cubic-bezier(0.755, 0.05, 0.855, 0.06)', | |
| 'in-sine': 'cubic-bezier(0.47, 0, 0.745, 0.715)', | |
| 'out-back': 'cubic-bezier(0.175, 0.885, 0.32, 1.275)', | |
| 'out-circ': 'cubic-bezier(0.075, 0.82, 0.165, 1)', | |
| 'out-cubic': 'cubic-bezier(0.215, 0.61, 0.355, 1)', | |
| 'out-expo': 'cubic-bezier(0.19, 1, 0.22, 1)', | |
| 'out-quad': 'cubic-bezier(0.25, 0.46, 0.45, 0.94)', | |
| 'out-quart': 'cubic-bezier(0.165, 0.84, 0.44, 1)', | |
| 'out-quint': 'cubic-bezier(0.23, 1, 0.32, 1)', | |
| 'out-sine': 'cubic-bezier(0.39, 0.575, 0.565, 1)', | |
| 'in-out-back': 'cubic-bezier(0.68, -0.55, 0.265, 1.55)', | |
| 'in-out-circ': 'cubic-bezier(0.785, 0.135, 0.15, 0.86)', | |
| 'in-out-cubic': 'cubic-bezier(0.645, 0.045, 0.355, 1)', | |
| 'in-out-expo': 'cubic-bezier(1, 0, 0, 1)', | |
| 'in-out-quad': 'cubic-bezier(0.455, 0.03, 0.515, 0.955)', | |
| 'in-out-quart': 'cubic-bezier(0.77, 0, 0.175, 1)', | |
| 'in-out-quint': 'cubic-bezier(0.86, 0, 0.07, 1)', | |
| 'in-out-sine': 'cubic-bezier(0.445, 0.05, 0.55, 0.95)' | |
| }, | |
| transitionDuration: { | |
| 75: '75ms', | |
| 100: '100ms', | |
| 150: '150ms', | |
| 200: '200ms', | |
| 300: '300ms', | |
| 500: '500ms', | |
| 700: '700ms', | |
| 1000: '1000ms' | |
| }, | |
| transitionDelay: { | |
| 75: '75ms', | |
| 100: '100ms', | |
| 150: '150ms', | |
| 200: '200ms', | |
| 300: '300ms', | |
| 500: '500ms', | |
| 700: '700ms', | |
| 1000: '1000ms' | |
| }, | |
| animation: { | |
| none: 'none', | |
| spin: 'spin 1s linear infinite', | |
| ping: 'ping 1s cubic-bezier(0, 0, 0.2, 1) infinite', | |
| pulse: 'pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite', | |
| bounce: 'bounce 1s infinite' | |
| }, | |
| keyframes: { | |
| spin: { | |
| to: { transform: 'rotate(360deg)' } | |
| }, | |
| ping: { | |
| '75%, 100%': { transform: 'scale(2)', opacity: '0' } | |
| }, | |
| pulse: { | |
| '50%': { opacity: '.5' } | |
| }, | |
| bounce: { | |
| '0%, 100%': { | |
| transform: 'translateY(-25%)', | |
| animationTimingFunction: 'cubic-bezier(0.8,0,1,1)' | |
| }, | |
| '50%': { | |
| transform: 'none', | |
| animationTimingFunction: 'cubic-bezier(0,0,0.2,1)' | |
| } | |
| } | |
| } | |
| }, | |
| variants: { | |
| accessibility: ['responsive', 'focus'], | |
| alignContent: ['responsive'], | |
| alignItems: ['responsive'], | |
| alignSelf: ['responsive'], | |
| appearance: ['responsive'], | |
| backgroundAttachment: ['responsive'], | |
| backgroundClip: ['responsive'], | |
| backgroundColor: ['responsive', 'hover', 'focus', 'group-hover', 'dark', 'light', 'dark:hover', 'light:hover', 'dark:focus', 'light:focus'], | |
| backgroundImage: ['responsive'], | |
| gradientColorStops: ['responsive', 'hover', 'focus', 'group-hover', 'dark', 'light', 'dark:hover', 'light:hover', 'dark:focus', 'light:focus'], | |
| backgroundOpacity: ['responsive', 'hover', 'focus', 'group-hover', 'dark', 'light', 'dark:hover', 'light:hover', 'dark:focus', 'light:focus'], | |
| backgroundPosition: ['responsive'], | |
| backgroundRepeat: ['responsive'], | |
| backgroundSize: ['responsive'], | |
| borderCollapse: ['responsive'], | |
| borderColor: ['responsive', 'hover', 'focus', 'group-hover', 'dark', 'light', 'dark:hover', 'light:hover', 'dark:focus', 'light:focus'], | |
| borderOpacity: ['responsive', 'hover', 'focus'], | |
| borderRadius: ['responsive'], | |
| borderStyle: ['responsive'], | |
| borderWidth: ['responsive'], | |
| boxShadow: ['responsive', 'hover', 'focus', 'group-hover', 'dark', 'light', 'dark:hover', 'light:hover', 'dark:focus', 'light:focus'], | |
| boxSizing: ['responsive'], | |
| container: ['responsive'], | |
| cursor: ['responsive'], | |
| display: ['responsive'], | |
| divideColor: ['responsive'], | |
| divideOpacity: ['responsive'], | |
| divideStyle: ['responsive'], | |
| divideWidth: ['responsive'], | |
| fill: ['responsive'], | |
| flex: ['responsive'], | |
| flexDirection: ['responsive'], | |
| flexGrow: ['responsive'], | |
| flexShrink: ['responsive'], | |
| flexWrap: ['responsive'], | |
| float: ['responsive'], | |
| clear: ['responsive'], | |
| fontFamily: ['responsive'], | |
| fontSize: ['responsive'], | |
| fontSmoothing: ['responsive'], | |
| fontStyle: ['responsive'], | |
| fontWeight: ['responsive', 'hover', 'focus'], | |
| height: ['responsive', 'group-hover'], | |
| inset: ['responsive'], | |
| justifyContent: ['responsive'], | |
| letterSpacing: ['responsive'], | |
| lineHeight: ['responsive'], | |
| listStylePosition: ['responsive'], | |
| listStyleType: ['responsive'], | |
| margin: ['responsive'], | |
| maxHeight: ['responsive'], | |
| maxWidth: ['responsive'], | |
| minHeight: ['responsive'], | |
| minWidth: ['responsive'], | |
| objectFit: ['responsive'], | |
| objectPosition: ['responsive'], | |
| opacity: ['responsive', 'hover', 'focus', 'group-hover'], | |
| order: ['responsive'], | |
| outline: ['responsive', 'focus'], | |
| overflow: ['responsive'], | |
| overscrollBehavior: ['responsive'], | |
| padding: ['responsive'], | |
| placeholderColor: ['responsive', 'focus'], | |
| placeholderOpacity: ['responsive', 'focus'], | |
| pointerEvents: ['responsive'], | |
| position: ['responsive'], | |
| resize: ['responsive'], | |
| space: ['responsive'], | |
| stroke: ['responsive'], | |
| strokeWidth: ['responsive'], | |
| tableLayout: ['responsive'], | |
| textAlign: ['responsive'], | |
| textColor: ['responsive', 'hover', 'focus', 'group-hover', 'dark', 'light', 'dark:hover', 'light:hover', 'dark:focus', 'light:focus'], | |
| textOpacity: ['responsive', 'hover', 'focus', 'group-hover'], | |
| textDecoration: ['responsive', 'hover', 'focus', 'group-hover'], | |
| textTransform: ['responsive'], | |
| userSelect: ['responsive'], | |
| verticalAlign: ['responsive'], | |
| visibility: ['responsive'], | |
| whitespace: ['responsive'], | |
| width: ['responsive', 'group-hover'], | |
| wordBreak: ['responsive'], | |
| zIndex: ['responsive'], | |
| gap: ['responsive'], | |
| gridAutoFlow: ['responsive'], | |
| gridTemplateColumns: ['responsive'], | |
| gridColumn: ['responsive'], | |
| gridColumnStart: ['responsive'], | |
| gridColumnEnd: ['responsive'], | |
| gridTemplateRows: ['responsive'], | |
| gridRow: ['responsive'], | |
| gridRowStart: ['responsive'], | |
| gridRowEnd: ['responsive'], | |
| transform: ['responsive'], | |
| transformOrigin: ['responsive'], | |
| scale: ['responsive', 'hover', 'focus'], | |
| rotate: ['responsive', 'hover', 'focus'], | |
| translate: ['responsive', 'hover', 'focus', 'group-hover'], | |
| skew: ['responsive', 'hover', 'focus'], | |
| transitionProperty: ['responsive'], | |
| transitionTimingFunction: ['responsive'], | |
| transitionDuration: ['responsive'], | |
| transitionDelay: ['responsive'], | |
| animation: ['responsive'] | |
| }, | |
| corePlugins: {}, | |
| plugins: [ | |
| require('tailwindcss-multi-theme') | |
| ] | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment