66 lines
1.4 KiB
CSS
66 lines
1.4 KiB
CSS
@tailwind base;
|
|
@tailwind components;
|
|
@tailwind utilities;
|
|
|
|
:root {
|
|
/* Branding Colors */
|
|
--hutopy-primary: #6B0065;
|
|
--hutopy-secondary: #A30E79;
|
|
|
|
/* UI COLORS */
|
|
--h-background: #1c181c;
|
|
--h-on-background: #e2e5e9;
|
|
--h-surface: #252225;
|
|
--h-on-surface: #e2e5e9;
|
|
--h-primary: #242b2b;
|
|
--h-on-primary: #e2e5e9;
|
|
--h-secondary: #e7e5ea;
|
|
--h-on-secondary: #000000;
|
|
--h-tertiary: #466568;
|
|
--h-on-tertiary: #bdb6b6;
|
|
--h-error: #bc2f2f;
|
|
--h-on-error: #ffffff;
|
|
}
|
|
|
|
@layer components {
|
|
.btn {
|
|
@apply min-w-24 w-full;
|
|
@apply p-4;
|
|
@apply flex flex-nowrap gap-4 items-center justify-center ;
|
|
@apply rounded-lg;
|
|
@apply capitalize text-base font-sans font-medium;
|
|
@apply w-fit px-10;
|
|
}
|
|
|
|
button.primary {
|
|
@apply btn;
|
|
@apply bg-hPrimary text-hOnPrimary;
|
|
@apply hover:brightness-125;
|
|
}
|
|
|
|
button.secondary {
|
|
@apply btn;
|
|
@apply bg-hSecondary text-hOnSecondary;
|
|
@apply hover:bg-hSecondary;
|
|
}
|
|
|
|
div.card {
|
|
@apply w-[1024px];
|
|
@apply rounded-xl p-10 m-4;
|
|
@apply bg-hSurface text-hOnSurface;
|
|
}
|
|
|
|
div.card-title {
|
|
@apply font-sans font-bold text-2xl;
|
|
@apply mb-8;
|
|
}
|
|
|
|
div.card-entry {
|
|
@apply mb-4;
|
|
}
|
|
|
|
div.card-actions {
|
|
@apply flex flex-row gap-6 justify-end;
|
|
}
|
|
}
|