From 869c3a8d6a3266abb497132f194607bca7fec6a7 Mon Sep 17 00:00:00 2001
From: Nick Yeoman <c@nickyeoman.com>
Date: Sat, 8 Nov 2025 10:28:13 -0800
Subject: [PATCH] Edit Page fixes

---
 controllers/editpage.php                      |   2 +-
 controllers/savepage.php                      |  35 +++---
 skeleton/novaconium/public/css/novaconium.css |  60 +++++++++++
 views/editpage.html.twig                      | 101 ++++++++++++------
 4 files changed, 147 insertions(+), 51 deletions(-)

diff --git a/controllers/editpage.php b/controllers/editpage.php
index 29bf262..4283866 100644
--- a/controllers/editpage.php
+++ b/controllers/editpage.php
@@ -50,7 +50,7 @@ EOSQL;
 if (empty($pageid)) {
     // New page: set default values for all fields
     $data['rows'] = [
-        'id'          => '',
+        'id'          => 'newpage',
         'title'       => '',
         'heading'     => '',
         'description' => '',
diff --git a/controllers/savepage.php b/controllers/savepage.php
index 2a32921..7b1ef73 100644
--- a/controllers/savepage.php
+++ b/controllers/savepage.php
@@ -43,21 +43,7 @@ if (empty($title) || empty($slug) || empty($body)) {
 }
 
 try {
-    if (!empty($id)) {
-        // Update existing page
-        $query = "UPDATE `pages` SET
-                    `title` = ?, `heading` = ?, `description` = ?, `keywords` = ?, `author` = ?,
-                    `slug` = ?, `path` = ?, `intro` = ?, `body` = ?, `notes` = ?,
-                    `draft` = ?, `changefreq` = ?, `priority` = ?, `updated` = NOW()
-                  WHERE `id` = ?";
-        $params = [
-            $title, $heading, $description, $keywords, $author,
-            $slug, $path, $intro, $body, $notes,
-            $draft, $changefreq, $priority, $id
-        ];
-        $db->query($query, $params);
-        $messages->notice('Page Updated');
-    } else {
+    if ($id == 'newpage') {
         // Create new page
         $query = "INSERT INTO `pages`
                     (`title`, `heading`, `description`, `keywords`, `author`,
@@ -72,7 +58,26 @@ try {
         $db->query($query, $params);
         $id = $db->lastid; // Get new page ID
         $messages->notice('Page Created');
+        $newpage = true;
+    } else {
+        $newpage = false;
     }
+
+    if (!empty($id) && !$newpage) {
+        // Update existing page
+        $query = "UPDATE `pages` SET
+                    `title` = ?, `heading` = ?, `description` = ?, `keywords` = ?, `author` = ?,
+                    `slug` = ?, `path` = ?, `intro` = ?, `body` = ?, `notes` = ?,
+                    `draft` = ?, `changefreq` = ?, `priority` = ?, `updated` = NOW()
+                  WHERE `id` = ?";
+        $params = [
+            $title, $heading, $description, $keywords, $author,
+            $slug, $path, $intro, $body, $notes,
+            $draft, $changefreq, $priority, $id
+        ];
+        $db->query($query, $params);
+        $messages->notice('Page Updated');
+    } 
 } catch (Exception $e) {
     $messages->error($e->getMessage());
     $redirect->url($url_error);
diff --git a/skeleton/novaconium/public/css/novaconium.css b/skeleton/novaconium/public/css/novaconium.css
index 304c3ba..2d2a9b8 100644
--- a/skeleton/novaconium/public/css/novaconium.css
+++ b/skeleton/novaconium/public/css/novaconium.css
@@ -112,3 +112,63 @@ div#debug {
 .pages-table th {
     font-weight: bold;
 }
+
+/* ============================================================
+   DARK MODE STYLES — edit-page-form-novaconium
+   ============================================================ */
+@media (prefers-color-scheme: dark) {
+
+    #edit-page-form-novaconium input[type="text"],
+    #edit-page-form-novaconium input[type="number"],
+    #edit-page-form-novaconium textarea,
+    #edit-page-form-novaconium select {
+        background: #2a2a2a;
+        border: 1px solid #444;
+        color: #eee;
+    }
+
+    #edit-page-form-novaconium input:focus,
+    #edit-page-form-novaconium textarea:focus,
+    #edit-page-form-novaconium select:focus {
+        border-color: #3399ff;
+        box-shadow: 0 0 0 3px rgba(51, 153, 255, 0.25);
+    }
+
+    #edit-page-form-novaconium input[type="checkbox"] {
+        accent-color: #3399ff;
+    }
+
+    #edit-page-form-novaconium button[type="submit"] {
+        background: #3399ff;
+        color: #fff;
+    }
+
+    #edit-page-form-novaconium button[type="submit"]:hover {
+        background: #1d7fd4;
+    }
+
+    #edit-page-form-novaconium p {
+        color: #aaa;
+    }
+
+    #edit-page-form-novaconium a {
+        color: #66b3ff;
+    }
+
+    #edit-page-form-novaconium a:hover {
+        color: #99ccff;
+    }
+
+    #edit-page-form-novaconium .form-group {
+    margin-bottom: 1.2rem;
+    }
+
+    #edit-page-form-novaconium .form-group.fullwidth textarea {
+        width: 100%;
+        resize: vertical;
+    }
+
+    #edit-page-form-novaconium .checkbox-group {
+        margin-top: 1.5rem;
+    }
+}
diff --git a/views/editpage.html.twig b/views/editpage.html.twig
index 499c339..54f98db 100644
--- a/views/editpage.html.twig
+++ b/views/editpage.html.twig
@@ -3,59 +3,90 @@
 {% block content %}
 <h2>Edit Page - {{ title }}</h2>
 
-<form method="post" action="/novaconium/savePage">
+<form method="post" action="/novaconium/savePage" id="edit-page-form-novaconium">
+
     <input type="hidden" name="id" value="{{ rows.id }}">
     <input type="hidden" name="token" value="{{ token }}">
 
-    <label for="title">Title:</label>
-    <input type="text" id="title" name="title" value="{{ rows.title }}" required>
+    <div class="form-group">
+        <label for="title">Title:</label>
+        <input type="text" id="title" name="title" value="{{ rows.title }}" required>
+    </div>
 
-    <label for="heading">Heading:</label>
-    <input type="text" id="heading" name="heading" value="{{ rows.heading }}">
+    <div class="form-group">
+        <label for="slug">
+            Slug: (<a href="/page/{{ rows.slug }}" target="_new">/page/{{ rows.slug }}</a>)
+        </label>
+        <input type="text" id="slug" name="slug" value="{{ rows.slug }}" required>
+    </div>
 
-    <label for="description">Description:</label>
-    <input type="text" id="description" name="description" value="{{ rows.description }}">
+    <div class="form-group fullwidth">
+        <label for="body">Body:</label>
+        <textarea id="body" name="body" rows="10">{{ rows.body }}</textarea>
+    </div>
+    
+    <h2>Metadata</h2>
 
-    <label for="keywords">Keywords:</label>
-    <input type="text" id="keywords" name="keywords" value="{{ rows.keywords }}">
+    <div class="form-group">
+        <label for="description">Description:</label>
+        <input type="text" id="description" name="description" value="{{ rows.description }}">
+    </div>
 
-    <label for="author">Author:</label>
-    <input type="text" id="author" name="author" value="{{ rows.author }}">
+    <div class="form-group">
+        <label for="keywords">Keywords:</label>
+        <input type="text" id="keywords" name="keywords" value="{{ rows.keywords }}">
+    </div>
 
-    <label for="slug">Slug: (<a href="/page/{{ rows.slug }}" target="_new">/page/{{ rows.slug }}</a>)</label>
-    <input type="text" id="slug" name="slug" value="{{ rows.slug }}" required>
+    <div class="form-group">
+        <label for="author">Author:</label>
+        <input type="text" id="author" name="author" value="{{ rows.author }}">
+    </div>
 
-    <label for="path">Path:</label>
-    <input type="text" id="path" name="path" value="{{ rows.path }}">
+    <h2>CMS Info</h2>
+    
+    <div class="form-group">
+        <label for="path">Path:</label>
+        <input type="text" id="path" name="path" value="{{ rows.path }}">
+    </div>
 
-    <label for="intro">Intro:</label>
-    <textarea id="intro" name="intro" rows="5">{{ rows.intro }}</textarea>
+    <div class="form-group">
+        <label for="changefreq">Change Frequency:</label>
+        <select id="changefreq" name="changefreq">
+            {% set freqs = ['always', 'hourly', 'daily', 'weekly', 'monthly', 'yearly', 'never'] %}
+            {% for freq in freqs %}
+                <option value="{{ freq }}" {% if rows.changefreq == freq %}selected{% endif %}>
+                    {{ freq|capitalize }}
+                </option>
+            {% endfor %}
+        </select>
+    </div>
 
-    <label for="body">Body:</label>
-    <textarea id="body" name="body" rows="10">{{ rows.body }}</textarea>
+    <div class="form-group">
+        <label for="priority">Priority (0.0 - 1.0):</label>
+        <input type="number" id="priority" name="priority" value="{{ rows.priority }}" step="0.1" min="0" max="1">
+    </div>
 
-    <label for="notes">Notes:</label>
-    <textarea id="notes" name="notes" rows="5">{{ rows.notes }}</textarea>
+    <div class="form-group fullwidth">
+        <label for="notes">Notes:</label>
+        <textarea id="notes" name="notes" rows="5">{{ rows.notes }}</textarea>
+    </div>
 
-    <label for="draft">
-        <input type="checkbox" id="draft" name="draft" value="1" {% if rows.draft %}checked{% endif %}>
-        Save as Draft
-    </label>
+    <h2>Page Data</h2>
+    <div class="form-group">
+        <label for="heading">Heading:</label>
+        <input type="text" id="heading" name="heading" value="{{ rows.heading }}">
+    </div>
 
-    <label for="changefreq">Change Frequency:</label>
-    <select id="changefreq" name="changefreq">
-        {% set freqs = ['always', 'hourly', 'daily', 'weekly', 'monthly', 'yearly', 'never'] %}
-        {% for freq in freqs %}
-            <option value="{{ freq }}" {% if rows.changefreq == freq %}selected{% endif %}>{{ freq|capitalize }}</option>
-        {% endfor %}
-    </select>
-
-    <label for="priority">Priority (0.0 - 1.0):</label>
-    <input type="number" id="priority" name="priority" value="{{ rows.priority }}" step="0.1" min="0" max="1">
+    <div class="form-group fullwidth">
+        <label for="intro">Intro:</label>
+        <textarea id="intro" name="intro" rows="5">{{ rows.intro }}</textarea>
+    </div>
 
     <p><strong>Created:</strong> {{ rows.created|date("Y-m-d H:i:s") }}</p>
     <p><strong>Last Updated:</strong> {{ rows.updated|date("Y-m-d H:i:s") }}</p>
 
     <button type="submit">Save Changes</button>
+
 </form>
+
 {% endblock %}