v0.71.0: admin panel — users table, login/sessions, generic DB CRUD modal

2026-09-24 09:24:31 +00:00
parent 034d7a8d94
commit b89d351587
25 changed files with 2089 additions and 6 deletions
@@ -588,3 +588,142 @@ body {
  font-weight: 600;
  color: #f1f5f9;
 }
+
+/* v0.71.0 — Admin modal: overlay sits above the z-50 toast stack; panel matches the dark slate theme. */
+.modal-overlay {
+  position: fixed;
+  inset: 0;
+  z-index: 60; /* above toasts (z-50) and everything else on screen */
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background: rgba(2, 6, 23, 0.7);
+}
+
+.modal-panel {
+  width: min(920px, calc(100vw - 32px));
+  max-height: calc(100vh - 48px);
+  display: flex;
+  flex-direction: column;
+  background: rgba(15, 23, 42, 0.97);
+  color: #e2e8f0;
+  border: 1px solid rgba(148, 163, 184, 0.4);
+  border-radius: 8px;
+  box-shadow: 0 12px 40px rgba(2, 6, 23, 0.6);
+}
+
+.modal-header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 8px;
+  padding: 10px 14px;
+  border-bottom: 1px solid rgba(148, 163, 184, 0.25);
+}
+
+.modal-header h2 {
+  margin: 0;
+  font-size: 15px;
+  font-weight: 600;
+}
+
+/* v0.71.0 — Admin panel content (login form + generic DB grid). */
+.admin-panel {
+  padding: 14px;
+  overflow-y: auto;
+  display: flex;
+  flex-direction: column;
+  gap: 10px;
+}
+
+.admin-login {
+  max-width: 320px;
+  margin: 0 auto;
+  width: 100%;
+}
+
+.admin-panel label {
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+  font-size: 12px;
+  color: #cbd5e1;
+}
+
+.admin-panel input[type='text'],
+.admin-panel input:not([type]),
+.admin-login input {
+  font-size: 13px;
+  padding: 5px 8px;
+  border-radius: 4px;
+  border: 1px solid rgba(148, 163, 184, 0.4);
+  background: #1e293b;
+  color: #e2e8f0;
+}
+
+.admin-message {
+  margin: 0;
+  font-size: 13px;
+  color: #cbd5e1;
+}
+
+.admin-error {
+  font-size: 12px;
+  color: #fca5a5;
+}
+
+.admin-toolbar {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  flex-wrap: wrap;
+}
+
+.admin-table-list {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 6px;
+}
+
+.admin-rows-wrap {
+  overflow-x: auto;
+  border: 1px solid rgba(148, 163, 184, 0.25);
+  border-radius: 6px;
+}
+
+.admin-rows {
+  width: 100%;
+  border-collapse: collapse;
+  font-size: 12px;
+}
+
+.admin-rows th,
+.admin-rows td {
+  padding: 4px 6px;
+  text-align: left;
+  white-space: nowrap;
+  border-bottom: 1px solid rgba(148, 163, 184, 0.2);
+}
+
+.admin-rows th {
+  color: #94a3b8;
+  font-weight: 600;
+}
+
+.admin-cell {
+  width: 110px;
+  font-size: 12px;
+  padding: 2px 5px;
+  border-radius: 3px;
+  border: 1px solid rgba(148, 163, 184, 0.3);
+  background: #1e293b;
+  color: #e2e8f0;
+}
+
+.admin-cell:disabled {
+  opacity: 0.55;
+}
+
+.admin-row-actions {
+  white-space: nowrap;
+}