95 lines
2.1 KiB
CSS
95 lines
2.1 KiB
CSS
@tailwind base;
|
|
@tailwind components;
|
|
@tailwind utilities;
|
|
|
|
@layer base {
|
|
body {
|
|
@apply bg-slate-100 text-slate-900 antialiased;
|
|
}
|
|
|
|
h1 {
|
|
@apply text-2xl font-semibold tracking-tight text-slate-900;
|
|
}
|
|
|
|
h2 {
|
|
@apply text-xl font-semibold tracking-tight text-slate-900;
|
|
}
|
|
|
|
h3 {
|
|
@apply text-lg font-semibold text-slate-900;
|
|
}
|
|
|
|
a {
|
|
@apply text-brand-700 hover:text-brand-600;
|
|
}
|
|
|
|
label {
|
|
@apply mb-1 block text-sm font-medium text-slate-700;
|
|
}
|
|
|
|
input,
|
|
select,
|
|
textarea {
|
|
@apply w-full rounded-md border border-slate-300 bg-white px-3 py-2 text-sm text-slate-900 shadow-sm outline-none ring-brand-600 transition focus:border-brand-600 focus:ring-2;
|
|
}
|
|
|
|
input[type='checkbox'] {
|
|
@apply h-4 w-4 rounded border-slate-300 p-0 text-brand-700;
|
|
}
|
|
|
|
summary {
|
|
@apply cursor-pointer font-medium text-slate-800;
|
|
}
|
|
}
|
|
|
|
@layer components {
|
|
.page-container {
|
|
@apply mx-auto w-full max-w-6xl px-4 sm:px-6 lg:px-8;
|
|
}
|
|
|
|
.panel {
|
|
@apply rounded-xl border border-slate-200 bg-white p-5 shadow-soft;
|
|
}
|
|
|
|
.btn {
|
|
@apply inline-flex items-center justify-center rounded-md border border-brand-700 bg-brand-700 px-3 py-2 text-sm font-medium text-white transition hover:bg-brand-600;
|
|
}
|
|
|
|
.btn-secondary {
|
|
@apply inline-flex items-center justify-center rounded-md border border-slate-300 bg-white px-3 py-2 text-sm font-medium text-slate-700 transition hover:bg-slate-50;
|
|
}
|
|
|
|
.table-wrap {
|
|
@apply overflow-x-auto rounded-lg border border-slate-200;
|
|
}
|
|
|
|
.data-table {
|
|
@apply min-w-full divide-y divide-slate-200 text-sm;
|
|
}
|
|
|
|
.data-table thead {
|
|
@apply bg-slate-50;
|
|
}
|
|
|
|
.data-table th {
|
|
@apply px-3 py-2 text-left text-xs font-semibold uppercase tracking-wide text-slate-600;
|
|
}
|
|
|
|
.data-table td {
|
|
@apply whitespace-nowrap px-3 py-2 text-slate-700;
|
|
}
|
|
|
|
.empty-state {
|
|
@apply rounded-lg border border-dashed border-slate-300 bg-slate-50 p-6 text-center text-sm text-slate-600;
|
|
}
|
|
|
|
.htmx-indicator {
|
|
display: none;
|
|
}
|
|
|
|
.htmx-request .htmx-indicator,
|
|
.htmx-request.htmx-indicator {
|
|
display: block;
|
|
}
|
|
}
|