This commit is contained in:
@@ -1,93 +1,93 @@
|
||||
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');
|
||||
|
||||
:root {
|
||||
--bg-page: #16121a;
|
||||
--surface-bg: rgba(24, 24, 27, 0.45);
|
||||
--surface-bg-strong: rgba(24, 24, 27, 0.62);
|
||||
--surface-border: rgba(82, 82, 91, 0.6);
|
||||
--surface-divider: rgba(63, 63, 70, 0.85);
|
||||
--text-primary: #d5cfdf;
|
||||
--text-secondary: #bcb7c8;
|
||||
--text-muted: #a1a1aa;
|
||||
--text-soft: #8f8b9c;
|
||||
--field-bg: rgba(24, 24, 27, 0.6);
|
||||
--field-border: #3f3f46;
|
||||
--field-disabled-bg: rgba(24, 24, 27, 0.5);
|
||||
--field-disabled-border: #3f3f46;
|
||||
--field-disabled-text: #bbb6c3;
|
||||
--field-disabled-placeholder: #71717a;
|
||||
--ghost-bg: rgba(24, 24, 27, 0.5);
|
||||
--ghost-border: #3f3f46;
|
||||
--ghost-hover: rgba(39, 39, 42, 0.7);
|
||||
--ghost-disabled-bg: rgba(24, 24, 27, 0.3);
|
||||
--ghost-disabled-border: #27272a;
|
||||
--ghost-disabled-text: #71717a;
|
||||
--primary-disabled-bg: #3f3f46;
|
||||
--primary-disabled-text: #a1a1aa;
|
||||
--table-head-bg: rgba(24, 24, 27, 0.8);
|
||||
--table-row-divider: #27272a;
|
||||
--auth-chrome-bg: rgba(24, 24, 27, 0.7);
|
||||
--auth-glass-blur: 22px;
|
||||
--auth-sidebar-mobile-width: min(86vw, 320px);
|
||||
--auth-right-sidebar-mobile-width: min(86vw, 340px);
|
||||
--error-border: rgba(252, 165, 165, 0.3);
|
||||
--error-bg: rgba(239, 68, 68, 0.1);
|
||||
--error-text: #fecaca;
|
||||
--mdx-link: #7d6f98;
|
||||
--mdx-link-hover: #9587ad;
|
||||
--mdx-inline-code-bg: #27272a;
|
||||
--mdx-inline-code-border: #3f3f46;
|
||||
--mdx-codeblock-bg: #18181b;
|
||||
--mdx-codeblock-border: #3f3f46;
|
||||
--mdx-codeblock-text: #e4e4e7;
|
||||
--mdx-codeblock-gutter: #a1a1aa;
|
||||
--mdx-codeblock-active: #27272a;
|
||||
--mdx-codeblock-selection: rgba(125, 111, 152, 0.35);
|
||||
--mdx-codeblock-bracket: rgba(125, 111, 152, 0.45);
|
||||
--shadow-glow: 0 0 0 1px rgba(63, 63, 70, 0.65), 0 18px 44px rgba(0, 0, 0, 0.45);
|
||||
--bg-page: #16121a;
|
||||
--surface-bg: rgba(24, 24, 27, 0.45);
|
||||
--surface-bg-strong: rgba(24, 24, 27, 0.62);
|
||||
--surface-border: rgba(82, 82, 91, 0.6);
|
||||
--surface-divider: rgba(63, 63, 70, 0.85);
|
||||
--text-primary: #d5cfdf;
|
||||
--text-secondary: #bcb7c8;
|
||||
--text-muted: #a1a1aa;
|
||||
--text-soft: #8f8b9c;
|
||||
--field-bg: rgba(24, 24, 27, 0.6);
|
||||
--field-border: #3f3f46;
|
||||
--field-disabled-bg: rgba(24, 24, 27, 0.5);
|
||||
--field-disabled-border: #3f3f46;
|
||||
--field-disabled-text: #bbb6c3;
|
||||
--field-disabled-placeholder: #71717a;
|
||||
--ghost-bg: rgba(24, 24, 27, 0.5);
|
||||
--ghost-border: #3f3f46;
|
||||
--ghost-hover: rgba(39, 39, 42, 0.7);
|
||||
--ghost-disabled-bg: rgba(24, 24, 27, 0.3);
|
||||
--ghost-disabled-border: #27272a;
|
||||
--ghost-disabled-text: #71717a;
|
||||
--primary-disabled-bg: #3f3f46;
|
||||
--primary-disabled-text: #a1a1aa;
|
||||
--table-head-bg: rgba(24, 24, 27, 0.8);
|
||||
--table-row-divider: #27272a;
|
||||
--auth-chrome-bg: rgba(24, 24, 27, 0.7);
|
||||
--auth-glass-blur: 22px;
|
||||
--auth-sidebar-mobile-width: min(86vw, 320px);
|
||||
--auth-right-sidebar-mobile-width: min(86vw, 340px);
|
||||
--error-border: rgba(252, 165, 165, 0.3);
|
||||
--error-bg: rgba(239, 68, 68, 0.1);
|
||||
--error-text: #fecaca;
|
||||
--mdx-link: #7d6f98;
|
||||
--mdx-link-hover: #9587ad;
|
||||
--mdx-inline-code-bg: #27272a;
|
||||
--mdx-inline-code-border: #3f3f46;
|
||||
--mdx-codeblock-bg: #18181b;
|
||||
--mdx-codeblock-border: #3f3f46;
|
||||
--mdx-codeblock-text: #e4e4e7;
|
||||
--mdx-codeblock-gutter: #a1a1aa;
|
||||
--mdx-codeblock-active: #27272a;
|
||||
--mdx-codeblock-selection: rgba(125, 111, 152, 0.35);
|
||||
--mdx-codeblock-bracket: rgba(125, 111, 152, 0.45);
|
||||
--shadow-glow: 0 0 0 1px rgba(63, 63, 70, 0.65), 0 18px 44px rgba(0, 0, 0, 0.45);
|
||||
}
|
||||
|
||||
:root[data-theme='light'] {
|
||||
--bg-page: #f7f7fb;
|
||||
--surface-bg: rgba(255, 255, 255, 0.9);
|
||||
--surface-bg-strong: rgba(255, 255, 255, 0.98);
|
||||
--surface-border: rgba(161, 161, 170, 0.45);
|
||||
--surface-divider: rgba(212, 212, 216, 0.9);
|
||||
--text-primary: #52485c;
|
||||
--text-secondary: #514e60;
|
||||
--text-muted: #52525b;
|
||||
--text-soft: #71717a;
|
||||
--field-bg: rgba(253, 253, 253, 0.8);
|
||||
--field-border: #d4d4d8;
|
||||
--field-disabled-bg: rgba(248, 248, 248, 0.8);
|
||||
--field-disabled-border: #d7d7d7;
|
||||
--field-disabled-text: #71717a;
|
||||
--field-disabled-placeholder: #a1a1aa;
|
||||
--ghost-bg: rgba(255, 255, 255, 0.88);
|
||||
--ghost-border: #d4d4d8;
|
||||
--ghost-hover: #f4f4f5;
|
||||
--ghost-disabled-bg: #f4f4f5;
|
||||
--ghost-disabled-border: #e4e4e7;
|
||||
--ghost-disabled-text: #a1a1aa;
|
||||
--primary-disabled-bg: #e4e4e7;
|
||||
--primary-disabled-text: #a1a1aa;
|
||||
--table-head-bg: #f4f4f5;
|
||||
--table-row-divider: #e4e4e7;
|
||||
--auth-chrome-bg: rgba(255, 255, 255, 0.7);
|
||||
--auth-glass-blur: 15px;
|
||||
--error-border: rgba(248, 113, 113, 0.35);
|
||||
--error-bg: rgba(254, 226, 226, 0.8);
|
||||
--error-text: #991b1b;
|
||||
--mdx-link: #7d6f98;
|
||||
--mdx-link-hover: #6a5d84;
|
||||
--mdx-inline-code-bg: #f4f4f5;
|
||||
--mdx-inline-code-border: #d4d4d8;
|
||||
--mdx-codeblock-bg: #ffffff;
|
||||
--mdx-codeblock-border: #d4d4d8;
|
||||
--mdx-codeblock-text: #18181b;
|
||||
--mdx-codeblock-gutter: #71717a;
|
||||
--mdx-codeblock-active: #f4f4f5;
|
||||
--mdx-codeblock-selection: rgba(125, 111, 152, 0.22);
|
||||
--mdx-codeblock-bracket: rgba(125, 111, 152, 0.32);
|
||||
--shadow-glow: 0 0 0 1px rgba(212, 212, 216, 0.9), 0 18px 36px rgba(15, 23, 42, 0.08);
|
||||
--bg-page: #f7f7fb;
|
||||
--surface-bg: rgba(255, 255, 255, 0.9);
|
||||
--surface-bg-strong: rgba(255, 255, 255, 0.98);
|
||||
--surface-border: rgba(161, 161, 170, 0.45);
|
||||
--surface-divider: rgba(212, 212, 216, 0.9);
|
||||
--text-primary: #52485c;
|
||||
--text-secondary: #514e60;
|
||||
--text-muted: #52525b;
|
||||
--text-soft: #71717a;
|
||||
--field-bg: rgba(253, 253, 253, 0.8);
|
||||
--field-border: #d4d4d8;
|
||||
--field-disabled-bg: rgba(248, 248, 248, 0.8);
|
||||
--field-disabled-border: #d7d7d7;
|
||||
--field-disabled-text: #71717a;
|
||||
--field-disabled-placeholder: #a1a1aa;
|
||||
--ghost-bg: rgba(255, 255, 255, 0.88);
|
||||
--ghost-border: #d4d4d8;
|
||||
--ghost-hover: #f4f4f5;
|
||||
--ghost-disabled-bg: #f4f4f5;
|
||||
--ghost-disabled-border: #e4e4e7;
|
||||
--ghost-disabled-text: #a1a1aa;
|
||||
--primary-disabled-bg: #e4e4e7;
|
||||
--primary-disabled-text: #a1a1aa;
|
||||
--table-head-bg: #f4f4f5;
|
||||
--table-row-divider: #e4e4e7;
|
||||
--auth-chrome-bg: rgba(255, 255, 255, 0.7);
|
||||
--auth-glass-blur: 15px;
|
||||
--error-border: rgba(248, 113, 113, 0.35);
|
||||
--error-bg: rgba(254, 226, 226, 0.8);
|
||||
--error-text: #991b1b;
|
||||
--mdx-link: #7d6f98;
|
||||
--mdx-link-hover: #6a5d84;
|
||||
--mdx-inline-code-bg: #f4f4f5;
|
||||
--mdx-inline-code-border: #d4d4d8;
|
||||
--mdx-codeblock-bg: #ffffff;
|
||||
--mdx-codeblock-border: #d4d4d8;
|
||||
--mdx-codeblock-text: #18181b;
|
||||
--mdx-codeblock-gutter: #71717a;
|
||||
--mdx-codeblock-active: #f4f4f5;
|
||||
--mdx-codeblock-selection: rgba(125, 111, 152, 0.22);
|
||||
--mdx-codeblock-bracket: rgba(125, 111, 152, 0.32);
|
||||
--shadow-glow: 0 0 0 1px rgba(212, 212, 216, 0.9), 0 18px 36px rgba(15, 23, 42, 0.08);
|
||||
}
|
||||
|
||||
@@ -1,289 +1,289 @@
|
||||
.surface {
|
||||
border: 1px solid var(--surface-border);
|
||||
background-color: var(--surface-bg);
|
||||
box-shadow: var(--shadow-glow);
|
||||
@apply rounded-2xl backdrop-blur-xl;
|
||||
border: 1px solid var(--surface-border);
|
||||
background-color: var(--surface-bg);
|
||||
box-shadow: var(--shadow-glow);
|
||||
@apply rounded-2xl backdrop-blur-xl;
|
||||
}
|
||||
|
||||
.field {
|
||||
border: 1px solid var(--field-border);
|
||||
background-color: var(--field-bg);
|
||||
color: var(--text-primary);
|
||||
@apply w-full rounded-xl px-3 py-2 text-sm outline-none transition focus:border-accent-400 focus:ring-2 focus:ring-accent-400/30;
|
||||
border: 1px solid var(--field-border);
|
||||
background-color: var(--field-bg);
|
||||
color: var(--text-primary);
|
||||
@apply w-full rounded-xl px-3 py-2 text-sm outline-none transition focus:border-accent-400 focus:ring-2 focus:ring-accent-400/30;
|
||||
}
|
||||
|
||||
.field::placeholder {
|
||||
color: var(--text-soft);
|
||||
color: var(--text-soft);
|
||||
}
|
||||
|
||||
.field:disabled {
|
||||
border-color: var(--field-disabled-border);
|
||||
background-color: var(--field-disabled-bg);
|
||||
color: var(--field-disabled-text);
|
||||
border-color: var(--field-disabled-border);
|
||||
background-color: var(--field-disabled-bg);
|
||||
color: var(--field-disabled-text);
|
||||
}
|
||||
|
||||
.field:disabled::placeholder {
|
||||
color: var(--field-disabled-placeholder);
|
||||
color: var(--field-disabled-placeholder);
|
||||
}
|
||||
|
||||
.btn-solid,
|
||||
.btn-outlined,
|
||||
.btn-noborder {
|
||||
@apply inline-flex items-center justify-center rounded-xl px-4 py-2 text-sm font-semibold transition;
|
||||
@apply inline-flex items-center justify-center rounded-xl px-4 py-2 text-sm font-semibold transition;
|
||||
}
|
||||
|
||||
.btn-solid {
|
||||
border: 1px solid transparent;
|
||||
border: 1px solid transparent;
|
||||
}
|
||||
|
||||
.btn-outlined {
|
||||
border: 1px solid var(--ghost-border);
|
||||
border: 1px solid var(--ghost-border);
|
||||
}
|
||||
|
||||
.btn-noborder {
|
||||
border: 1px solid transparent;
|
||||
border: 1px solid transparent;
|
||||
}
|
||||
|
||||
.btn-solid.btn-primary {
|
||||
@apply bg-accent-500 text-white hover:bg-accent-400 disabled:opacity-100;
|
||||
@apply bg-accent-500 text-white hover:bg-accent-400 disabled:opacity-100;
|
||||
}
|
||||
|
||||
.btn-solid.btn-primary:disabled {
|
||||
background-color: var(--primary-disabled-bg);
|
||||
color: var(--primary-disabled-text);
|
||||
background-color: var(--primary-disabled-bg);
|
||||
color: var(--primary-disabled-text);
|
||||
}
|
||||
|
||||
.btn-solid.btn-secondary {
|
||||
border-color: var(--ghost-border);
|
||||
background-color: var(--ghost-border);
|
||||
color: var(--text-primary);
|
||||
border-color: var(--ghost-border);
|
||||
background-color: var(--ghost-border);
|
||||
color: var(--text-primary);
|
||||
}
|
||||
|
||||
.btn-solid.btn-secondary:hover {
|
||||
background-color: var(--ghost-hover);
|
||||
background-color: var(--ghost-hover);
|
||||
}
|
||||
|
||||
.btn-solid.btn-secondary:disabled {
|
||||
border-color: var(--ghost-disabled-border);
|
||||
background-color: var(--ghost-disabled-bg);
|
||||
color: var(--ghost-disabled-text);
|
||||
border-color: var(--ghost-disabled-border);
|
||||
background-color: var(--ghost-disabled-bg);
|
||||
color: var(--ghost-disabled-text);
|
||||
}
|
||||
|
||||
.btn-solid.btn-important {
|
||||
border-color: #dc2626;
|
||||
@apply bg-red-600 text-white hover:bg-red-500 disabled:opacity-100;
|
||||
border-color: #dc2626;
|
||||
@apply bg-red-600 text-white hover:bg-red-500 disabled:opacity-100;
|
||||
}
|
||||
|
||||
.btn-solid.btn-important:disabled {
|
||||
border-color: #7f1d1d;
|
||||
background-color: #7f1d1d;
|
||||
color: #fecaca;
|
||||
border-color: #7f1d1d;
|
||||
background-color: #7f1d1d;
|
||||
color: #fecaca;
|
||||
}
|
||||
|
||||
.btn-outlined.btn-secondary {
|
||||
border-color: var(--ghost-border);
|
||||
background-color: var(--ghost-bg);
|
||||
color: var(--text-secondary);
|
||||
border-color: var(--ghost-border);
|
||||
background-color: var(--ghost-bg);
|
||||
color: var(--text-secondary);
|
||||
}
|
||||
|
||||
.btn-outlined.btn-secondary:hover {
|
||||
background-color: var(--ghost-hover);
|
||||
background-color: var(--ghost-hover);
|
||||
}
|
||||
|
||||
.btn-outlined.btn-secondary:disabled {
|
||||
border-color: var(--ghost-disabled-border);
|
||||
background-color: var(--ghost-disabled-bg);
|
||||
color: var(--ghost-disabled-text);
|
||||
border-color: var(--ghost-disabled-border);
|
||||
background-color: var(--ghost-disabled-bg);
|
||||
color: var(--ghost-disabled-text);
|
||||
}
|
||||
|
||||
.btn-outlined.btn-primary {
|
||||
@apply border-accent-500 text-accent-300;
|
||||
background-color: transparent;
|
||||
@apply border-accent-500 text-accent-300;
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.btn-outlined.btn-primary:hover {
|
||||
@apply bg-accent-500/15 text-accent-300;
|
||||
@apply bg-accent-500/15 text-accent-300;
|
||||
}
|
||||
|
||||
.btn-outlined.btn-primary:disabled {
|
||||
@apply border-accent-500/40 text-accent-300/60;
|
||||
background-color: transparent;
|
||||
@apply border-accent-500/40 text-accent-300/60;
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.btn-outlined.btn-important {
|
||||
@apply border-red-500 text-red-400;
|
||||
background-color: transparent;
|
||||
@apply border-red-500 text-red-400;
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.btn-outlined.btn-important:hover {
|
||||
@apply bg-red-500/10 text-red-300;
|
||||
@apply bg-red-500/10 text-red-300;
|
||||
}
|
||||
|
||||
.btn-outlined.btn-important:disabled {
|
||||
@apply border-red-900 text-red-900;
|
||||
background-color: transparent;
|
||||
@apply border-red-900 text-red-900;
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.btn-noborder.btn-secondary {
|
||||
background-color: transparent;
|
||||
color: var(--text-secondary);
|
||||
background-color: transparent;
|
||||
color: var(--text-secondary);
|
||||
}
|
||||
|
||||
.btn-noborder.btn-secondary:hover {
|
||||
background-color: var(--ghost-hover);
|
||||
background-color: var(--ghost-hover);
|
||||
}
|
||||
|
||||
.btn-noborder.btn-secondary:disabled {
|
||||
background-color: transparent;
|
||||
color: var(--ghost-disabled-text);
|
||||
background-color: transparent;
|
||||
color: var(--ghost-disabled-text);
|
||||
}
|
||||
|
||||
.btn-noborder.btn-primary {
|
||||
@apply text-accent-300;
|
||||
background-color: transparent;
|
||||
@apply text-accent-300;
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.btn-noborder.btn-primary:hover {
|
||||
@apply bg-accent-500/15 text-accent-300;
|
||||
@apply bg-accent-500/15 text-accent-300;
|
||||
}
|
||||
|
||||
.btn-noborder.btn-primary:disabled {
|
||||
@apply text-accent-300/60;
|
||||
background-color: transparent;
|
||||
@apply text-accent-300/60;
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.btn-noborder.btn-important {
|
||||
@apply text-red-400;
|
||||
background-color: transparent;
|
||||
@apply text-red-400;
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.btn-noborder.btn-important:hover {
|
||||
@apply bg-red-500/10 text-red-300;
|
||||
@apply bg-red-500/10 text-red-300;
|
||||
}
|
||||
|
||||
.btn-noborder.btn-important:disabled {
|
||||
@apply text-red-900;
|
||||
background-color: transparent;
|
||||
@apply text-red-900;
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.ui-kicker {
|
||||
color: var(--text-muted);
|
||||
color: var(--text-muted);
|
||||
}
|
||||
|
||||
.ui-title {
|
||||
color: var(--text-primary);
|
||||
color: var(--text-primary);
|
||||
}
|
||||
|
||||
.ui-body-secondary {
|
||||
color: var(--text-muted);
|
||||
color: var(--text-muted);
|
||||
}
|
||||
|
||||
.ui-code {
|
||||
border: 1px solid var(--surface-divider);
|
||||
background-color: var(--ghost-bg);
|
||||
color: var(--text-primary);
|
||||
@apply rounded-md px-1.5 py-0.5;
|
||||
border: 1px solid var(--surface-divider);
|
||||
background-color: var(--ghost-bg);
|
||||
color: var(--text-primary);
|
||||
@apply rounded-md px-1.5 py-0.5;
|
||||
}
|
||||
|
||||
.ui-body-primary {
|
||||
color: var(--text-secondary);
|
||||
color: var(--text-secondary);
|
||||
}
|
||||
|
||||
.ui-loading {
|
||||
color: var(--text-muted);
|
||||
color: var(--text-muted);
|
||||
}
|
||||
|
||||
.ui-empty {
|
||||
color: var(--text-soft);
|
||||
color: var(--text-soft);
|
||||
}
|
||||
|
||||
.ui-link {
|
||||
color: var(--text-secondary);
|
||||
@apply font-semibold transition;
|
||||
color: var(--text-secondary);
|
||||
@apply font-semibold transition;
|
||||
}
|
||||
|
||||
.ui-link:hover {
|
||||
color: var(--text-primary);
|
||||
color: var(--text-primary);
|
||||
}
|
||||
|
||||
.ui-label {
|
||||
color: var(--text-secondary);
|
||||
color: var(--text-secondary);
|
||||
}
|
||||
|
||||
.ui-label-disabled {
|
||||
color: var(--text-soft);
|
||||
color: var(--text-soft);
|
||||
}
|
||||
|
||||
.ui-error {
|
||||
color: var(--error-text);
|
||||
color: var(--error-text);
|
||||
}
|
||||
|
||||
.chip-root {
|
||||
@apply inline-flex items-center rounded-full border px-2.5 py-1 text-xs font-semibold leading-none;
|
||||
@apply inline-flex items-center rounded-full border px-2.5 py-1 text-xs font-semibold leading-none;
|
||||
}
|
||||
|
||||
.chip-solid {
|
||||
border-color: var(--ghost-border);
|
||||
background-color: var(--ghost-border);
|
||||
color: var(--text-primary);
|
||||
border-color: var(--ghost-border);
|
||||
background-color: var(--ghost-border);
|
||||
color: var(--text-primary);
|
||||
}
|
||||
|
||||
.chip-outlined {
|
||||
background-color: transparent;
|
||||
border-color: var(--ghost-border);
|
||||
color: var(--text-secondary);
|
||||
background-color: transparent;
|
||||
border-color: var(--ghost-border);
|
||||
color: var(--text-secondary);
|
||||
}
|
||||
|
||||
.alert-error {
|
||||
border: 1px solid var(--error-border);
|
||||
background-color: var(--error-bg);
|
||||
color: var(--error-text);
|
||||
@apply rounded-lg px-3 py-2 text-sm;
|
||||
border: 1px solid var(--error-border);
|
||||
background-color: var(--error-bg);
|
||||
color: var(--error-text);
|
||||
@apply rounded-lg px-3 py-2 text-sm;
|
||||
}
|
||||
|
||||
.table-shell {
|
||||
border: 1px solid var(--surface-divider);
|
||||
background-color: var(--surface-bg-strong);
|
||||
@apply overflow-hidden rounded-xl;
|
||||
border: 1px solid var(--surface-divider);
|
||||
background-color: var(--surface-bg-strong);
|
||||
@apply overflow-hidden rounded-xl;
|
||||
}
|
||||
|
||||
.table-scroll {
|
||||
@apply overflow-x-auto;
|
||||
@apply overflow-x-auto;
|
||||
}
|
||||
|
||||
.table-root {
|
||||
@apply min-w-full;
|
||||
@apply min-w-full;
|
||||
}
|
||||
|
||||
.table-head {
|
||||
background-color: var(--table-head-bg);
|
||||
border-bottom: 1px solid var(--surface-divider);
|
||||
background-color: var(--table-head-bg);
|
||||
border-bottom: 1px solid var(--surface-divider);
|
||||
}
|
||||
|
||||
.table-head-cell {
|
||||
color: var(--text-primary);
|
||||
@apply px-4 py-3 text-left text-sm font-semibold tracking-wider;
|
||||
color: var(--text-primary);
|
||||
@apply px-4 py-3 text-left text-sm font-semibold tracking-wider;
|
||||
}
|
||||
|
||||
.table-sort-button {
|
||||
@apply inline-flex items-center gap-1.5 text-left;
|
||||
@apply inline-flex items-center gap-1.5 text-left;
|
||||
}
|
||||
|
||||
.table-sort-icon {
|
||||
color: var(--text-muted);
|
||||
@apply inline-flex items-center;
|
||||
color: var(--text-muted);
|
||||
@apply inline-flex items-center;
|
||||
}
|
||||
|
||||
.table-body-row {
|
||||
border-top: 1px solid var(--table-row-divider);
|
||||
border-top: 1px solid var(--table-row-divider);
|
||||
}
|
||||
|
||||
.table-cell-primary {
|
||||
color: var(--text-primary);
|
||||
@apply px-4 py-3 text-sm;
|
||||
color: var(--text-primary);
|
||||
@apply px-4 py-3 text-sm;
|
||||
}
|
||||
|
||||
.table-cell-secondary {
|
||||
color: var(--text-secondary);
|
||||
@apply px-4 py-3 text-sm;
|
||||
color: var(--text-secondary);
|
||||
@apply px-4 py-3 text-sm;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user