Files
arch-repo/src/app.css
u80864958 02918feca1 init
2025-10-21 08:07:41 +02:00

128 lines
2.2 KiB
CSS

@import 'tailwindcss';
@plugin '@tailwindcss/forms';
@plugin '@tailwindcss/typography';
@plugin 'flowbite/plugin';
@custom-variant dark (&:where(.dark, .dark *));
@theme {
--color-primary-50: #fff5f2;
--color-primary-100: #fff1ee;
--color-primary-200: #ffe4de;
--color-primary-300: #ffd5cc;
--color-primary-400: #ffbcad;
--color-primary-500: #fe795d;
--color-primary-600: #ef562f;
--color-primary-700: #eb4f27;
--color-primary-800: #cc4522;
--color-primary-900: #a5371b;
--color-secondary-50: #f0f9ff;
--color-secondary-100: #e0f2fe;
--color-secondary-200: #bae6fd;
--color-secondary-300: #7dd3fc;
--color-secondary-400: #38bdf8;
--color-secondary-500: #0ea5e9;
--color-secondary-600: #0284c7;
--color-secondary-700: #0369a1;
--color-secondary-800: #075985;
--color-secondary-900: #0c4a6e;
}
@source "../node_modules/flowbite-svelte/dist";
@source "../node_modules/flowbite-svelte-icons/dist";
@layer base {
/* disable chrome cancel button */
input[type='search']::-webkit-search-cancel-button {
display: none;
}
}
/* Custom heading styles */
@layer components {
h1 {
@apply mb-4 text-4xl font-bold text-gray-900;
}
h2 {
@apply mb-3 text-3xl font-semibold text-gray-800;
}
h3 {
@apply mb-2 text-2xl font-medium text-gray-700;
}
h4 {
@apply mb-2 text-xl font-medium text-gray-600;
}
h5 {
@apply mb-1 text-lg font-medium text-gray-500;
}
h6 {
@apply mb-1 text-base font-medium text-gray-400;
}
}
@layer markdown {
.app-markdown {
h1 {
@apply mt-8 mb-4 text-3xl font-bold;
}
h2 {
@apply mt-6 mb-3 text-2xl font-semibold;
}
h3 {
@apply mt-5 mb-2 text-xl font-semibold;
}
h4,
h5,
h6 {
@apply mt-4 mb-2 text-xl font-medium;
}
a {
@apply text-blue-600 underline transition-colors hover:text-blue-800;
}
ul {
@apply mb-4 list-disc pl-6;
}
ol {
@apply mb-4 list-decimal pl-6;
}
li {
@apply mb-1;
}
table {
@apply my-6 w-full border-collapse shadow-sm;
}
th,
td {
@apply border border-gray-200 px-4 py-2 text-left;
}
th {
@apply font-semibold;
}
/**/
/* tr:nth-child(even) { */
/* @apply bg-gray-50; */
/* } */
blockquote {
@apply rounded-md p-3 italic backdrop-blur-md;
}
p {
@apply mb-2;
}
}
}