Add more button states and icons

This commit is contained in:
Daniel Egger 2022-06-13 15:00:35 +02:00
parent 736ecb2449
commit d0f0061051
2 changed files with 16 additions and 3 deletions

View File

@ -20,16 +20,20 @@ module.exports = {
current: 'currentColor',
'white': '#ffffff',
'blue': {
700: '#1A5197',
900: '#00224D',
},
'sky': {
400: '#72CAFF',
500: '#41B5FA',
},
'orange': {
500: '#FE955A',
600: '#F37F3E',
},
'green': {
500: '#3EDF9C',
600: '#17D29A',
},
'red': {
500: '#DE3618',

View File

@ -43,15 +43,24 @@ html {
}
.btn-primary {
@apply font-bold py-2 px-4 align-middle inline-block bg-blue-900 text-white border-2 border-blue-900 hover:bg-sky-500
@apply font-bold py-2 px-4 align-middle inline-block
bg-blue-900 text-white border-2 border-blue-900
hover:bg-blue-700 hover:border-blue-700
disabled:opacity-50
}
.btn-secondary {
@apply font-bold py-2 px-4 align-middle inline-block bg-white text-blue-900 border-2 border-blue-900 hover:bg-sky-500
@apply font-bold py-2 px-4 align-middle inline-block
bg-white text-blue-900 border-2 border-blue-900
hover:bg-gray-100
disabled:opacity-50
}
.btn-blue {
@apply font-bold py-2 px-4 align-middle inline-block bg-sky-500 text-blue-900 border-2 border-sky-500 hover:bg-blue-900 hover:text-white
@apply font-bold py-2 px-4 align-middle inline-block
bg-sky-500 text-blue-900 border-2 border-sky-500
hover:bg-sky-400 hover:border-sky-400
disabled:opacity-50
}
}