mirror of
https://github.com/euzu/tuliprox.git
synced 2026-10-10 09:52:18 +02:00
678 lines
22 KiB
SCSS
678 lines
22 KiB
SCSS
@use './size';
|
|
|
|
:root {
|
|
--mobile-size: size.$mobile-breakpoint;
|
|
--dashboard-mobile-size: size.$dashboard-mobile-breakpoint;
|
|
--sidebar-width-expaned: 270px;
|
|
--sidebar-width-collapsed: 42px;
|
|
--max-view-width: size.$dashboard-mobile-breakpoint;
|
|
--max-table-cell-width: 240px;
|
|
--max-dialog-card-height: 300px;
|
|
--media-size-mobile: 600px;
|
|
--app-header-height: 56px;
|
|
--scrollbar-width: 8px;
|
|
--scrollbar-border-radius: 4px;
|
|
--action-card-width: 380px;
|
|
|
|
--gap-mini: 0.3rem;
|
|
--gap-small: 0.3rem;
|
|
--gap-default: 0.5rem;
|
|
--gap-large: 1rem;
|
|
--gap-larger: 1.5rem;
|
|
|
|
--padding-micro: 0.2rem;
|
|
--padding-mini: 0.5rem;
|
|
--padding-small: 0.75rem;
|
|
--padding-default: 1rem;
|
|
--padding-large: 1.5rem;
|
|
--padding-larger: 2rem;
|
|
|
|
--margin-micro: 0.2rem;
|
|
--margin-mini: 0.5rem;
|
|
--margin-small: 0.75rem;
|
|
--margin-default: 1rem;
|
|
|
|
--epg-row-height: 4rem;
|
|
--epg-header-height: 2rem;
|
|
--epg-channels-width: 300px;
|
|
|
|
--epg-past-background: rgba(0, 0, 0, 0.1);
|
|
--epg-now-line-color: red;
|
|
|
|
}
|
|
|
|
@media (max-width: size.$mobile-breakpoint) {
|
|
:root {
|
|
--gap-small: 0.2rem;
|
|
--gap-default: 0.3rem;
|
|
--gap-large: 0.5rem;
|
|
--gap-larger: 0.75rem;
|
|
|
|
--padding-micro: 0.2rem;
|
|
--padding-mini: 0.3rem;
|
|
--padding-small: 0.5rem;
|
|
--padding-default: 0.75rem;
|
|
--padding-large: 1rem;
|
|
--padding-larger: 1.25rem;
|
|
|
|
--margin-micro: 0.2rem;
|
|
--margin-mini: 0.3rem;
|
|
--margin-small: 0.5rem;
|
|
--margin-default: 0.75rem;
|
|
|
|
--epg-row-height: 3rem;
|
|
--epg-header-height: 1.5rem;
|
|
--epg-channels-width: 160px;
|
|
}
|
|
}
|
|
|
|
:root {
|
|
--primary-color: rgba(96, 165, 250, 0.72);
|
|
/* Icy Blue */
|
|
--secondary-color: rgba(251, 113, 133, 0.62);
|
|
/* Soft Coral Red */
|
|
|
|
--action-item-background-color: rgba(37, 99, 235, 0.18);
|
|
--action-item-color: #ffffff;
|
|
|
|
--text-color: #e6edf7;
|
|
--modest-text-color: #9aa9bf;
|
|
--background-color: #0b1220;
|
|
--particle-flow-background-color: #070f1d;
|
|
--particle-flow-background-accent-color-1: #6ea8ff;
|
|
--particle-flow-background-accent-color-2: #273240;
|
|
--particle-flow-background-alpha-boost: 1.0;
|
|
--border-color: rgba(96, 165, 250, 0.24);
|
|
--input-background-color: rgba(15, 23, 42, 0.0);
|
|
--input-border-color: var(--border-color);
|
|
--input-focus-border-color: rgba(96, 165, 250, 0.88);
|
|
--button-background-color: var(--primary-color);
|
|
--menu-text-color: #d8e1ef;
|
|
--menu-icon-color: #8ea2bf;
|
|
--menu-item-hover-background-color: rgba(59, 130, 246, 0.16);
|
|
--menu-item-hover-color: #ffffff;
|
|
--menu-text-active-color: var(--primary-color);
|
|
--menu-item-active-background-color: rgba(59, 130, 246, 0.24);
|
|
--icon-button-hover-color: #e6edf7;
|
|
--card-background-color: rgba(15, 23, 42, 0.78);
|
|
--card-color: var(--modest-text-color);
|
|
--sub-card-background-color: rgba(15, 23, 42, 0.62);
|
|
|
|
|
|
--text-button-background-color: rgba(30, 64, 175, 0.28);
|
|
--text-button-color: #ffffff;
|
|
--text-button-border-color: rgba(96, 165, 250, 0.28);
|
|
--text-button-hover-color: #ffffff;
|
|
--text-button-hover-background-color: rgba(37, 99, 235, 0.42);
|
|
--text-button-primary-background-color: var(--primary-color);
|
|
--text-button-primary-color: #ffffff;
|
|
--text-button-primary-hover-background-color: rgba(59, 130, 246, 0.9);
|
|
--text-button-primary-hover-color: #ffffff;
|
|
--text-button-primary-border-color: rgba(80, 150, 255, 0.8);
|
|
--text-button-secondary-background-color: rgba(220, 70, 70, 0.25);
|
|
--text-button-secondary-color: #ffffff;
|
|
--text-button-secondary-hover-background-color: rgba(220, 70, 70, 0.55);
|
|
--text-button-secondary-hover-color: #ffffff;
|
|
--text-button-secondary-border-color: rgba(220, 70, 70, 0.5);
|
|
|
|
--text-button-active-background-color: rgba(34, 197, 94, 0.58);
|
|
--text-button-active-color: #fdfdfd;
|
|
--text-button-active-hover-background-color: rgba(22, 163, 74, 0.72);
|
|
--text-button-active-hover-color: #ffffff;
|
|
--text-button-active-border-color: rgba(74, 222, 128, 0.82);
|
|
|
|
--text-button-disabled-border-color: #717171;
|
|
--text-button-disabled-background-color: #494949;
|
|
--text-button-disabled-color: #9b9b9b;
|
|
|
|
--toggle-switch-on-background-color: rgba(34, 197, 94, 0.72);
|
|
--toggle-switch-off-background-color: rgba(51, 65, 85, 0.9);
|
|
--toggle-switch-toggle-color: #ffffff;
|
|
|
|
--table-header-background-color: #1E293B;
|
|
--table-card-background-color: rgba(15, 23, 42, 0.56);
|
|
--table-alternate-background-color: rgba(30, 41, 59, 0.42);
|
|
--stream-tech-chip-container-color: #74c0fc;
|
|
--stream-tech-chip-container-background-color: #263645;
|
|
--stream-tech-chip-container-border-color: transparent;
|
|
--stream-tech-chip-video-codec-color: #83da91;
|
|
--stream-tech-chip-video-codec-background-color: #2b3e30;
|
|
--stream-tech-chip-video-codec-border-color: transparent;
|
|
--stream-tech-chip-resolution-color: #e09393;
|
|
--stream-tech-chip-resolution-background-color: #462d2f;
|
|
--stream-tech-chip-resolution-border-color: transparent;
|
|
--stream-tech-chip-fps-color: #ffc078;
|
|
--stream-tech-chip-fps-background-color: #473426;
|
|
--stream-tech-chip-fps-border-color: transparent;
|
|
--stream-tech-chip-audio-codec-color: #faa2c1;
|
|
--stream-tech-chip-audio-codec-background-color: #432c36;
|
|
--stream-tech-chip-audio-codec-border-color: transparent;
|
|
--stream-tech-chip-audio-channels-color: #ea97b5;
|
|
--stream-tech-chip-audio-channels-background-color: #432c36;
|
|
--stream-tech-chip-audio-channels-border-color: transparent;
|
|
|
|
--discord-color: #5865f2;
|
|
--documentation-color: #2bbf5a;
|
|
--github-color: #ffffff;
|
|
|
|
--app-header-background-color: rgba(7, 12, 24, 0.82);
|
|
--app-header-color: #93c5fd;
|
|
|
|
--pulse-color-1: #64748b;
|
|
--pulse-color-2: #334155;
|
|
|
|
--tag-padding: 0.3rem 0.5rem;
|
|
--tag-border-radius: 0.5rem;
|
|
--tag-border-color: #3a3a3a;
|
|
--tag-color: #e0e0e0;
|
|
--tag-background-color: #2b2e3688;
|
|
|
|
--tag-active-color: #49dc7f;
|
|
--tag-active-background-color: #1e2d2588;
|
|
--tag-active-border-color: #2b6140;
|
|
|
|
--tag-inactive-color: #6f6f6f;
|
|
--tag-inactive-background-color: #3a3a3a88;
|
|
--tag-inactive-border-color: #555;
|
|
|
|
--tag-alt-active-color: #d070e7;
|
|
--tag-alt-active-background-color: #311a3888;
|
|
--tag-alt-active-border-color: #5d2f69;
|
|
|
|
--tag-status-expired-color: #efda8f;
|
|
--tag-status-expired-background-color: #39332088;
|
|
--tag-status-expired-border-color: #b69e5c;
|
|
|
|
--tag-status-banned-color: #dd7573;
|
|
--tag-status-banned-background-color: #4c343488;
|
|
--tag-status-banned-border-color: #755252;
|
|
|
|
--tag-status-trial-color: #49dcdc;
|
|
--tag-status-trial-background-color: #1e252d88;
|
|
--tag-status-trial-border-color: #2b4c61;
|
|
|
|
--tag-status-pending-color: #49dcdc;
|
|
--tag-status-pending-background-color: #1e252d88;
|
|
--tag-status-pending-border-color: #2b4c61;
|
|
|
|
--popup-background-color: rgba(15, 23, 42, 0.78);
|
|
--popup-shadow: 0 8px 24px rgba(0, 0, 0, 0.4),
|
|
inset 0 0 10px rgba(255, 255, 255, 0.08);
|
|
|
|
--popup-border-color: rgba(96, 165, 250, 0.26);
|
|
--popup-color: #e6edf7;
|
|
|
|
--tooltip-background-color: rgba(15, 23, 42, 0.94);
|
|
--tooltip-color: #e6edf7;
|
|
|
|
--attention-color: #f57170;
|
|
--warn-color: #e1b842;
|
|
--active-color: #3ae093;
|
|
|
|
--output-xtream-color: #06b6d4;
|
|
--output-m3u-color: #10b981;
|
|
--output-hdhomerun-color: #6366f1;
|
|
--output-strm-color: #f43f5e;
|
|
|
|
--tag-live-background-color: #075b4188;
|
|
--tag-live-border-color: #10b981;
|
|
--tag-video-background-color: #035b6e88;
|
|
--tag-video-border-color: #06b6d4;
|
|
--tag-series-background-color: #3c3f9f88;
|
|
--tag-series-border-color: #6366f1;
|
|
|
|
--toastr-success-color: #ffffff;
|
|
--toastr-success-background-color: #22c55e66;
|
|
--toastr-error-color: #ffffff;
|
|
--toastr-error-background-color: #ef444466;
|
|
--toastr-info-color: #ffffff;
|
|
--toastr-info-background-color: #3b82f666;
|
|
--toastr-warning-color: #ffffff;
|
|
--toastr-warning-background-color: #f59e0b66;
|
|
|
|
--hint-color: #7f8ea5;
|
|
--label-color: #8ec5ff;
|
|
|
|
--playlist-color: #aeb0b2;
|
|
--playlist-rating-color: #ffffff;
|
|
--playlist-rating-background-color: #121621;
|
|
|
|
--sidebar-toggle-color: #ffffff;
|
|
--sidebar-toggle-hover-color: #8ea2bf;
|
|
--hover-border-color: rgba(96, 165, 250, 0.46);
|
|
--spinner-color: rgba(255, 255, 255, 0.4);
|
|
--spinner-highlight-color: #60a5fa;
|
|
|
|
--tree-count-color: #7f8ea5;
|
|
--tree-hover-background-color: #2563eb66;
|
|
--tree-hover-color: white;
|
|
--tree-expander-hover-color: white;
|
|
--tool-button-background-color: #33415588;
|
|
--tool-button-color: #fff;
|
|
--tool-button-hover-color: #ffffff;
|
|
--tool-button-hover-background-color: #2563eb88;
|
|
|
|
--toolbar-background-color: #1e293b88;
|
|
--toolbar-button-hover-color: #ffffff;
|
|
--toolbar-button-hover-background-color: #2563eb88;
|
|
|
|
--ok-color: #22c55e;
|
|
|
|
--card-background-color-darker: rgba(22, 26, 36, 0.55);
|
|
--card-border-color: rgba(80, 130, 255, 0.2);
|
|
|
|
--title-label-color: #6495b1;
|
|
|
|
--border-radius: 8px;
|
|
|
|
--icon-button-border-radius: 4px;
|
|
--icon-button-background-color: var(--button-background-color);
|
|
--icon-button-color: #ffffff;
|
|
--icon-button-hover-background-color: #2563eb88;
|
|
|
|
--icon-button-hover-border-color: #93c5fd;
|
|
|
|
--menu-button-color: #d8e1ef;
|
|
--menu-button-background-color: rgba(30, 41, 59, 0.45);
|
|
|
|
--menu-button-hover-color: #93c5fd;
|
|
--menu-button-hover-background-color: rgba(37, 99, 235, 0.3);
|
|
|
|
--menu-button-warn-color: #b96665;
|
|
--menu-button-warn-hover-color: #dd7573;
|
|
--menu-button-warn-hover-background-color: #4c3434;
|
|
|
|
--scrollbar-track-color: #334155;
|
|
--scrollbar-handle-color: #64748b;
|
|
|
|
--tabset-background-color: rgba(68, 71, 90, 0.3);
|
|
--tabset-border-color: #535353;
|
|
--tab-background-color: #44475A88;
|
|
--tab-hover-background-color: #2f6db788;
|
|
--tab-hover-color: #fdfdfd;
|
|
--tab-active-background-color: #1f4f8f88;
|
|
--tab-active-color: #fdfdfd;
|
|
--tab-active-border-color: #4f8ffb;
|
|
|
|
--table-border-color: #44475a;
|
|
|
|
--checkbox-background-color: #44475A88;
|
|
--checkbox-hover-background-color: #006fee88;
|
|
--checkbox-checked-background-color: #006fee88;
|
|
--checkbox-border-radius: 4px;
|
|
|
|
--option-active-background-color: #50FA7B88;
|
|
--option-active-color: #000;
|
|
|
|
--shocase-card-background: #4b4b4b;
|
|
|
|
--breadcrumbs-background-color: #20273388;
|
|
--breadcrumb-background-color: #4e545d88;
|
|
--breadcrumb-color: #c4c4c4;
|
|
--breadcrumb-active-background-color: #4ad96e88;
|
|
--breadcrumb-active-color: #000;
|
|
|
|
--menu-icon-color-update: #A3D8FF;
|
|
--menu-icon-color-user: #0ABAB5;
|
|
--menu-icon-color-api_server: #FF9D23;
|
|
--menu-icon-color-main_config: #FF2DF1;
|
|
--menu-icon-color-status: #F9E400;
|
|
|
|
--code-identifier-color: #569cd6;
|
|
--code-var-access-color: #9cdcfe;
|
|
--code-field-color: #bb8953;
|
|
--code-property-color: #9a652f;
|
|
--code-literal-color: #65a181;
|
|
--code-num-literal-color: #6796ba;
|
|
--code-built-in-function-color: #fac46c;
|
|
--code-reserved-color: #e98863;
|
|
--code-regex-color: #bb8953;
|
|
--code-enum-color: #65a181;
|
|
--code-range-color: #6796ba;
|
|
--code-op-color: #569cd6;
|
|
--code-comparison-background-color: #20242988;
|
|
--code-comparison-color: #ffffff;
|
|
--code-bracket-1-color: #569CD6;
|
|
--code-bracket-2-color: #C586C0;
|
|
--code-bracket-3-color: #B5CEA8;
|
|
--code-editor-background-color: #1e1e1e88;
|
|
--code-editor-color: #d4d4d4;
|
|
--code-any-match-color: #fa5f2d;
|
|
--code-null-literal-color: #fa5f2d;
|
|
|
|
--toolbar-bg-color: #161b25;
|
|
|
|
--epg-program-background-color: #1a222b;
|
|
--epg-program-color: #ffffff;
|
|
--epg-program-active-background-color: #263140;
|
|
--epg-program-active-color: #ffffff;
|
|
--epg-program-time-color: #707f99;
|
|
--epg-program-active-time-color: #778295;
|
|
|
|
--glass-border-color: rgba(255, 255, 255, 0.15);
|
|
--glass-background-color: rgba(255, 255, 255, 0.1);
|
|
--glass-shadow-color: rgba(0, 0, 0, 0.1);
|
|
--glass-background-gradient-color-1: rgba(255, 255, 255, 0);
|
|
--glass-background-gradient-color-2: rgba(255, 255, 255, 0.1);
|
|
--glass-input-border-color: rgba(255, 255, 255, 0.15);
|
|
--glass-input-background-color: rgba(0, 0, 0, 0.15);
|
|
|
|
--graph-paper-line-color-1: #e0e0e030;
|
|
--graph-paper-line-color-2: #c0c0c030;
|
|
|
|
|
|
/* INPUT BLOCKS — cool blues (distinct per type) */
|
|
|
|
--brick-input-xtream-border-color: #1565c0cc;
|
|
--brick-input-xtream-background-color: #1565c088;
|
|
--brick-input-xtream-shadow-color: #1565c080;
|
|
|
|
--brick-input-m3u-border-color: #409affcc;
|
|
--brick-input-m3u-background-color: #409aff88;
|
|
--brick-input-m3u-shadow-color: #409aff80;
|
|
|
|
--brick-input-library-border-color: #64b5f6cc;
|
|
--brick-input-library-background-color: #64b5f688;
|
|
--brick-input-library-shadow-color: #64b5f680;
|
|
|
|
/* TARGET BLOCKS — balanced green/teal */
|
|
--brick-target-border-color: #2aa198cc;
|
|
/* Solarized teal */
|
|
--brick-target-background-color: #2aa19888;
|
|
--brick-target-shadow-color: #2aa19880;
|
|
|
|
/* GENERIC OUTPUT — warm amber */
|
|
--brick-output-border-color: #f39c12cc;
|
|
--brick-output-background-color: #f39c1288;
|
|
--brick-output-shadow-color: #f39c1280;
|
|
|
|
/* INDIVIDUAL OUTPUT TYPES — distinct but cohesive */
|
|
--brick-output-xtream-border-color: #0099ffcc;
|
|
/* vivid sky blue */
|
|
--brick-output-xtream-background-color: #0099ff88;
|
|
--brick-output-xtream-shadow-color: #0099ff80;
|
|
|
|
--brick-output-m3u-border-color: #8bc34acc;
|
|
/* light green */
|
|
--brick-output-m3u-background-color: #8bc34a88;
|
|
--brick-output-m3u-shadow-color: #8bc34a80;
|
|
|
|
--brick-output-hdhomerun-border-color: #9b59b6cc;
|
|
/* purple */
|
|
--brick-output-hdhomerun-background-color: #9b59b688;
|
|
--brick-output-hdhomerun-shadow-color: #9b59b680;
|
|
|
|
--brick-output-strm-border-color: #e74c3ccc;
|
|
/* strong red */
|
|
--brick-output-strm-background-color: #e74c3c88;
|
|
--brick-output-strm-shadow-color: #e74c3c80;
|
|
|
|
--brick-port-background-color: #587293;
|
|
--brick-port-border-color: #ffffff;
|
|
--brick-port-valid-background-color: #22c55e;
|
|
--brick-port-invalid-background-color: #e74c3c;
|
|
--source-editor-delete-color: #ef4444;
|
|
|
|
--source-editor-line-color: #ffffff;
|
|
--source-editor-active-line-color: #22c55e;
|
|
|
|
--source-editor-pending-line-color: #f59e0b;
|
|
--brick-port-hover-color: #f59e0b;
|
|
|
|
--selection-area-border-color: rgba(0, 120, 215, 0.9);
|
|
--selection-area-background-color: rgba(0, 120, 215, 0.12);
|
|
}
|
|
|
|
body[data-theme="bright"] {
|
|
|
|
--primary-color: #2f6fa8;
|
|
--secondary-color: #d46a6a;
|
|
--background-color: #e9eff4;
|
|
--particle-flow-background-color: #477fad;
|
|
--particle-flow-background-accent-color-1: #154679;
|
|
--particle-flow-background-accent-color-2: #9bb8cf;
|
|
--particle-flow-background-alpha-boost: 1.45;
|
|
|
|
--text-color: #1f2f3f;
|
|
--modest-text-color: #5a7084;
|
|
--border-color: #cfdbe6;
|
|
|
|
|
|
--card-color: #475569;
|
|
--card-background-color: #f7fbff;
|
|
--sub-card-background-color: #f1f6fb;
|
|
--card-background-color-darker: #eaf1f8;
|
|
--card-border-color: #cfdae6;
|
|
|
|
/* Shadows & Depth */
|
|
--popup-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.05), 0 8px 10px -6px rgba(0, 0, 0, 0.05);
|
|
--card-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05), 0 2px 4px -2px rgba(0, 0, 0, 0.05);
|
|
|
|
/* Menu & Navigation */
|
|
--menu-text-color: #30465b;
|
|
--menu-icon-color: #597286;
|
|
--menu-item-hover-background-color: rgba(47, 111, 168, 0.1);
|
|
--menu-item-hover-color: #2b5f8a;
|
|
--menu-item-active-background-color: rgba(47, 111, 168, 0.16);
|
|
--menu-text-active-color: #2f6fa8;
|
|
|
|
--sidebar-toggle-color: #475569;
|
|
--sidebar-toggle-hover-color: #3b82f6;
|
|
|
|
/* UI Components */
|
|
--action-item-background-color: rgba(37, 99, 235, 0.06);
|
|
--action-item-color: #0f172a;
|
|
|
|
--input-background-color: transparent;
|
|
--input-border-color: #cbd5e1;
|
|
--input-focus-border-color: #3b82f6;
|
|
|
|
--button-background-color: #2f6fa8;
|
|
--icon-button-background-color: #2f6fa8;
|
|
--icon-button-hover-background-color: #25597e;
|
|
--icon-button-hover-border-color: #8fb0cb;
|
|
--icon-button-color: #121525;
|
|
--icon-button-hover-color: #0046ff;
|
|
|
|
--text-button-background-color: #e6eef6;
|
|
--text-button-border-color: #c7d7e5;
|
|
--text-button-hover-background-color: #d8e5f1;
|
|
--text-button-color: #3c5368;
|
|
--text-button-hover-color: #2c4256;
|
|
--text-button-primary-background-color: #2f6fa8;
|
|
--text-button-primary-hover-background-color: #275f90;
|
|
--text-button-primary-color: #ffffff;
|
|
--text-button-primary-hover-color: #ffffff;
|
|
--text-button-primary-border-color: #3b82f6;
|
|
|
|
--text-button-secondary-background-color: #fee2e2;
|
|
--text-button-secondary-color: #ef4444;
|
|
--text-button-secondary-hover-background-color: #fecaca;
|
|
--text-button-secondary-hover-color: #dc2626;
|
|
--text-button-secondary-border-color: #fca5a5;
|
|
|
|
--text-button-active-background-color: #dcfce7;
|
|
--text-button-active-color: #166534;
|
|
--text-button-active-hover-background-color: #bbf7d0;
|
|
--text-button-active-hover-color: #15803d;
|
|
--text-button-active-border-color: #86efac;
|
|
|
|
--text-button-disabled-border-color: #434343;
|
|
--text-button-disabled-background-color: #717171;
|
|
--text-button-disabled-color: #9b9b9b;
|
|
|
|
/* Form Elements */
|
|
--toggle-switch-on-background-color: #22c55e;
|
|
--toggle-switch-off-background-color: #e2e8f0;
|
|
--toggle-switch-toggle-color: #ffffff;
|
|
|
|
--checkbox-background-color: #f8fafc;
|
|
--checkbox-hover-background-color: #eff6ff;
|
|
--checkbox-checked-background-color: #3b82f6;
|
|
|
|
/* Tables */
|
|
--table-header-background-color: #e4ecf4;
|
|
--table-card-background-color: #f7fbff;
|
|
--table-alternate-background-color: #f0f6fc;
|
|
--table-border-color: #cfdae6;
|
|
|
|
/* Tags & Statuses */
|
|
--tag-background-color: #f1f5f9;
|
|
--tag-color: #475569;
|
|
--tag-border-color: #e2e8f0;
|
|
|
|
--tag-active-background-color: #f0fdf4;
|
|
--tag-active-color: #166534;
|
|
--tag-active-border-color: #bbf7d0;
|
|
|
|
--tag-inactive-background-color: #f8fafc;
|
|
--tag-inactive-color: #94a3b8;
|
|
--tag-inactive-border-color: #e2e8f0;
|
|
|
|
--tag-alt-active-background-color: #faf5ff;
|
|
--tag-alt-active-color: #6b21a8;
|
|
--tag-alt-active-border-color: #e9d5ff;
|
|
|
|
--tag-status-expired-background-color: #fffbeb;
|
|
--tag-status-expired-color: #92400e;
|
|
--tag-status-expired-border-color: #fde68a;
|
|
|
|
--tag-status-banned-background-color: #fef2f2;
|
|
--tag-status-banned-color: #991b1b;
|
|
--tag-status-banned-border-color: #fecaca;
|
|
|
|
--tag-status-trial-background-color: #ecfeff;
|
|
--tag-status-trial-color: #155e75;
|
|
--tag-status-trial-border-color: #a5f3fc;
|
|
|
|
--tag-status-pending-background-color: #eff6ff;
|
|
--tag-status-pending-color: #1e40af;
|
|
--tag-status-pending-border-color: #bfdbfe;
|
|
|
|
--tag-live-background-color: #f0fdf4;
|
|
--tag-live-border-color: #22c55e;
|
|
--tag-video-background-color: #ecfeff;
|
|
--tag-video-border-color: #06b6d4;
|
|
--tag-series-background-color: #eef2ff;
|
|
--tag-series-border-color: #6366f1;
|
|
|
|
/* Toastr Notifications */
|
|
--toastr-success-background-color: #d7eadf;
|
|
--toastr-error-background-color: #f1dcdc;
|
|
--toastr-info-background-color: #dbe8f3;
|
|
--toastr-warning-background-color: #f3ead4;
|
|
|
|
--toastr-success-color: #166534;
|
|
--toastr-error-color: #991b1b;
|
|
--toastr-info-color: #1e40af;
|
|
--toastr-warning-color: #92400e;
|
|
|
|
/* Popups & Tooltips */
|
|
--popup-background-color: #f6fafeef;
|
|
--popup-color: #1e293b;
|
|
--popup-border-color: #cfdae6;
|
|
--tooltip-background-color: #2a3f54;
|
|
--tooltip-color: #eff5fb;
|
|
|
|
/* Header */
|
|
--app-header-background-color: #ffffffdd;
|
|
--app-header-color: #2563eb;
|
|
|
|
/* Utilities */
|
|
--pulse-color-1: #e2e8f0;
|
|
--pulse-color-2: #edf2f7;
|
|
--hint-color: #94a3b8;
|
|
--label-color: #3b82f6;
|
|
--title-label-color: #64748b;
|
|
--ok-color: #16a34a;
|
|
--warn-color: #eab308;
|
|
--attention-color: #ef4444;
|
|
--active-color: #22c55e;
|
|
|
|
/* EPG */
|
|
--epg-program-background-color: #ffffff;
|
|
--epg-program-color: #334155;
|
|
--epg-program-active-background-color: #f1f5f9;
|
|
--epg-program-active-color: #1e293b;
|
|
--epg-program-time-color: #94a3b8;
|
|
--epg-program-active-time-color: #475569;
|
|
|
|
/* Tabs */
|
|
--tabset-background-color: #e6edf4;
|
|
--tab-background-color: #f3f8fd;
|
|
--tab-hover-background-color: #dce8f3;
|
|
--tab-hover-color: #2f6fa8;
|
|
--tab-active-background-color: #d1e1ef;
|
|
--tab-active-color: #25557e;
|
|
--tab-active-border-color: #4f81ad;
|
|
|
|
--tabset-border-color: #e2e8f0;
|
|
|
|
/* Code Editor (Fancy Light) */
|
|
--code-editor-background-color: #fdfdfd;
|
|
--code-editor-color: #334155;
|
|
--code-identifier-color: #0366d6;
|
|
--code-var-access-color: #005cc5;
|
|
--code-field-color: #e36209;
|
|
--code-property-color: #24292e;
|
|
--code-literal-color: #28a745;
|
|
--code-num-literal-color: #005cc5;
|
|
--code-built-in-function-color: #6f42c1;
|
|
--code-reserved-color: #d73a49;
|
|
--code-regex-color: #032f62;
|
|
--code-enum-color: #e36209;
|
|
--code-range-color: #005cc5;
|
|
--code-op-color: #d73a49;
|
|
--code-comparison-background-color: rgba(200, 200, 200, 0.6);
|
|
--code-comparison-color: #1e293b;
|
|
--code-bracket-1-color: #005cc5;
|
|
--code-bracket-2-color: #6f42c1;
|
|
--code-bracket-3-color: #e36209;
|
|
|
|
/* Glassmorphism Refined */
|
|
--glass-border-color: rgba(0, 0, 0, 0.08);
|
|
--glass-background-color: rgba(255, 255, 255, 0.4);
|
|
--glass-shadow-color: rgba(0, 0, 0, 0.05);
|
|
--glass-background-gradient-color-1: rgba(255, 255, 255, 0.5);
|
|
--glass-background-gradient-color-2: rgba(255, 255, 255, 0.2);
|
|
--glass-input-border-color: rgba(0, 0, 0, 0.1);
|
|
--glass-input-background-color: rgba(255, 255, 255, 0.3);
|
|
|
|
/* Brick Blocks (Node Graph Aesthetic) */
|
|
--brick-input-xtream-background-color: #dbeafe;
|
|
--brick-input-xtream-border-color: #3b82f6;
|
|
--brick-input-m3u-background-color: #f0f9ff;
|
|
--brick-input-m3u-border-color: #0ea5e9;
|
|
--brick-input-library-background-color: #f5f3ff;
|
|
--brick-input-library-border-color: #8b5cf6;
|
|
|
|
--brick-target-background-color: #f0fdf4;
|
|
--brick-target-border-color: #22c55e;
|
|
|
|
--brick-output-background-color: #fffbeb;
|
|
--brick-output-border-color: #f59e0b;
|
|
|
|
--brick-output-xtream-background-color: #ecfeff;
|
|
--brick-output-xtream-border-color: #06b6d4;
|
|
--brick-output-m3u-background-color: #f0fdfa;
|
|
--brick-output-m3u-border-color: #14b8a6;
|
|
--brick-output-hdhomerun-background-color: #f5f3ff;
|
|
--brick-output-hdhomerun-border-color: #8b5cf6;
|
|
--brick-output-strm-background-color: #fff1f2;
|
|
--brick-output-strm-border-color: #f43f5e;
|
|
|
|
/* Scrollbar */
|
|
--scrollbar-track-color: #f1f5f9;
|
|
--scrollbar-handle-color: #cbd5e1;
|
|
|
|
/* Misc */
|
|
--source-editor-line-color: #334155;
|
|
--source-editor-active-line-color: #16a34a;
|
|
--source-editor-pending-line-color: #eab308;
|
|
--breadcrumb-background-color: #f1f5f9;
|
|
--breadcrumb-color: #64748b;
|
|
--breadcrumb-active-background-color: #dcfce7;
|
|
--breadcrumb-active-color: #166534;
|
|
|
|
}
|