CSS aufgeteilt (base/main/prototype), prototype.html eigenes Init-Script

wwwroot/css/prototype.css

@@ -0,0 +1,61 @@
+body {
+  display: flex;
+}
+
+main {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  min-width: 0;
+}
+
+/* ── Sidebar ── */
+
+#sidebar {
+  width: 260px;
+  background: #1a1a1a;
+  border-right: 1px solid #444;
+  display: flex;
+  flex-direction: column;
+  flex-shrink: 0;
+  overflow: hidden;
+}
+
+.sidebar-header {
+  padding: 1em;
+  border-bottom: 1px solid #444;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
+
+#sessionList {
+  flex: 1;
+  overflow-y: auto;
+}
+
+.session-item {
+  padding: 1em;
+  cursor: pointer;
+  display: flex;
+  flex-direction: column;
+  border-left: 3px solid transparent;
+}
+
+.session-item:hover { background: #333; }
+
+.session-item.active {
+  background: #333;
+  border-left-color: #eee;
+}
+
+.session-name {
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  border: 1px solid transparent;
+}
+
+.session-date {
+  color: #888;
+}