From a4e0ef4fe09cf5b81566c3477348b5424edad8a5 Mon Sep 17 00:00:00 2001
From: Claude <claude@firefrostgaming.com>
Date: Tue, 7 Apr 2026 22:14:12 +0000
Subject: [PATCH] Remove all dark mode CSS from Decap CMS - mobile-only
 optimizations

Removed entire dark mode theming (Fire/Frost/Arcane colors, dark backgrounds, all custom styling).

Keeping ONLY mobile-responsive optimizations:
- Larger touch targets (44px buttons/inputs)
- Single-column layout on mobile
- Stacked editor panes
- Better spacing for small screens
- 16px font size to prevent iOS zoom

Result: Clean, default Decap CMS styling with mobile improvements only.
This should resolve mobile display issues.
---
 admin/index.html | 459 +----------------------------------------------
 1 file changed, 4 insertions(+), 455 deletions(-)

diff --git a/admin/index.html b/admin/index.html
index fbcb8b0..92e2f65 100644
--- a/admin/index.html
+++ b/admin/index.html
@@ -7,412 +7,14 @@
   <title>Firefrost CMS</title>
   <style>
     /* ═══════════════════════════════════════════════════════════
-       FIREFROST GAMING - DECAP CMS DARK MODE
-       Fire: #FF6B35 | Frost: #4ECDC4 | Arcane: #A855F7 | Dark: #0F0F1E
+       FIREFROST GAMING - DECAP CMS MOBILE OPTIMIZATIONS
     ═══════════════════════════════════════════════════════════ */
     
-    :root {
-      --ff-fire: #FF6B35;
-      --ff-fire-light: #FF8C42;
-      --ff-frost: #4ECDC4;
-      --ff-frost-dark: #3DBDB5;
-      --ff-arcane: #A855F7;
-      --ff-arcane-dim: rgba(168, 85, 247, 0.3);
-      --ff-dark: #0F0F1E;
-      --ff-dark-mid: #1a1a2e;
-      --ff-dark-light: #252540;
-      --ff-dark-lighter: #2f2f4a;
-      --ff-text: #e0e0e0;
-      --ff-text-dim: #a0a0a0;
-    }
-
+    /* Basic mobile viewport setup */
     body {
+      margin: 0;
+      padding: 0;
       font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
-      background: var(--ff-dark) !important;
-    }
-
-    /* ═══════════════════════════════════════════════════════════
-       GLOBAL DARK BACKGROUND
-    ═══════════════════════════════════════════════════════════ */
-    
-    #nc-root,
-    [class*="App"],
-    [class*="Container"],
-    main,
-    section {
-      background: var(--ff-dark) !important;
-      color: var(--ff-text) !important;
-    }
-
-    /* ═══════════════════════════════════════════════════════════
-       HEADER - Dark with Frost accent
-    ═══════════════════════════════════════════════════════════ */
-    
-    header,
-    [class*="AppHeader"],
-    nav[class*="Header"] {
-      background: var(--ff-dark) !important;
-      border-bottom: 2px solid var(--ff-frost) !important;
-    }
-
-    header *,
-    [class*="AppHeader"] * {
-      color: var(--ff-text) !important;
-    }
-
-    a[href*="firefrostgaming.com"] {
-      color: var(--ff-frost) !important;
-      font-weight: 600 !important;
-    }
-
-    a[href*="firefrostgaming.com"]:hover {
-      color: var(--ff-fire) !important;
-    }
-
-    /* ═══════════════════════════════════════════════════════════
-       SIDEBAR - Dark gradient
-    ═══════════════════════════════════════════════════════════ */
-    
-    aside,
-    [class*="Sidebar"],
-    nav:not([class*="Header"]) {
-      background: linear-gradient(180deg, var(--ff-dark-mid) 0%, var(--ff-dark) 100%) !important;
-      border-right: 1px solid var(--ff-dark-lighter) !important;
-    }
-
-    /* Sidebar text */
-    aside *,
-    [class*="Sidebar"] *,
-    [class*="Collection"] {
-      color: var(--ff-text) !important;
-    }
-
-    /* Search box */
-    input[type="search"],
-    input[placeholder*="Search"],
-    [class*="Search"] input {
-      background: var(--ff-dark-light) !important;
-      border: 1px solid var(--ff-dark-lighter) !important;
-      color: var(--ff-text) !important;
-    }
-
-    input[type="search"]::placeholder {
-      color: var(--ff-text-dim) !important;
-    }
-
-    /* ═══════════════════════════════════════════════════════════
-       🔥 TASKS - Fire Orange (Priority/Action)
-    ═══════════════════════════════════════════════════════════ */
-    
-    a[href*="/collections/tasks"] {
-      background: linear-gradient(135deg, var(--ff-fire) 0%, var(--ff-fire-light) 100%) !important;
-      color: white !important;
-      border-radius: 8px !important;
-      font-weight: 700 !important;
-      padding: 12px 16px !important;
-      margin: 4px 8px !important;
-      box-shadow: 0 3px 12px rgba(255, 107, 53, 0.4) !important;
-      display: block !important;
-      text-decoration: none !important;
-    }
-
-    a[href*="/collections/tasks"]:hover {
-      background: linear-gradient(135deg, var(--ff-fire-light) 0%, var(--ff-fire) 100%) !important;
-      transform: translateY(-1px) !important;
-      box-shadow: 0 5px 16px rgba(255, 107, 53, 0.5) !important;
-    }
-
-    a[href*="/collections/tasks"] span,
-    a[href*="/collections/tasks"] * {
-      color: white !important;
-    }
-
-    /* ═══════════════════════════════════════════════════════════
-       CONTENT AREA - Dark
-    ═══════════════════════════════════════════════════════════ */
-    
-    [class*="EntryEditor"],
-    [class*="Collection"],
-    [class*="Content"],
-    [class*="Pane"],
-    [class*="Panel"] {
-      background: var(--ff-dark) !important;
-      color: var(--ff-text) !important;
-    }
-
-    /* Collection header */
-    h1, h2, h3, h4, h5, h6 {
-      color: var(--ff-text) !important;
-    }
-
-    /* Entry list items */
-    [class*="ListCard"],
-    [class*="EntryCard"],
-    li[class*="Entry"],
-    [class*="ObjectWidgetTopBar"],
-    ul[class*="List"] > li {
-      background: var(--ff-dark-mid) !important;
-      border: 1px solid var(--ff-dark-lighter) !important;
-      color: var(--ff-text) !important;
-      border-radius: 6px !important;
-      margin: 8px 0 !important;
-    }
-
-    /* Ensure all text inside cards is light */
-    [class*="ListCard"] *,
-    [class*="EntryCard"] *,
-    [class*="ListItemTopBar"] *,
-    [class*="NestedCollection"] *,
-    [class*="ListCard"] span,
-    [class*="ListCard"] div,
-    [class*="ListCard"] a,
-    [class*="ListCard"] h2,
-    [class*="ListCard"] h3,
-    [class*="ListCard"] p {
-      color: var(--ff-text) !important;
-      background: transparent !important;
-    }
-
-    [class*="ListCard"]:hover,
-    [class*="EntryCard"]:hover,
-    li[class*="Entry"]:hover {
-      border-left: 3px solid var(--ff-arcane) !important;
-      background: var(--ff-dark-light) !important;
-    }
-
-    /* ═══════════════════════════════════════════════════════════
-       EDITOR AREA
-    ═══════════════════════════════════════════════════════════ */
-    
-    /* Editor panes */
-    [class*="ControlPane"],
-    [class*="PreviewPane"] {
-      background: var(--ff-dark) !important;
-    }
-
-    /* Text inputs and textareas */
-    input,
-    textarea,
-    select,
-    [class*="TextField"],
-    [class*="TextArea"],
-    [contenteditable="true"] {
-      background: var(--ff-dark-light) !important;
-      border: 1px solid var(--ff-dark-lighter) !important;
-      color: var(--ff-text) !important;
-      border-radius: 4px !important;
-    }
-
-    input:focus,
-    textarea:focus,
-    select:focus,
-    [contenteditable="true"]:focus {
-      border-color: var(--ff-arcane) !important;
-      box-shadow: 0 0 0 3px var(--ff-arcane-dim) !important;
-      outline: none !important;
-    }
-
-    /* Markdown editor */
-    [class*="Editor"],
-    [class*="Markdown"],
-    .cm-editor,
-    .CodeMirror {
-      background: var(--ff-dark-light) !important;
-      color: var(--ff-text) !important;
-    }
-
-    .cm-content,
-    .CodeMirror-code,
-    .cm-line {
-      color: var(--ff-text) !important;
-    }
-
-    /* Editor toolbar */
-    [class*="Toolbar"],
-    [class*="EditorToolbar"] {
-      background: var(--ff-dark-mid) !important;
-      border-bottom: 1px solid var(--ff-dark-lighter) !important;
-    }
-
-    /* ═══════════════════════════════════════════════════════════
-       ❄️ BUTTONS - Frost Teal
-    ═══════════════════════════════════════════════════════════ */
-    
-    button:not([disabled]):not([class*="Delete"]):not([class*="Cancel"]) {
-      background: linear-gradient(135deg, var(--ff-frost) 0%, var(--ff-frost-dark) 100%) !important;
-      color: var(--ff-dark) !important;
-      border: none !important;
-      font-weight: 600 !important;
-      border-radius: 6px !important;
-    }
-
-    button:not([disabled]):not([class*="Delete"]):not([class*="Cancel"]):hover {
-      background: linear-gradient(135deg, var(--ff-frost-dark) 0%, var(--ff-frost) 100%) !important;
-      box-shadow: 0 3px 12px rgba(78, 205, 196, 0.4) !important;
-    }
-
-    /* Cancel/secondary buttons */
-    button[class*="Cancel"],
-    button[class*="Secondary"] {
-      background: transparent !important;
-      border: 2px solid var(--ff-frost) !important;
-      color: var(--ff-frost) !important;
-    }
-
-    /* Delete buttons - keep red */
-    button[class*="Delete"] {
-      background: #dc3545 !important;
-      color: white !important;
-    }
-
-    /* Disabled buttons */
-    button[disabled] {
-      background: var(--ff-dark-lighter) !important;
-      color: var(--ff-text-dim) !important;
-      cursor: not-allowed !important;
-    }
-
-    /* ═══════════════════════════════════════════════════════════
-       💜 ACTIVE STATES - Arcane Purple
-    ═══════════════════════════════════════════════════════════ */
-    
-    a[aria-current="true"],
-    a[class*="active"],
-    li[class*="active"] > a {
-      border-left: 4px solid var(--ff-arcane) !important;
-      background: var(--ff-arcane-dim) !important;
-    }
-
-    /* Dropdown/menu items */
-    [class*="Dropdown"],
-    [class*="Menu"],
-    [role="listbox"],
-    [role="menu"] {
-      background: var(--ff-dark-mid) !important;
-      border: 1px solid var(--ff-dark-lighter) !important;
-    }
-
-    [class*="DropdownItem"]:hover,
-    [class*="MenuItem"]:hover,
-    [role="option"]:hover,
-    [role="menuitem"]:hover {
-      background: var(--ff-arcane-dim) !important;
-    }
-
-    /* ═══════════════════════════════════════════════════════════
-       LINKS
-    ═══════════════════════════════════════════════════════════ */
-    
-    a:not([href*="/collections"]):not([class*="Button"]) {
-      color: var(--ff-frost) !important;
-    }
-
-    a:not([href*="/collections"]):not([class*="Button"]):hover {
-      color: var(--ff-fire) !important;
-    }
-
-    /* ═══════════════════════════════════════════════════════════
-       SCROLLBARS - Dark themed
-    ═══════════════════════════════════════════════════════════ */
-    
-    ::-webkit-scrollbar {
-      width: 10px;
-      height: 10px;
-    }
-
-    ::-webkit-scrollbar-track {
-      background: var(--ff-dark);
-    }
-
-    ::-webkit-scrollbar-thumb {
-      background: var(--ff-dark-lighter);
-      border-radius: 5px;
-    }
-
-    ::-webkit-scrollbar-thumb:hover {
-      background: var(--ff-frost);
-    }
-
-    /* ═══════════════════════════════════════════════════════════
-       PREVIEW PANE - Rendered Markdown
-    ═══════════════════════════════════════════════════════════ */
-    
-    [class*="Preview"],
-    [class*="preview"],
-    [class*="WidgetPreview"],
-    [class*="PreviewPane"],
-    [class*="frame-content"] {
-      background: var(--ff-dark) !important;
-      color: var(--ff-text) !important;
-    }
-
-    [class*="Preview"] *,
-    [class*="preview"] *,
-    [class*="PreviewPane"] *,
-    [class*="WidgetPreview"] *,
-    [class*="frame-content"] * {
-      color: var(--ff-text) !important;
-    }
-
-    [class*="Preview"] h1,
-    [class*="Preview"] h2,
-    [class*="Preview"] h3,
-    [class*="Preview"] h4,
-    [class*="Preview"] h5,
-    [class*="Preview"] h6 {
-      color: var(--ff-frost) !important;
-    }
-
-    [class*="Preview"] a {
-      color: var(--ff-fire) !important;
-    }
-
-    [class*="Preview"] code,
-    [class*="Preview"] pre {
-      background: var(--ff-dark-light) !important;
-      color: var(--ff-frost) !important;
-    }
-
-    [class*="Preview"] blockquote {
-      border-left: 3px solid var(--ff-arcane) !important;
-      color: var(--ff-text-dim) !important;
-    }
-
-    /* iframe preview if Decap uses one */
-    iframe[class*="preview"],
-    iframe[class*="Preview"] {
-      background: var(--ff-dark) !important;
-    }
-
-    /* ═══════════════════════════════════════════════════════════
-       MISC
-    ═══════════════════════════════════════════════════════════ */
-    
-    /* Catch-all text colors - ensure nothing stays black */
-    p, span, label, div, li, td, th, dt, dd, figcaption, legend, summary {
-      color: var(--ff-text) !important;
-    }
-
-    /* Dimmed/secondary text */
-    small, .text-muted, [class*="subtle"], [class*="secondary"], [class*="hint"], [class*="description"] {
-      color: var(--ff-text-dim) !important;
-    }
-
-    /* Dividers and borders */
-    hr, [class*="Divider"] {
-      border-color: var(--ff-dark-lighter) !important;
-    }
-
-    /* Tooltips */
-    [class*="Tooltip"] {
-      background: var(--ff-dark-mid) !important;
-      color: var(--ff-text) !important;
-      border: 1px solid var(--ff-dark-lighter) !important;
-    }
-
-    /* Loading spinner area */
-    [class*="Loading"] {
-      background: var(--ff-dark) !important;
     }
 
     /* ═══════════════════════════════════════════════════════════
@@ -420,26 +22,6 @@
     ═══════════════════════════════════════════════════════════ */
     
     @media (max-width: 768px) {
-      /* Sidebar - Collapsible on mobile */
-      aside,
-      [class*="Sidebar"] {
-        position: fixed !important;
-        left: 0 !important;
-        top: 0 !important;
-        height: 100vh !important;
-        z-index: 1000 !important;
-        transform: translateX(-100%) !important;
-        transition: transform 0.3s ease !important;
-        width: 80% !important;
-        max-width: 300px !important;
-      }
-      
-      /* Show sidebar when open */
-      aside.open,
-      [class*="Sidebar"].open {
-        transform: translateX(0) !important;
-      }
-      
       /* Main content takes full width */
       main,
       [class*="MainContent"],
@@ -566,12 +148,6 @@
         margin-bottom: 8px !important;
         display: block !important;
       }
-      
-      /* Scrollbars - Thinner on mobile */
-      ::-webkit-scrollbar {
-        width: 6px;
-        height: 6px;
-      }
     }
     
     @media (max-width: 480px) {
@@ -588,13 +164,6 @@
         font-size: 18px !important;
       }
       
-      /* Sidebar - Full width on tiny screens */
-      aside,
-      [class*="Sidebar"] {
-        width: 100% !important;
-        max-width: 100% !important;
-      }
-      
       /* Reduce all padding */
       main,
       [class*="MainContent"] {
@@ -611,25 +180,5 @@
 </head>
 <body>
   <script src="https://unpkg.com/decap-cms@^3.0.0/dist/decap-cms.js"></script>
-  <script>
-    document.addEventListener('DOMContentLoaded', function() {
-      setTimeout(function() {
-        // Force Tasks link styling
-        const tasksLinks = document.querySelectorAll('a[href*="/collections/tasks"]');
-        tasksLinks.forEach(function(link) {
-          link.style.background = 'linear-gradient(135deg, #FF6B35 0%, #FF8C42 100%)';
-          link.style.color = 'white';
-          link.style.borderRadius = '8px';
-          link.style.fontWeight = '700';
-          link.style.padding = '12px 16px';
-          link.style.margin = '4px 8px';
-          link.style.boxShadow = '0 3px 12px rgba(255, 107, 53, 0.4)';
-          link.querySelectorAll('*').forEach(function(child) {
-            child.style.color = 'white';
-          });
-        });
-      }, 500);
-    });
-  </script>
 </body>
 </html>