e.cruz/Oracle-TX11-TX21
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Upload of projects and themes

Browse Source
This commit is contained in:
Emmanuel Hernandez Cruz
2026-02-17 18:14:44 +00:00
parent 00ee2e1ee1
commit c7730b9da4
302 changed files with 24019 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

276
gateway_frontend/themes/oracle-dark/variables.css Normal file
View File

@@ -0,0 +1,276 @@
:root {
/* =========================================
1. PRIMITIVES
Define base color palette for the theme.
========================================= */
/* --- ORACLE PALETTE (The Truth) --- */
--palette-oracle-red: #C74634;
/* Slates (Teal/Greys) - Used for Surfaces & Borders */
--palette-slate-50-1: #C2D4D4;
/* Lightest Teal */
--palette-slate-50-2: #A0BBBB;
--palette-slate-50-3: #85A8A8;
--palette-slate-50-4: #6A9595;
/* Vibrant Teal */
--palette-slate-100-1: #697778;
/* Mid Grey */
--palette-slate-100-2: #778788;
--palette-slate-100-3: #8F9D9E;
--palette-slate-100-4: #A8B2B3;
--palette-slate-150-1: #3C4545;
/* Card Surface */
--palette-slate-150-2: #4C5757;
/* Card Hover */
--palette-slate-150-3: #617070;
--palette-slate-150-4: #778888;
--palette-slate-200-1: #2B3333;
/* Background Root */
--palette-slate-200-2: #4C5757;
--palette-slate-200-3: #617070;
--palette-slate-200-4: #778888;
/* Warm Neutrals - Used for Text */
--palette-neutral-30-1: #F1EFED;
/* Main Text */
--palette-neutral-30-2: #DED9D4;
/* Secondary Text */
--palette-neutral-30-3: #CAC2BB;
/* Disabled Text */
--palette-neutral-30-4: #B6ACA2;
/* Standard Colors */
--white: #FFFFFF;
--black: #1A1A1A;
/* Never use pure #000000 in dark mode */
/* --- REFACTORED NEUTRALS (Mapped to Palette) --- */
/* We replace the random greys with your Slate Palette */
--neutral-10: var(--palette-slate-150-1);
/* Darkest */
--neutral-20: var(--palette-slate-150-2);
--neutral-30: var(--palette-slate-150-3);
--neutral-40: var(--palette-slate-100-1);
--neutral-50: var(--palette-slate-100-2);
/* Borders */
--neutral-60: var(--palette-slate-100-4);
--neutral-70: var(--palette-slate-50-4);
--neutral-80: var(--palette-slate-50-2);
--neutral-90: var(--palette-neutral-30-2);
--neutral-100: var(--palette-neutral-30-1);
/* Lightest */
/* =========================================
2. FUNCTIONAL
========================================= */
/* Alarm colors */
--alarm-critical: #D32F2F;
--alarm-high: #F57C00;
--alarm-medium: #FBC02D;
--alarm-low: #0288D1;
--alarm-info: #70539B;
/* One Line & HP (High Performance) */
--oneline-green: #8fca94;
--oneline-yellow: #f4b834;
--oneline-red: #e23030;
--oneline-gray: var(--palette-slate-100-2);
--high-performance-white: var(--white);
--high-performance-gray: var(--palette-slate-100-1);
--high-performance-red: var(--oneline-red);
--high-performance-blue: #a9d9ff;
--high-performance-purple: #7266b7;
--high-performance-green: var(--oneline-green);
--high-performance-yellow: var(--oneline-yellow);
/* Functional Status */
--error: var(--alarm-critical);
--info: #5691F0;
--info-secondary: #114599;
--warning: var(--alarm-medium);
--warning-secondary: #693D07;
--success: var(--oneline-green);
/* =========================================
3. OBJECTS
========================================= */
/* Containers & Surfaces */
--container-root: var(--palette-slate-200-1);
/* The deep floor */
--container: var(--palette-slate-150-1);
/* The card surface */
--container-nested: var(--palette-slate-150-2);
/* Slightly lighter */
/* Inputs (Mapped to Slate) */
--input: var(--palette-slate-200-1);
/* Dark input background */
--input-disabled: var(--palette-slate-150-3);
/* Icons & Labels */
--icon: var(--palette-neutral-30-3);
--icon-hover: var(--white);
--icon-disabled: var(--palette-slate-100-1);
--icon-selected: var(--palette-oracle-red);
/* Brand Pop */
--label: var(--palette-neutral-30-1);
--label-disabled: var(--palette-slate-100-2);
/* Borders (Mapped to Slate) */
--border: var(--palette-slate-100-1);
--border-disabled: var(--palette-slate-150-3);
--container-border: 1px solid rgba(255, 255, 255, 0.1);
/* Glass Edge */
/* --- REFACTORED BOX SHADOWS (Smooth Curve) --- */
/* Level 1: Subtle lift (Buttons, Inputs) */
--box-shadow-1: 0 2px 4px rgba(0, 0, 0, 0.4);
/* Level 2: Standard Card (Resting state) */
--box-shadow-2: 0 4px 8px rgba(0, 0, 0, 0.5), 0 0 0 1px rgba(255, 255, 255, 0.05);
/* Level 3: Hover State / Dropdowns */
--box-shadow-3: 0 8px 16px rgba(0, 0, 0, 0.6);
/* Level 4: Modals / Drawers (High Lift) */
--box-shadow-4: 0 16px 24px rgba(0, 0, 0, 0.65);
/* Level 5: Critical Alerts (Floating high) */
--box-shadow-5: 0 24px 48px rgba(0, 0, 0, 0.75);
--box-shadow-inset: inset 0 2px 4px rgba(0, 0, 0, 0.5);
/* --- Data Grids / Tables --- */
--table-header-bg: var(--palette-slate-150-3);
--table-header-text: var(--palette-neutral-30-1);
--table-row-bg: var(--palette-slate-150-1);
--table-row-alt-bg: rgba(255, 255, 255, 0.03);
/* Subtle Transparency for stripe */
--table-row-hover: var(--palette-slate-150-2);
--table-border: var(--palette-slate-100-1);
/* --- Typography --- */
--text-color: var(--palette-neutral-30-1);
--text-muted: var(--palette-neutral-30-3);
/* --- Typography Scale --- */
--text-xs: 0.75rem;
/* 12px - Labels */
--text-sm: 0.875rem;
/* 14px - Body text */
--text-md: 1rem;
/* 16px - Standard values */
--text-lg: 1.25rem;
/* 20px - Sub-headers */
--text-xl: 1.5rem;
/* 24px - Headers */
--text-2xl: 2rem;
/* Weights */
--weight-light: 300;
--weight-reg: 400;
--weight-bold: 700;
--font-NotoSans: 'Nunito Sans', -apple-system, sans-serif;
/* --- ACTIONS (Consolidated) --- */
/* We use the Oracle Red for Primary Actions, or Slate-50-4 for Secondary */
--call-to-action: var(--palette-slate-50-4);
--call-to-action-highlight: #5A8585;
/* Lighter Red */
--call-to-action-hover: #4A7575;
/* Darker Red */
--call-to-action-disabled: var(--palette-slate-100-1);
/* DESTRUCTIVE: Keep Oracle Red ONLY for dangerous actions */
--destructive: var(--palette-slate-50-4);
--destructive-hover: #4A7575;
/* SECONDARY: Neutral (Ghost style) */
--secondary-action: transparent;
--secondary-action-border: var(--palette-slate-100-2);
--secondary-action-text: var(--palette-neutral-30-1);
/* Checkbox / Radio */
--checkbox--checked: var(--palette-slate-50-4);
/* Teal check is safer than Red */
--checkbox--unchecked: var(--border);
--checkbox--disabled: var(--input-disabled);
--toggleSwitch--selected: var(--palette-slate-50-4);
/* Teal */
--toggleSwitch--unselected: var(--palette-slate-150-3);
/* Border Radius */
--border-radius: 4px;
--border-radius-input: 2px;
/* Opacity */
--opacity-25: rgba(0, 0, 0, 0.25);
--opacity-50: rgba(0, 0, 0, 0.50);
--opacity-85: rgba(0, 0, 0, 0.85);
/* Typography */
--font-NotoSans: 'Nunito Sans', -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
/* Checkbox */
--checkbox--checked: var(--call-to-action);
--checkbox--unchecked: var(--border);
--checkbox--indeterminate: var(--call-to-action);
--checkbox--disabled: var(--input-disabled);
/* Progress Bar */
--progressLinearTrack--determinate: var(--neutral-10);
--progressLinearTrack--indeterminate: var(--neutral-10);
--progressLinearBar--determinate: var(--info-secondary);
--progressLinearBar--indeterminate: var(--border);
/* Toggle Switch */
--toggleSwitch--selected: var(--call-to-action);
--toggleSwitch--unselected: var(--neutral-10);
/* Radio */
--radio--selected: var(--call-to-action);
--radio--unselected: var(--border);
--radio--disabled: var(--input-disabled);
/* Piping */
--pipePrimaryFill: var(--neutral-20);
--pipeSecondaryFill: #5a5a5a;
--pipeStroke: var(--neutral-70);
--pipeSelectStroke: var(--call-to-action);
/* Component Context Menu */
--contextBackground: var(--black);
/* Symbols */
--symbolFill--default: var(--neutral-20);
--symbolStroke--default: var(--neutral-70);
--symbolFillAnimation--default: var(--neutral-80);
--symbolFill--running: var(--neutral-50);
--symbolFillAnimation--running: var(--neutral-80);
--symbolStroke--running: var(--neutral-70);
--symbolFill--stopped: var(--black);
--symbolStroke--stopped: var(--neutral-70);
--symbolFill--faulted: #8F0E0E;
--symbolStroke--faulted: #FA8E8E;
/* --- LAYERS --- */
--z-background: -1;
--z-card: 10;
--z-header: 100;
--z-popup: 500;
--z-alarm-banner: 1000;
--z-tooltip: 2000;
/* Spacing Scale */
--space-xs: 4px;
--space-sm: 8px;
--space-md: 16px;
--space-lg: 24px;
--space-xl: 32px;
}