Initial commit: Aurora Admin plugin

2026-07-03 02:53:29 -05:00
commit 03cabe2fe4
73 changed files with 9591 additions and 0 deletions
@@ -0,0 +1,109 @@
+/*
+ * The ONLY global stylesheet in the plugin. Every rule here either defines
+ * an --aurora-* theme variable or targets a specific WordPress structural ID
+ * to frame the native content. No element/tag resets, no utility classes —
+ * so it cannot leak onto or restyle WordPress's own page content the way the
+ * old plugin's Tailwind preflight did.
+ *
+ * Theme colors live here as plain CSS variables we fully control. Dark mode
+ * is a single class on <html> (.aurora-dark) that swaps the variable values.
+ */
+
+/* Palette carried over from the original plugin's design tokens: a zinc
+   neutral scale with a blue/indigo accent, large rounded surfaces. */
+:root {
+  --aurora-sidebar-w: 264px;
+  --aurora-toolbar-h: 56px;
+  /* Breathing room between page content and the right browser edge. */
+  --aurora-gutter-r: 44px;
+
+  --aurora-radius: 14px;
+  --aurora-radius-lg: 24px;
+
+  /* Light theme */
+  --aurora-app-bg: #fafafa;        /* zinc-50  */
+  --aurora-bg: #ffffff;            /* frame    */
+  --aurora-card-bg: #fafafa;       /* zinc-50  */
+  --aurora-bg-subtle: #f4f4f5;     /* zinc-100 */
+  --aurora-text: #18181b;          /* zinc-900 */
+  --aurora-text-muted: #71717a;    /* zinc-500 */
+  --aurora-border: #e4e4e7;        /* zinc-200 */
+  --aurora-card-border: #ececef;
+  --aurora-frame-bg: #ffffff;      /* native-page content panel */
+  --aurora-frame-border: #e0e0e3;
+  --aurora-accent: rgb(71 114 250);
+  --aurora-accent-soft: rgb(71 114 250 / 0.1);
+  --aurora-accent-text: #ffffff;
+}
+
+/* Minified menu: the toolbar's collapse button toggles this class; every
+   layout offset derives from --aurora-sidebar-w, so this one override
+   reflows the toolbar and content automatically. */
+html.aurora-collapsed {
+  --aurora-sidebar-w: 68px;
+}
+
+html.aurora-dark {
+  /* Dark theme — the immersive near-black look of the original */
+  --aurora-app-bg: #09090b;        /* zinc-950 */
+  --aurora-bg: #18181b;            /* zinc-900 frame */
+  --aurora-card-bg: #1f1f23;       /* slightly elevated */
+  --aurora-bg-subtle: #27272a;     /* zinc-800 */
+  --aurora-text: #f4f4f5;          /* zinc-100 */
+  --aurora-text-muted: #a1a1aa;    /* zinc-400 */
+  --aurora-border: #27272a;        /* zinc-800 */
+  --aurora-card-border: #2e2e33;
+  --aurora-frame-bg: #1c1c20;      /* slightly elevated panel */
+  --aurora-frame-border: #34343b;
+  --aurora-accent: rgb(125 158 255);
+  --aurora-accent-soft: rgb(125 158 255 / 0.14);
+}
+
+/* --- Framing: only applies once the Vue shell has signalled ready --- */
+
+html.aurora-ready,
+html.aurora-ready body {
+  background: var(--aurora-app-bg);
+}
+
+/* !important here defeats WordPress's own responsive #wpcontent margin
+   rules (.auto-fold / folded menu states live in media queries at equal
+   specificity). This is positioning the frame, not restyling content.
+   The toolbar clearance lives here (on #wpcontent, which holds everything)
+   rather than on #wpbody, so content rendered above #wpbody — like the
+   takeover dashboard — also clears the fixed toolbar. */
+html.aurora-ready #wpcontent {
+  margin-left: var(--aurora-sidebar-w) !important;
+  padding-left: 0 !important;
+  padding-top: var(--aurora-toolbar-h);
+  transition: margin-left 0.2s ease;
+}
+
+html.aurora-ready #wpbody-content {
+  background: var(--aurora-frame-bg);
+  color: var(--aurora-text);
+  border: 1px solid var(--aurora-frame-border);
+  border-radius: var(--aurora-radius-lg);
+  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06);
+  margin: 16px var(--aurora-gutter-r) 24px 24px;
+  padding: 32px;
+  min-height: calc(100vh - var(--aurora-toolbar-h) - 40px);
+  box-sizing: border-box;
+}
+
+/* The settings page renders its own two boxed panels, so drop the outer
+   content frame there — leaving just those panels on the dark backdrop. */
+html.aurora-ready body.toplevel_page_aurora-admin #wpbody-content {
+  background: var(--aurora-app-bg);
+  border: none;
+  border-radius: 0;
+  box-shadow: none;
+}
+
+/*
+ * Native WordPress pages are fully dark-themed by a dedicated stylesheet
+ * (admin/assets/native-dark.css), enqueued only on native pages and gated
+ * on dark mode. It restyles WP's postboxes, forms, tables, buttons, etc.
+ * Keeping that large surface in one isolated, native-only file means it
+ * can never leak onto Aurora's own pages or affect light mode.
+ */