New Filestructure for Docker

2026-07-31 23:53:14 +02:00
parent 1e10ed4de8
commit 5bcf2a3546
239 changed files with 710 additions and 2000 deletions
@@ -0,0 +1,152 @@
+:root {
+    --sb-bg: #f8fafc;
+    --sb-card-bg: #ffffff;
+    --sb-text-main: #36454F;
+    --sb-text-muted: #64748b;
+    --sb-border: #e2e8f0;
+    --sb-hover: #f3f3f3;
+    --sb-radius: 12px;
+    
+    /* Newly extracted color variables */
+    --sb-th-text: #1e293b;
+    --sb-th-border: #1e293b;
+    --sb-th-bg: #ffffff;
+    --sb-tr-even-bg: #f8f8f860;
+    --sb-changeable-bg: rgba(37, 99, 235, 0.02);
+    --sb-flash-highlight: #00ff99; /* Green flash for updates */
+
+    --font-numeric: 'Courier New', Courier, monospace;
+    --padding-td: clamp(3px, 2.5vh, 12px) clamp(4px, 2vw, 20px);
+    --padding-th: clamp(2px, 1.5vh, 6px) clamp(4px, 2vw, 20px);
+}
+
+@media (prefers-color-scheme: dark){
+    :root {
+        --sb-bg: #121212; /* Dark main background */
+        --sb-card-bg: #1a1a1a; /* Dark card surfaces */
+        --sb-text-main: #f5f5f5; /* Light grey/white text */
+        --sb-text-muted: #a0a0a0; /* Muted secondary text */
+        --sb-border: #2d2d2d; /* Soft dark border line */
+        --sb-hover: #252525; /* Subtle highlight on row hover */
+        --sb-radius: 12px;
+        
+        /* Dark mode specific variables */
+        --sb-th-text: #ffffff; /* Crisp white headers */
+        --sb-th-border: #3d3d3d; /* Distinct header separation */
+        --sb-th-bg: #121212; /* Matches dark body background */
+        --sb-tr-even-bg: #1a1a1a40; /* Very soft zebra striping */
+        --sb-changeable-bg: rgba(240, 163, 236, 0.05); /* Soft background using the pink/purple accent */
+        --sb-flash-highlight: #39ff14; /* Vibrant neon green for live updates on dark backgrounds */
+
+        --font-numeric: 'Courier New', Courier, monospace;
+        --padding-td: clamp(3px, 2.5vh, 12px) clamp(4px, 2vw, 20px);
+        --padding-th: clamp(2px, 1.5vh, 6px) clamp(4px, 2vw, 20px);
+    }
+}
+
+/* Base Table Styling */
+.customDisplayEditorTable {
+    width: 100%;
+    border-collapse: separate;
+    border-spacing: 0;
+    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
+    font-size: 0.95rem;
+    color: var(--sb-text-main);
+    text-align: left;
+}
+
+.customDisplayEditorTable th {
+    color: var(--sb-th-text);
+    border-bottom: solid 1px var(--sb-th-border);
+    font-weight: 600;
+    font-size: 0.9rem;
+    letter-spacing: 0.05em;
+    padding: var(--padding-th);
+    white-space: nowrap;
+    position: sticky;
+    background-color: var(--sb-th-bg);
+    top: 0;
+    z-index: 2;
+}
+
+.customDisplayEditorTable th sup {
+    font-size: 0.65rem;
+    margin-left: 2px;
+    vertical-align: super;
+}
+
+.customDisplayEditorTable td {
+    padding: var(--padding-td);
+    border-bottom: 1px solid var(--sb-border);
+    vertical-align: middle;
+    transition: background-color 0.2s ease;
+}
+
+.customDisplayEditorTable tbody > tr:nth-child(even) td {
+    background-color: var(--sb-tr-even-bg);
+}
+
+.customDisplayEditorTable tbody > tr:hover td {
+    background-color: var(--sb-hover) !important;
+}
+
+.customDisplayEditorTable td {
+    color: var(--sb-text-main);
+    font-size: 0.9rem;
+}
+
+.customDisplayEditorTable td.changebleValue {
+    font-family: var(--font-numeric);
+    font-size: 1.05rem;
+    color: var(--sb-text-main);
+    background-color: var(--sb-changeable-bg);
+}
+
+.customDisplayEditorTable tr:last-child td {
+    border-bottom: none;
+}
+
+.changebleValue.updated {
+    animation: flashHighlight 3.5s ease-out;
+}
+
+@keyframes flashHighlight {
+    0% { color: var(--sb-flash-highlight); }
+    100% { color: var(--sb-text-main); }
+}
+
+.singleValueSpan[data-bold="true"] {
+    font-weight: 600;
+}
+
+.staticText {
+    white-space: pre;
+}
+
+.tdSpan {
+    display: flex;
+    align-items: center;
+}
+
+.verticalLayoutEl {
+    display: grid;
+    grid-template-columns: 1fr;
+}
+
+.verticalLayoutElRow {
+    display: flex;
+    justify-content: end;
+}
+
+.verticalLayoutEl .changebleValue {
+    text-align: right;
+}
+
+.emtyPlaceholder {
+    color: transparent;
+    user-select: none;
+}
+
+.nonExistentEl {
+    display: none !important;
+}