diff --git a/public/index.html b/public/index.html
index bfe0572..490493e 100644
--- a/public/index.html
+++ b/public/index.html
@@ -28,6 +28,24 @@
box-sizing: border-box;
margin: 0;
padding: 0;
+ scrollbar-width: thin;
+ scrollbar-color: rgba(255, 255, 255, 0.15) transparent;
+ }
+
+ /* Custom Scrollbar Styles */
+ ::-webkit-scrollbar {
+ width: 6px;
+ height: 6px;
+ }
+ ::-webkit-scrollbar-track {
+ background: transparent;
+ }
+ ::-webkit-scrollbar-thumb {
+ background: rgba(255, 255, 255, 0.12);
+ border-radius: 3px;
+ }
+ ::-webkit-scrollbar-thumb:hover {
+ background: var(--accent-purple);
}
body {
@@ -312,6 +330,8 @@
/* Proxy Nodes view */
.table-container {
+ max-height: 480px;
+ overflow-y: auto;
overflow-x: auto;
}
@@ -322,6 +342,10 @@
}
th {
+ position: sticky;
+ top: 0;
+ background: #0f1523; /* solid dark background matching blended card color */
+ z-index: 10;
padding: 1rem;
color: var(--text-secondary);
font-weight: 600;
diff --git a/public/viewer.html b/public/viewer.html
index 3694bb9..ff2914e 100644
--- a/public/viewer.html
+++ b/public/viewer.html
@@ -19,6 +19,24 @@
* {
box-sizing: border-box;
+ scrollbar-width: thin;
+ scrollbar-color: rgba(0, 0, 0, 0.15) transparent;
+ }
+
+ /* Custom Scrollbar Styles */
+ ::-webkit-scrollbar {
+ width: 6px;
+ height: 6px;
+ }
+ ::-webkit-scrollbar-track {
+ background: transparent;
+ }
+ ::-webkit-scrollbar-thumb {
+ background: rgba(0, 0, 0, 0.12);
+ border-radius: 3px;
+ }
+ ::-webkit-scrollbar-thumb:hover {
+ background: var(--primary);
}
[hidden] {
@@ -164,6 +182,8 @@
}
.table-wrap {
+ max-height: 480px;
+ overflow-y: auto;
overflow-x: auto;
}
@@ -182,7 +202,10 @@
}
th {
+ position: sticky;
+ top: 0;
background: #f8fafc;
+ z-index: 10;
color: #475569;
font-size: 0.78rem;
font-weight: 750;