rogden / tailwind-config-viewer

A local UI tool for visualizing your Tailwind CSS configuration file.
1.99k stars 110 forks source link

Font size using wrong value #46

Closed KevinBatdorf closed 3 years ago

KevinBatdorf commented 3 years ago

Seems like it used the line height to set the font size value. Possibly related to #45

"tailwind-config-viewer": "^1.6.1" "tailwindcss": "^2.1.2",

Screen Shot 2021-06-02 at 3 33 05 PM

module.exports = {
    purge: ['src/**/*'],
    important: '.sdk',
    darkMode: false,
    theme: {
        screens: {
            xxs: '280px',
            xs: '480px',
            sm: '600px',
            md: '782px',
            md2: '960px', // admin sidebar auto folds
            lg: '1080px', // adminbar goes big
            xl: '1280px',
            '2xl': '1440px',
            '3xl': '1600px',
        },
        // Extend will add on to TW config, where the above will override and replace
        extend: {
            fontSize: {
                '3xl': ['2rem', '2.5rem'],
            },
            colors: {
                'wp-theme': {
                    500: 'var(--wp-admin-theme-color)',
                    600: 'var(--wp-admin-theme-color-darker-10)',
                    700: 'var(--wp-admin-theme-color-darker-20)',
                },
                wp: {
                    alert: {
                        yellow: '#f0b849',
                        red:    '#cc1818',
                        green:  '#4ab866',
                    },
                },
                gray: {
                    100: '#f0f0f0',
                    150: '#eaeaea', // This wasn't a variable but I saw it on buttons
                    200: '#e0e0e0', // Used sparingly for light borders.
                    300: '#dddddd', // Used for most borders.
                    400: '#cccccc',
                    500: '#cccccc', // WP didn't have a 500 value for some reason so I just copied the 400
                    600: '#949494', // Meets 3:1 UI or large text contrast against white.
                    700: '#757575', // Meets 4.6:1 text contrast against white.
                    900: '#1e1e1e',
                },
            },
            zIndex: {
                high: '1000000',
                max: '2147483647', // Highest the browser allows - don't block WP re-auth modal though
            },
        },
    },
    variants: {
        extend: {},
    },
    plugins: [],
    corePlugins: {
        preflight: false,
        container: false,
    },
}
rogden commented 3 years ago

Thanks for the report. Fixed in v.1.6.2.