Fix agent tab wrapping: horizontal scroll instead of flex-shrink
- Tabs now scroll horizontally (overflow-x: auto) with hidden scrollbar - Each tab maintains its natural width (flex-shrink: 0) — no wrapping - Label stays pinned (flex-shrink: 0) so it doesn't get lost when scrolling
This commit is contained in:
+1
-1
@@ -5,7 +5,7 @@
|
|||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
|
||||||
<meta name="theme-color" content="#0d1117">
|
<meta name="theme-color" content="#0d1117">
|
||||||
<title>Hermes Command Center</title>
|
<title>Hermes Command Center</title>
|
||||||
<link rel="stylesheet" href="/static/style.css?v=15">
|
<link rel="stylesheet" href="/static/style.css?v=16">
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div id="app">
|
<div id="app">
|
||||||
|
|||||||
+9
-6
@@ -51,7 +51,6 @@ body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; b
|
|||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
gap: 8px;
|
gap: 8px;
|
||||||
flex-wrap: wrap;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.chat-profiles-label {
|
.chat-profiles-label {
|
||||||
@@ -59,20 +58,25 @@ body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; b
|
|||||||
color: var(--text-muted);
|
color: var(--text-muted);
|
||||||
font-weight: 500;
|
font-weight: 500;
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
|
flex-shrink: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.chat-profile-tabs {
|
.chat-profile-tabs {
|
||||||
display: flex;
|
display: flex;
|
||||||
gap: 4px;
|
gap: 4px;
|
||||||
|
overflow-x: auto;
|
||||||
|
-webkit-overflow-scrolling: touch;
|
||||||
|
scrollbar-width: none;
|
||||||
flex: 1;
|
flex: 1;
|
||||||
|
padding-bottom: 2px;
|
||||||
}
|
}
|
||||||
|
.chat-profile-tabs::-webkit-scrollbar { display: none; }
|
||||||
|
|
||||||
.chat-profile-tab {
|
.chat-profile-tab {
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
gap: 4px;
|
||||||
gap: 5px;
|
padding: 5px 10px;
|
||||||
padding: 5px 8px;
|
|
||||||
border: 1px solid var(--border);
|
border: 1px solid var(--border);
|
||||||
border-radius: 16px;
|
border-radius: 16px;
|
||||||
background: transparent;
|
background: transparent;
|
||||||
@@ -81,8 +85,7 @@ body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; b
|
|||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
transition: all 0.15s;
|
transition: all 0.15s;
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
flex: 1;
|
flex-shrink: 0;
|
||||||
min-width: 0;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.chat-profile-tab:hover {
|
.chat-profile-tab:hover {
|
||||||
|
|||||||
Reference in New Issue
Block a user