vue-cssgen/rules/borderRadius.js

Инструмент для автоматизации работы со стилями в Vue 3-проектах

const borderRadiusValues = {
    'none': '0',
    'sm': '0.125rem',
    'md': '0.25rem',
    'lg': '0.5rem',
    'xl': '0.75rem',
    '2xl': '1rem',
    'full': '9999px',
};

export default [
    {
        match: /^rounded-(none|sm|md|lg|full)$/,
        css: cls => {
            const val = borderRadiusValues[cls.match(/^rounded-(none|sm|md|lg|full)$/)[1]];
            return val ? `.${cls} { border-radius: ${val}; }` : null;
        },
        group: 'border',
        desc: 'border-radius',
        modifiable: true,
        examples: ['rounded-none', 'rounded-md', 'rounded-full'],
        values: borderRadiusValues,
        prefix: 'rounded-'
    },
];