display inline block, add min width to buttons and links

This commit is contained in:
shibao 2022-03-28 23:56:15 -04:00
parent a2d1ff9b89
commit 5d6ecba9f7
2 changed files with 16 additions and 0 deletions

View File

@ -25,6 +25,7 @@
} }
.btn { .btn {
@apply inline-block break-all min-w-4;
@apply focus:outline-none px-4 py-2 rounded-lg; @apply focus:outline-none px-4 py-2 rounded-lg;
@apply shadow-sm focus:shadow-lg; @apply shadow-sm focus:shadow-lg;
@apply transition-all duration-300 ease-in-out; @apply transition-all duration-300 ease-in-out;
@ -51,6 +52,7 @@
} }
.link { .link {
@apply inline-block break-all min-w-4;
@apply hover:underline; @apply hover:underline;
@apply transition-colors duration-500 ease-in-out; @apply transition-colors duration-500 ease-in-out;
} }

View File

@ -28,6 +28,20 @@ module.exports = {
128: '32rem', 128: '32rem',
192: '48rem', 192: '48rem',
256: '64rem' 256: '64rem'
},
minWidth: {
4: '1rem',
8: '2rem',
12: '3rem',
16: '4rem',
20: '8rem'
},
maxWidth: {
4: '1rem',
8: '2rem',
12: '3rem',
16: '4rem',
20: '8rem'
} }
} }
}, },