139 lines
2.6 KiB
CSS
139 lines
2.6 KiB
CSS
@tailwind base;
|
|
@tailwind components;
|
|
@tailwind utilities;
|
|
|
|
@layer base {
|
|
* {
|
|
@apply text-white box-border;
|
|
}
|
|
body {
|
|
@apply dark:bg-mixed-100 bg-primary-600;
|
|
}
|
|
input,
|
|
select {
|
|
@apply py-2 px-4 rounded-lg dark:bg-mixed-200 bg-mixed-600 placeholder:text-dark-500;
|
|
}
|
|
textarea {
|
|
@apply dark:bg-mixed-200 bg-primary-600 rounded-md p-1;
|
|
}
|
|
h1,
|
|
h2,
|
|
h3,
|
|
h4,
|
|
h5,
|
|
h6 {
|
|
@apply font-bold;
|
|
}
|
|
p {
|
|
@apply py-1;
|
|
}
|
|
}
|
|
|
|
@layer components {
|
|
.strapline {
|
|
@apply dark:text-primary-500 text-primary-100 uppercase font-bold mb-2 text-lg;
|
|
}
|
|
|
|
.heading {
|
|
@apply pb-6 mb-6 border-b border-b-primary-500 dark:border-b-dark-500 min-w-full;
|
|
}
|
|
.heading h1 {
|
|
@apply text-5xl font-bold;
|
|
}
|
|
|
|
.card {
|
|
@apply dark:bg-mixed-200 bg-primary-500 rounded-3xl p-6 shadow-2xl
|
|
/* mix-blend-luminosity */
|
|
/* @apply bg-mixed-200 rounded-3xl p-6 shadow-2xl */;
|
|
}
|
|
|
|
.btn {
|
|
@apply rounded-lg;
|
|
}
|
|
.btn-primary {
|
|
@apply dark:bg-primary-500 bg-primary-100 py-4 px-6 dark:text-mixed-100 text-white font-bold text-lg btn;
|
|
}
|
|
.btn-secondary {
|
|
@apply dark:text-primary-500 text-primary-100 py-4 px-6 font-bold text-lg;
|
|
}
|
|
.btn-small {
|
|
@apply px-2 py-1;
|
|
}
|
|
.p {
|
|
@apply pb-1;
|
|
}
|
|
|
|
.poppable {
|
|
@apply card dark:bg-mixed-300 bg-primary-600 p-2 rounded-lg transition-opacity data-[visible=true]:z-10 data-[visible=true]:opacity-100 data-[visible=false]:opacity-0 -z-10 max-w-[400px] absolute;
|
|
}
|
|
|
|
.skeleton {
|
|
@apply animate-pulse bg-black/20 rounded-md text-white/0;
|
|
}
|
|
|
|
/* .accordion {
|
|
@apply first-of-type:rounded-t-md last-of-type:rounded-b-md;
|
|
} */
|
|
.accordion:not(.accordion + .accordion) {
|
|
@apply rounded-t-md;
|
|
}
|
|
.accordion:has(+ .accordion) {
|
|
@apply border-b border-black/20 dark:border-white/20;
|
|
}
|
|
.accordion:not(:has(+ .accordion)) {
|
|
@apply rounded-b-md;
|
|
}
|
|
|
|
.md-table {
|
|
@apply bg-black/20 rounded-md overflow-clip;
|
|
}
|
|
.md-table td,
|
|
.md-table th {
|
|
@apply px-4 border border-black/20 dark:border-white/20;
|
|
}
|
|
}
|
|
|
|
@layer utilities {
|
|
.fade-toast {
|
|
animation: fadeOut 300ms forwards;
|
|
}
|
|
|
|
.separated-list > li:not(:last-child) {
|
|
@apply border-b border-mixed-600 w-full;
|
|
}
|
|
|
|
.fade-menu {
|
|
animation: fadeIn 100ms forwards;
|
|
}
|
|
.fade-menu[data-closing="true"] {
|
|
animation: fadeOut 100ms forwards;
|
|
}
|
|
}
|
|
|
|
@keyframes identifier {
|
|
}
|
|
|
|
@layer utilities {
|
|
.list-1 {
|
|
/* @apply list-[square]; */
|
|
list-style: square;
|
|
}
|
|
}
|
|
|
|
@keyframes fadeOut {
|
|
from {
|
|
opacity: 1;
|
|
}
|
|
to {
|
|
opacity: 0;
|
|
}
|
|
}
|
|
@keyframes fadeIn {
|
|
from {
|
|
opacity: 0;
|
|
}
|
|
to {
|
|
opacity: 1;
|
|
}
|
|
}
|