Restructure: site/ with modular code, matching Nubes Flask convention

2026-07-23 10:48:14 +04:00
parent 51e4d7a4f6
commit 420d09e6b5
17 changed files with 21 additions and 39 deletions
@@ -0,0 +1,152 @@
+/* === Nubes Design — Autotest === */
+
+:root {
+    --brand-primary: #2563eb;
+    --brand-primary-dark: #1d4ed8;
+    --brand-gray: #d1d5db;
+    --brand-grey-light: #f3f4f6;
+    --background: #ffffff;
+    --foreground: #1a1a1a;
+    --muted: #6b7280;
+    --destructive: #ef4444;
+    --green: #22c55e;
+    --radius: 12px;
+    --radius-sm: 6px;
+}
+
+* {
+    box-sizing: border-box;
+    margin: 0;
+    padding: 0;
+}
+
+body {
+    font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
+    font-size: 14px;
+    color: var(--foreground);
+    background: #f8f9fa;
+    line-height: 1.5;
+}
+
+/* === Layout === */
+.content {
+    padding: 32px 16px;
+}
+
+/* === Card === */
+.card {
+    background: var(--background);
+    border: 1px solid var(--brand-gray);
+    border-radius: var(--radius);
+    box-shadow: 0 1px 2px rgba(0, 0, 0, .05);
+    overflow: hidden;
+}
+
+.card-header {
+    background: var(--brand-grey-light);
+    padding: 12px 14px;
+    font-weight: 600;
+    font-size: 14px;
+    display: flex;
+    align-items: center;
+    border-bottom: 1px solid var(--brand-gray);
+}
+
+.card-body {
+    padding: 12px 14px;
+}
+
+/* === Table === */
+table {
+    width: 100%;
+    border-collapse: collapse;
+}
+
+th {
+    background: var(--brand-grey-light);
+    font-size: 11px;
+    font-weight: 600;
+    text-transform: uppercase;
+    color: var(--muted);
+    padding: 6px 10px;
+    text-align: left;
+    border-bottom: 1px solid var(--brand-gray);
+}
+
+td {
+    padding: 8px 10px;
+    border-bottom: 1px solid var(--brand-gray);
+    font-size: 14px;
+}
+
+tr:last-child td {
+    border-bottom: none;
+}
+
+tr:hover td {
+    background: rgba(243, 244, 246, 0.5);
+}
+
+/* === Badge === */
+.badge {
+    display: inline-flex;
+    align-items: center;
+    gap: 4px;
+    border-radius: 9999px;
+    padding: 2px 10px;
+    font-size: 12px;
+    font-weight: 500;
+    white-space: nowrap;
+}
+
+.badge-success {
+    background: #dcfce7;
+    color: #166534;
+}
+
+/* === Empty state === */
+.empty {
+    text-align: center;
+    padding: 32px 16px;
+    color: var(--muted);
+}
+
+.empty p {
+    margin-top: 8px;
+}
+
+/* === Button === */
+.btn {
+    display: inline-flex;
+    align-items: center;
+    gap: 6px;
+    height: 32px;
+    padding: 0 14px;
+    border-radius: var(--radius-sm);
+    border: 1px solid var(--brand-gray);
+    background: var(--background);
+    font-size: 14px;
+    color: var(--foreground);
+    cursor: pointer;
+    transition: background .15s;
+}
+
+.btn:hover {
+    background: var(--brand-grey-light);
+}
+
+.btn-primary {
+    background: var(--brand-primary);
+    color: #fff;
+    border-color: var(--brand-primary);
+}
+
+.btn-primary:hover {
+    background: var(--brand-primary-dark);
+}
+
+.btn-danger {
+    background: var(--destructive);
+    color: #fff;
+    border-color: var(--destructive);
+}