diff --git a/zddc/internal/apps/embedded/archive.html b/zddc/internal/apps/embedded/archive.html
index 5c9ec50..98d61f2 100644
--- a/zddc/internal/apps/embedded/archive.html
+++ b/zddc/internal/apps/embedded/archive.html
@@ -53,9 +53,9 @@
/* The [data-theme="light"] selector locks light mode regardless of OS pref. */
@media (prefers-color-scheme: dark) {
:root:not([data-theme="light"]) {
- --primary: #4a90c4;
- --primary-hover: #5ba3d9;
- --primary-active: #6ab5e8;
+ --primary: #5fa8e0;
+ --primary-hover: #74b6e6;
+ --primary-active: #88c4ec;
--primary-light: #1a3550;
--bg: #1e1e1e;
@@ -74,9 +74,9 @@
/* Manual dark override — wins over media query */
[data-theme="dark"] {
- --primary: #4a90c4;
- --primary-hover: #5ba3d9;
- --primary-active: #6ab5e8;
+ --primary: #5fa8e0;
+ --primary-hover: #74b6e6;
+ --primary-active: #88c4ec;
--primary-light: #1a3550;
--bg: #1e1e1e;
@@ -2316,7 +2316,7 @@ td[data-field="trackingNumber"] {
diff --git a/zddc/internal/apps/embedded/browse.html b/zddc/internal/apps/embedded/browse.html
index f5f94e1..594c355 100644
--- a/zddc/internal/apps/embedded/browse.html
+++ b/zddc/internal/apps/embedded/browse.html
@@ -53,9 +53,9 @@
/* The [data-theme="light"] selector locks light mode regardless of OS pref. */
@media (prefers-color-scheme: dark) {
:root:not([data-theme="light"]) {
- --primary: #4a90c4;
- --primary-hover: #5ba3d9;
- --primary-active: #6ab5e8;
+ --primary: #5fa8e0;
+ --primary-hover: #74b6e6;
+ --primary-active: #88c4ec;
--primary-light: #1a3550;
--bg: #1e1e1e;
@@ -74,9 +74,9 @@
/* Manual dark override — wins over media query */
[data-theme="dark"] {
- --primary: #4a90c4;
- --primary-hover: #5ba3d9;
- --primary-active: #6ab5e8;
+ --primary: #5fa8e0;
+ --primary-hover: #74b6e6;
+ --primary-active: #88c4ec;
--primary-light: #1a3550;
--bg: #1e1e1e;
@@ -1271,6 +1271,36 @@ html, body {
.toc-level-5 a { padding-left: 3.35rem; color: var(--text-muted); font-size: 0.8rem; }
.toc-level-6 a { padding-left: 4rem; color: var(--text-muted); font-size: 0.8rem; }
+/* ── Sort control ────────────────────────────────────────────────────────── */
+.sort-control {
+ display: inline-flex;
+ align-items: center;
+ gap: 0.35rem;
+ font-size: 0.8rem;
+ color: var(--text-muted);
+ white-space: nowrap;
+}
+
+.sort-control__label {
+ user-select: none;
+}
+
+.sort-control__select {
+ font-family: var(--font);
+ font-size: 0.8rem;
+ padding: 0.2rem 0.4rem;
+ border: 1px solid var(--border);
+ border-radius: var(--radius);
+ background: var(--bg);
+ color: var(--text);
+ cursor: pointer;
+}
+
+.sort-control__select:focus {
+ outline: 2px solid var(--primary);
+ outline-offset: -1px;
+}
+
@@ -1286,7 +1316,7 @@ html, body {
@@ -1323,6 +1353,18 @@ html, body {
+
@@ -4845,6 +4887,13 @@ var e=function(t,n){return e=Object.setPrototypeOf||{__proto__:[]}instanceof Arr
}
render();
},
+ // Set both key and direction explicitly. dir: 1 (asc) or -1 (desc).
+ // Used by the toolbar's sort dropdown.
+ setSortExplicit: function (key, dir) {
+ state.sort.key = key;
+ state.sort.dir = (dir === -1 ? -1 : 1);
+ render();
+ },
pathFor: pathFor
};
})();
@@ -5775,6 +5824,20 @@ var e=function(t,n){return e=Object.setPrototypeOf||{__proto__:[]}instanceof Arr
var refresh = document.getElementById('refreshHeaderBtn');
if (refresh) refresh.addEventListener('click', refreshListing);
+ // Sort dropdown — change → tree re-renders with the new sort.
+ // Format of option value: ":". Defaults match
+ // state.sort initial values (name:asc).
+ var sortSel = document.getElementById('sortBy');
+ if (sortSel) {
+ sortSel.value = state.sort.key + ':' + (state.sort.dir > 0 ? 'asc' : 'desc');
+ sortSel.addEventListener('change', function () {
+ var parts = sortSel.value.split(':');
+ var key = parts[0];
+ var dir = parts[1] === 'desc' ? -1 : 1;
+ tree.setSortExplicit(key, dir);
+ });
+ }
+
// View-mode toggle (Browse vs Grid)
var btnBrowse = document.getElementById('viewModeBrowse');
var btnGrid = document.getElementById('viewModeGrid');
diff --git a/zddc/internal/apps/embedded/classifier.html b/zddc/internal/apps/embedded/classifier.html
index 1761c48..8787db7 100644
--- a/zddc/internal/apps/embedded/classifier.html
+++ b/zddc/internal/apps/embedded/classifier.html
@@ -53,9 +53,9 @@
/* The [data-theme="light"] selector locks light mode regardless of OS pref. */
@media (prefers-color-scheme: dark) {
:root:not([data-theme="light"]) {
- --primary: #4a90c4;
- --primary-hover: #5ba3d9;
- --primary-active: #6ab5e8;
+ --primary: #5fa8e0;
+ --primary-hover: #74b6e6;
+ --primary-active: #88c4ec;
--primary-light: #1a3550;
--bg: #1e1e1e;
@@ -74,9 +74,9 @@
/* Manual dark override — wins over media query */
[data-theme="dark"] {
- --primary: #4a90c4;
- --primary-hover: #5ba3d9;
- --primary-active: #6ab5e8;
+ --primary: #5fa8e0;
+ --primary-hover: #74b6e6;
+ --primary-active: #88c4ec;
--primary-light: #1a3550;
--bg: #1e1e1e;
@@ -1536,7 +1536,7 @@ body.help-open .app-header {
diff --git a/zddc/internal/apps/embedded/index.html b/zddc/internal/apps/embedded/index.html
index d2a3978..f9a7a75 100644
--- a/zddc/internal/apps/embedded/index.html
+++ b/zddc/internal/apps/embedded/index.html
@@ -53,9 +53,9 @@
/* The [data-theme="light"] selector locks light mode regardless of OS pref. */
@media (prefers-color-scheme: dark) {
:root:not([data-theme="light"]) {
- --primary: #4a90c4;
- --primary-hover: #5ba3d9;
- --primary-active: #6ab5e8;
+ --primary: #5fa8e0;
+ --primary-hover: #74b6e6;
+ --primary-active: #88c4ec;
--primary-light: #1a3550;
--bg: #1e1e1e;
@@ -74,9 +74,9 @@
/* Manual dark override — wins over media query */
[data-theme="dark"] {
- --primary: #4a90c4;
- --primary-hover: #5ba3d9;
- --primary-active: #6ab5e8;
+ --primary: #5fa8e0;
+ --primary-hover: #74b6e6;
+ --primary-active: #88c4ec;
--primary-light: #1a3550;
--bg: #1e1e1e;
@@ -1225,7 +1225,7 @@ body {