@metamask/design-system-tailwind-preset/dist/index.cjs

Design System Tailwind CSS preset for MetaMask projects

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const colors_1 = require("./colors.cjs");
const shadows_1 = require("./shadows.cjs");
const typography_1 = require("./typography.cjs");
const tailwindConfig = {
    content: [],
    theme: {
        extend: {
            colors: {
                ...colors_1.colors,
            },
            // Reduces redundancy by enabling shorter Tailwind class names
            textColor: ({ theme }) => ({
                ...theme('colors'),
                ...colors_1.colors.text, // e.g. text-default instead of text-text-default
            }),
            backgroundColor: ({ theme }) => ({
                ...theme('colors'),
                ...colors_1.colors.background, // e.g. bg-default instead of bg-background-default
            }),
            borderColor: ({ theme }) => ({
                ...theme('colors'),
                ...colors_1.colors.border, // e.g. border-default instead of border-border-default
            }),
            ...typography_1.typography,
            boxShadow: shadows_1.shadows,
        },
    },
    plugins: [
        shadows_1.shadowPlugin, // Allows for combination of size and color shadow utilities
    ],
};
exports.default = tailwindConfig;
module.exports = tailwindConfig;
//# sourceMappingURL=index.cjs.map