2024-11-12 22:08:41 +01:00

126 lines
2.7 KiB
CSS

:root {
/* Default theme values will be overridden by theme store */
--base: #1e1e2e;
--mantle: #181825;
--crust: #11111b;
--text: #cdd6f4;
--subtext0: #a6adc8;
--subtext1: #bac2de;
--surface0: #313244;
--surface1: #45475a;
--surface2: #585b70;
--overlay0: #6c7086;
--overlay1: #7f849c;
--blue: #89b4fa;
--lavender: #b4befe;
--sapphire: #74c7ec;
--sky: #89dceb;
--red: #f38ba8;
--maroon: #eba0ac;
--peach: #fab387;
--yellow: #f9e2af;
--green: #a6e3a1;
--teal: #94e2d5;
}
body {
margin: 0;
padding: 0;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial,
sans-serif, "Apple Color Emoji", "Segoe UI Emoji";
background-color: var(--base);
color: var(--text);
-webkit-font-smoothing: antialiased;
overflow: hidden;
user-select: none;
}
/* Global scrollbar styles */
* {
scrollbar-width: thin;
scrollbar-color: var(--surface2) var(--mantle);
}
::-webkit-scrollbar {
width: 8px;
height: 8px;
}
::-webkit-scrollbar-track {
background: var(--mantle);
border-radius: 4px;
}
::-webkit-scrollbar-thumb {
background: var(--surface2);
border-radius: 4px;
transition: background 0.2s ease;
}
::-webkit-scrollbar-thumb:hover {
background: var(--surface1);
}
::-webkit-scrollbar-corner {
background: var(--mantle);
}
/* Glassy theme */
[data-theme="glassy"] body {
background: transparent !important;
}
[data-theme="glassy"] .toolbar {
position: relative;
background: rgba(24, 24, 37, 0.5) !important;
border: 1px solid rgba(255, 255, 255, 0.1) !important;
z-index: 9;
}
[data-theme="glassy"] .stat-panel {
background: rgba(24, 24, 37, 0.2) !important;
z-index: 100;
}
[data-theme="glassy"] .panel-header {
border-color: rgba(255, 255, 255, 0.1) !important;
}
[data-theme="glassy"] .col-actions {
background: rgba(24, 24, 37, 0.2) !important;
border-bottom: 1px solid rgba(232, 232, 232, 0.1) !important;
border-left: 1px solid rgba(232, 232, 232, 0.1) !important;
}
[data-theme="glassy"] .search-input,
[data-theme="glassy"] .btn-toggle,
[data-theme="glassy"] .btn-action,
[data-theme="glassy"] .info-button,
[data-theme="glassy"] .btn-page,
[data-theme="glassy"] .theme-button,
[data-theme="glassy"] .usage-pill,
[data-theme="glassy"] .bar-container,
[data-theme="glassy"] .select-input {
background: rgba(24, 24, 37, 0.2) !important;
z-index: 100;
}
[data-theme="glassy"] .btn-clear {
z-index: 100;
}
[data-theme="glassy"] tr.pinned,
[data-theme="glassy"] tr:hover {
background: rgba(24, 24, 37, 0.3) !important;
}
[data-theme="glassy"] th {
background: rgba(24, 24, 37, 0.5) !important;
}
[data-theme="glassy"] td {
border-bottom: 1px solid rgba(232, 232, 232, 0.1) !important;
background: rgba(24, 24, 37, 0.2) !important;
}