Mirror/intercept
1
0
Fork 0
mirror of https://github.com/smittix/intercept.git synced 2026-07-21 15:58:10 -07:00
Code Issues Packages Projects Releases Wiki Activity

Fix timeline text being squashed and unreadable

Browse Source 
- Increase lane min-height from 28px to 44px
- Widen label column from 100px to 140px
- Increase font sizes (freq: 11px, name: 10px)
- Add proper line-height and gap between lines
- Increase lanes container max-height to 240px
- Add more padding to label and track areas

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
Smittix
2026-01-20 21:05:18 +00:00
parent 1fcaec1b3b
commit 23c75ddd24
1 changed files with 13 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files
static/css/components/signal-timeline.css
+13 -10
View File
@@ -158,8 +158,8 @@
.signal-timeline-lanes { .signal-timeline-lanes {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
gap: 2px; gap: 3px;
max-height: 180px; max-height: 240px;
overflow-y: auto; overflow-y: auto;
margin-top: 8px; margin-top: 8px;
} }
@@ -185,7 +185,7 @@
.signal-timeline-lane { .signal-timeline-lane {
display: flex; display: flex;
align-items: stretch; align-items: stretch;
min-height: 28px; min-height: 44px;
background: var(--bg-secondary, #252525); background: var(--bg-secondary, #252525);
border-radius: 3px; border-radius: 3px;
overflow: hidden; overflow: hidden;
@@ -209,31 +209,34 @@
/* Signal label */ /* Signal label */
.signal-timeline-label { .signal-timeline-label {
width: 100px; width: 140px;
min-width: 100px; min-width: 140px;
padding: 6px 8px; padding: 8px 10px;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: center; justify-content: center;
gap: 2px;
border-right: 1px solid var(--border-color, #333); border-right: 1px solid var(--border-color, #333);
font-size: 10px;
overflow: hidden; overflow: hidden;
} }
.signal-timeline-freq { .signal-timeline-freq {
color: var(--text-primary, #fff); color: var(--text-primary, #fff);
font-size: 11px;
font-weight: 500; font-weight: 500;
white-space: nowrap; white-space: nowrap;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
line-height: 1.3;
} }
.signal-timeline-name { .signal-timeline-name {
color: var(--text-dim, #666); color: var(--text-dim, #666);
font-size: 9px; font-size: 10px;
white-space: nowrap; white-space: nowrap;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
line-height: 1.3;
} }
/* Status indicator */ /* Status indicator */
@@ -269,8 +272,8 @@
flex: 1; flex: 1;
position: relative; position: relative;
height: 100%; height: 100%;
min-height: 28px; min-height: 44px;
padding: 4px 8px; padding: 6px 10px;
cursor: pointer; cursor: pointer;
} }