Stabilize chat and cookbook workflows

This commit is contained in:
pewdiepie-archdaemon
2026-07-01 10:09:25 +00:00
parent d8e76003f1
commit d2959c1ae8
12 changed files with 1034 additions and 190 deletions
+59
View File
@@ -1843,6 +1843,8 @@ body.bg-pattern-sparkles {
}
.chat-meta { font-size:12px; color:color-mix(in srgb, var(--fg) 60%, transparent); margin-bottom:6px; }
.chat-history {
display:flex;
flex-direction:column;
flex:1;
overflow-y:auto;
overflow-x:hidden;
@@ -1854,6 +1856,9 @@ body.bg-pattern-sparkles {
padding-left: max(0px, calc((100% - var(--chat-max)) / 2));
padding-right: max(12px, calc((100% - var(--chat-max)) / 2 + 12px));
}
.chat-history > * {
flex: 0 0 auto;
}
/* Sortable Cookbook column headers had no visual cue, so users couldn't tell
a header was clickable (the Newest sort on the Model column was invisible).
Show a pointer + hover highlight, and underline the active sort column. */
@@ -2019,6 +2024,17 @@ body.bg-pattern-sparkles {
pointer-events: none;
transform: translate(-50%, -58%) scale(0.96);
}
.chat-container.welcome-active:has(.input-icon-btn.expanded) #welcome-screen,
.chat-container.welcome-active:has(.send-btn.newchat-expanded) #welcome-screen,
.chat-container.welcome-active:has(#model-picker-wrap:not(.picker-auto-hidden) .model-picker-menu:not(.hidden)) #welcome-screen {
opacity: 0.45;
transform: translate(-50%, -76%) scale(0.94);
}
.chat-container.welcome-active:has(.input-icon-btn.expanded) #welcome-screen .welcome-tip,
.chat-container.welcome-active:has(.send-btn.newchat-expanded) #welcome-screen .welcome-tip,
.chat-container.welcome-active:has(#model-picker-wrap:not(.picker-auto-hidden) .model-picker-menu:not(.hidden)) #welcome-screen .welcome-tip {
opacity: 0.14;
}
.chat-container.welcome-active textarea#message {
max-height: min(34vh, 150px);
}
@@ -2124,6 +2140,49 @@ body.bg-pattern-sparkles {
.msg-user .body {
color: var(--fg);
}
.chat-queued-bubble-host {
order: 2147483647;
display: flex;
flex-direction: column;
align-items: stretch;
flex: 0 0 auto;
width: 100%;
min-width: 0;
}
.msg-user.msg-user-queued {
opacity: 0.62;
cursor: pointer;
animation: none;
border: 1px dashed color-mix(in srgb, var(--accent, var(--red)) 55%, transparent);
background: color-mix(in srgb, var(--accent, var(--red)) 8%, var(--input-bg, var(--panel)));
transition: opacity 0.12s ease, border-color 0.12s ease, transform 0.12s ease;
}
.msg-user.msg-user-queued:hover {
opacity: 0.9;
border-color: color-mix(in srgb, var(--accent, var(--red)) 85%, transparent);
transform: translateY(-1px);
}
.msg-user.msg-user-queued .queued-pill {
display: inline-flex;
align-items: center;
gap: 3px;
height: 14px;
padding: 0 5px;
margin-left: 5px;
border-radius: 999px;
border: 1px solid color-mix(in srgb, var(--accent, var(--red)) 45%, transparent);
color: var(--accent, var(--red));
background: color-mix(in srgb, var(--accent, var(--red)) 10%, transparent);
font-size: 8px;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 0.03em;
vertical-align: 1px;
}
.msg-user.msg-user-queued .queued-pill svg {
flex: 0 0 auto;
opacity: 0.9;
}
.msg-ai .body {
color: var(--fg);
}