38 lines
1.0 KiB
JavaScript
38 lines
1.0 KiB
JavaScript
import plugin from 'tailwindcss/plugin';
|
|
|
|
export default plugin(({ addComponents }) => {
|
|
// Form input
|
|
addComponents({
|
|
'.input-group': {
|
|
'display': 'flex',
|
|
'align-items': 'stretch',
|
|
'.btn': {
|
|
'flex-shrink': '0',
|
|
},
|
|
'.input': {
|
|
'flex-grow': '1',
|
|
},
|
|
'.input ~ .btn, .input ~ .dropdown > .btn': {
|
|
'border-start-start-radius': '0',
|
|
'border-end-start-radius': '0',
|
|
},
|
|
'.input + .btn, .input + .dropdown > .btn': {
|
|
'border-inline-start': '0',
|
|
},
|
|
'.btn ~ .input, .btn ~ .btn, .input ~ .input': {
|
|
'border-start-start-radius': '0',
|
|
'border-end-start-radius': '0',
|
|
},
|
|
'.input:has(~ .btn), .input:has(~ .input), .input:has(~ .dropdown > .btn)': {
|
|
'border-start-end-radius': '0',
|
|
'border-end-end-radius': '0',
|
|
},
|
|
'.btn:has(~ .input, ~ .btn), .input:has(~ .input)': {
|
|
'border-start-end-radius': '0',
|
|
'border-end-end-radius': '0',
|
|
'border-inline-end': '0',
|
|
},
|
|
},
|
|
});
|
|
});
|