38 lines
997 B
JavaScript
38 lines
997 B
JavaScript
|
|
import plugin from 'tailwindcss/plugin';
|
|
|
|
export default plugin(({addComponents, theme}) => {
|
|
// Base
|
|
addComponents({
|
|
'.tabs': {
|
|
'display': 'flex',
|
|
'align-items': 'center',
|
|
'gap': theme('spacing.5'),
|
|
'border-bottom': '1px solid var(--tw-gray-200)'
|
|
},
|
|
'.tab': {
|
|
'display': 'inline-flex',
|
|
'align-items': 'center',
|
|
'gap': theme('spacing')['2'],
|
|
'font-size': theme('fontSize.2sm'),
|
|
'line-height': '1',
|
|
'color': 'var(--tw-gray-700)',
|
|
'i': {
|
|
'font-size': theme('fontSize.md'),
|
|
'color': 'var(--tw-gray-600)',
|
|
},
|
|
'font-weight': theme('fontWeight.medium'),
|
|
'padding': `${theme('spacing.4')} 0`,
|
|
'border-bottom': '2px solid transparent',
|
|
'&.active, &:hover, &:focus': {
|
|
'color': 'var(--tw-primary)',
|
|
'i': {
|
|
'color': 'var(--tw-primary)'
|
|
}
|
|
},
|
|
'&.active': {
|
|
'border-bottom-color': 'var(--tw-primary)'
|
|
}
|
|
}
|
|
});
|
|
}); |