💄 try some colors

This commit is contained in:
2022-02-27 13:11:24 +01:00
parent 15344f5554
commit 93c1e3ba38
5 changed files with 167 additions and 33 deletions

View File

@ -2,11 +2,6 @@
position: static
}
.my-0 {
margin-top: 0px;
margin-bottom: 0px
}
.mb-4 {
margin-bottom: 1rem
}
@ -97,6 +92,10 @@
margin-left: calc(0.25rem * calc(1 - var(--tw-space-x-reverse)))
}
.\!rounded-md {
border-radius: 0.375rem !important
}
.rounded-md {
border-radius: 0.375rem
}
@ -105,10 +104,6 @@
border-radius: 0.25rem
}
.\!rounded-md {
border-radius: 0.375rem !important
}
.rounded-full {
border-radius: 9999px
}
@ -140,6 +135,56 @@
border-color: rgb(168 85 247 / var(--tw-border-opacity))
}
.border-green-500 {
--tw-border-opacity: 1;
border-color: rgb(34 197 94 / var(--tw-border-opacity))
}
.border-orange-500 {
--tw-border-opacity: 1;
border-color: rgb(249 115 22 / var(--tw-border-opacity))
}
.border-black {
--tw-border-opacity: 1;
border-color: rgb(0 0 0 / var(--tw-border-opacity))
}
.border-red-500 {
--tw-border-opacity: 1;
border-color: rgb(239 68 68 / var(--tw-border-opacity))
}
.border-teal-500 {
--tw-border-opacity: 1;
border-color: rgb(20 184 166 / var(--tw-border-opacity))
}
.bg-green-600 {
--tw-bg-opacity: 1;
background-color: rgb(22 163 74 / var(--tw-bg-opacity))
}
.bg-orange-600 {
--tw-bg-opacity: 1;
background-color: rgb(234 88 12 / var(--tw-bg-opacity))
}
.bg-black {
--tw-bg-opacity: 1;
background-color: rgb(0 0 0 / var(--tw-bg-opacity))
}
.bg-red-600 {
--tw-bg-opacity: 1;
background-color: rgb(220 38 38 / var(--tw-bg-opacity))
}
.bg-teal-600 {
--tw-bg-opacity: 1;
background-color: rgb(13 148 136 / var(--tw-bg-opacity))
}
.bg-blue-900\/20 {
background-color: rgb(30 58 138 / 0.2)
}
@ -152,9 +197,9 @@
padding: 1rem
}
.py-2\.5 {
padding-top: 0.625rem;
padding-bottom: 0.625rem
.px-4 {
padding-left: 1rem;
padding-right: 1rem
}
.py-2 {
@ -162,9 +207,9 @@
padding-bottom: 0.5rem
}
.px-4 {
padding-left: 1rem;
padding-right: 1rem
.py-2\.5 {
padding-top: 0.625rem;
padding-bottom: 0.625rem
}
.py-1 {
@ -233,6 +278,31 @@
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
}
.hover\:\!bg-green-500:hover {
--tw-bg-opacity: 1 !important;
background-color: rgb(34 197 94 / var(--tw-bg-opacity)) !important
}
.hover\:\!bg-orange-500:hover {
--tw-bg-opacity: 1 !important;
background-color: rgb(249 115 22 / var(--tw-bg-opacity)) !important
}
.hover\:\!bg-gray-500:hover {
--tw-bg-opacity: 1 !important;
background-color: rgb(107 114 128 / var(--tw-bg-opacity)) !important
}
.hover\:\!bg-red-500:hover {
--tw-bg-opacity: 1 !important;
background-color: rgb(239 68 68 / var(--tw-bg-opacity)) !important
}
.hover\:\!bg-teal-500:hover {
--tw-bg-opacity: 1 !important;
background-color: rgb(20 184 166 / var(--tw-bg-opacity)) !important
}
.hover\:bg-white\/\[0\.12\]:hover {
background-color: rgb(255 255 255 / 0.12)
}
@ -247,11 +317,69 @@
outline-offset: 2px
}
@media (prefers-color-scheme: dark) {
.dark\:text-neutral-400 {
--tw-text-opacity: 1;
color: rgb(163 163 163 / var(--tw-text-opacity))
}
.dark .dark\:border-white {
--tw-border-opacity: 1;
border-color: rgb(255 255 255 / var(--tw-border-opacity))
}
.dark .dark\:bg-green-800 {
--tw-bg-opacity: 1;
background-color: rgb(22 101 52 / var(--tw-bg-opacity))
}
.dark .dark\:bg-orange-800 {
--tw-bg-opacity: 1;
background-color: rgb(154 52 18 / var(--tw-bg-opacity))
}
.dark .dark\:bg-white {
--tw-bg-opacity: 1;
background-color: rgb(255 255 255 / var(--tw-bg-opacity))
}
.dark .dark\:bg-red-800 {
--tw-bg-opacity: 1;
background-color: rgb(153 27 27 / var(--tw-bg-opacity))
}
.dark .dark\:bg-teal-800 {
--tw-bg-opacity: 1;
background-color: rgb(17 94 89 / var(--tw-bg-opacity))
}
.dark .dark\:\!text-black {
--tw-text-opacity: 1 !important;
color: rgb(0 0 0 / var(--tw-text-opacity)) !important
}
.dark .dark\:text-neutral-400 {
--tw-text-opacity: 1;
color: rgb(163 163 163 / var(--tw-text-opacity))
}
.dark .dark\:hover\:\!bg-green-700:hover {
--tw-bg-opacity: 1 !important;
background-color: rgb(21 128 61 / var(--tw-bg-opacity)) !important
}
.dark .dark\:hover\:\!bg-orange-700:hover {
--tw-bg-opacity: 1 !important;
background-color: rgb(194 65 12 / var(--tw-bg-opacity)) !important
}
.dark .dark\:hover\:\!bg-gray-700:hover {
--tw-bg-opacity: 1 !important;
background-color: rgb(55 65 81 / var(--tw-bg-opacity)) !important
}
.dark .dark\:hover\:\!bg-red-700:hover {
--tw-bg-opacity: 1 !important;
background-color: rgb(185 28 28 / var(--tw-bg-opacity)) !important
}
.dark .dark\:hover\:\!bg-teal-700:hover {
--tw-bg-opacity: 1 !important;
background-color: rgb(15 118 110 / var(--tw-bg-opacity)) !important
}
@media (min-width: 640px) {