@ash-qw/dsh-theme-prts 2.1.0 → 2.1.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +16 -4
- package/lib/client.js +93 -27
- package/package.json +1 -1
- package/src/client/custom-background.js +3 -0
- package/src/client/host-geometry-adapter.js +13 -0
- package/src/client/opacity-dial.js +4 -4
- package/src/client/operations-shell-v2.js +37 -8
- package/src/client/theme-controller-v2.js +38 -13
- package/src/styles/custom-background.css +156 -151
- package/src/styles/prts.css +22 -16
|
@@ -1,14 +1,18 @@
|
|
|
1
|
-
/*
|
|
1
|
+
/* Viewport-aligned wallpaper. */
|
|
2
2
|
html[data-dsh-prts] { --prts-background-wash: color-mix(in srgb, var(--prts-canvas) var(--prts-background-shade, 45%), transparent); }
|
|
3
3
|
html[data-dsh-prts][data-prts-background-mode="full"][data-prts-background-full] :is([data-prts-region="frame"], [data-prts-nav-rail]) {
|
|
4
|
-
|
|
4
|
+
background: linear-gradient(var(--prts-background-wash), var(--prts-background-wash)), var(--prts-background-full) center / cover fixed;
|
|
5
5
|
}
|
|
6
6
|
html[data-dsh-prts][data-prts-background-mode="full"][data-prts-background-full] :is([data-prts-region="sessions"], [data-prts-region="operation"]) { background: transparent; }
|
|
7
|
-
html[data-dsh-prts][data-prts-background-mode="split"][data-prts-background-sidebar]
|
|
8
|
-
|
|
7
|
+
html[data-dsh-prts][data-prts-background-mode="split"][data-prts-background-sidebar] {
|
|
8
|
+
--prts-wall-width:max(calc(var(--prts-sidebar-width,280px) + var(--prts-nav-width)),calc((100dvh - var(--prts-host-top-inset)) * var(--prts-sidebar-image-ratio,1)));
|
|
9
|
+
--prts-wall-x:calc((var(--prts-sidebar-width,280px) + var(--prts-nav-width) - var(--prts-wall-width)) / 2);
|
|
10
|
+
& :is([data-prts-region="sessions"],[data-prts-nav-rail]){background:linear-gradient(var(--prts-background-wash),var(--prts-background-wash)),var(--prts-background-sidebar) var(--prts-wall-x) center / var(--prts-wall-width) auto no-repeat}
|
|
11
|
+
& [data-prts-region="sessions"]{background-position:center,calc(var(--prts-wall-x) - var(--prts-nav-width)) center}
|
|
9
12
|
}
|
|
13
|
+
html[data-dsh-prts][data-prts-rail-mode="overlay"]:is([data-prts-background-mode="split"][data-prts-background-sidebar],[data-prts-background-mode="full"][data-prts-background-full]) [data-prts-nav-rail] { background: transparent; }
|
|
10
14
|
html[data-dsh-prts][data-prts-background-mode="split"][data-prts-background-conversation] [data-prts-region="operation"] {
|
|
11
|
-
|
|
15
|
+
background: linear-gradient(var(--prts-background-wash), var(--prts-background-wash)), var(--prts-background-conversation) center / cover no-repeat;
|
|
12
16
|
}
|
|
13
17
|
html[data-dsh-prts][data-prts-background-mode="full"][data-prts-background-full] [data-prts-ambient-layer],
|
|
14
18
|
html[data-dsh-prts][data-prts-background-mode="split"][data-prts-background-conversation] [data-prts-ambient-layer] { display: none !important; }
|
|
@@ -47,9 +51,9 @@ html[data-dsh-prts][data-prts-background-mode="split"][data-prts-background-conv
|
|
|
47
51
|
[data-prts-background-status]:empty { display: none; }
|
|
48
52
|
[data-prts-background-settings] button:focus-visible { outline: 2px solid var(--prts-cyan); outline-offset: 3px; }
|
|
49
53
|
@media (max-width: 600px) {
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
54
|
+
[data-prts-background-modes] button { padding: 8px; }
|
|
55
|
+
[data-prts-background-modes] button small { display: none; }
|
|
56
|
+
[data-prts-background-images] { grid-template-columns: 1fr; }
|
|
53
57
|
}
|
|
54
58
|
[data-prts-background-settings] [hidden] { display: none !important; }
|
|
55
59
|
/* Classic conversation roots keep their native surface unless an image is active. */
|
|
@@ -59,134 +63,135 @@ html[data-dsh-prts][data-prts-background-mode="split"][data-prts-background-conv
|
|
|
59
63
|
html[data-dsh-prts][data-prts-background-mode="full"][data-prts-background-full] [data-prts-region="sessions"] [data-slot="sidebar.workspaces"] span[class$="_fade"],
|
|
60
64
|
html[data-dsh-prts][data-prts-background-mode="split"][data-prts-background-sidebar] [data-prts-region="sessions"] [data-slot="sidebar.workspaces"] span[class$="_fade"] { display: none !important; }
|
|
61
65
|
|
|
62
|
-
/*
|
|
63
|
-
* settings/menus must retain their viewport positioning. The split-mode image
|
|
64
|
-
* stays on the parent so this surface can blur it as well as the full wallpaper. */
|
|
66
|
+
/* Filter the plate, not the ancestor of fixed controls. */
|
|
65
67
|
html[data-dsh-prts][data-prts-background-mode="full"][data-prts-background-full] [data-prts-region="sessions"]::before,
|
|
66
68
|
html[data-dsh-prts][data-prts-background-mode="split"][data-prts-background-sidebar] [data-prts-region="sessions"]::before {
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
}
|
|
77
|
-
/*
|
|
78
|
-
* Raise its actual root so glass never blurs static plugin entries. */
|
|
69
|
+
content: "";
|
|
70
|
+
position: absolute;
|
|
71
|
+
inset: 0;
|
|
72
|
+
z-index: 0;
|
|
73
|
+
pointer-events: none;
|
|
74
|
+
background: color-mix(in srgb, var(--prts-panel) var(--prts-sidebar-opacity, 6%), transparent);
|
|
75
|
+
-webkit-backdrop-filter: blur(var(--prts-sidebar-blur, 8px)) saturate(1.15);
|
|
76
|
+
backdrop-filter: blur(var(--prts-sidebar-blur, 8px)) saturate(1.15);
|
|
77
|
+
box-shadow: inset -1px 0 color-mix(in srgb, var(--prts-ink) 10%, transparent), inset 0 1px rgb(255 255 255 / 8%);
|
|
78
|
+
}
|
|
79
|
+
/* Raise sidebar controls above glass. */
|
|
79
80
|
html[data-dsh-prts][data-prts-background-mode="full"][data-prts-background-full] [data-prts-region="sessions"] [data-slot="sidebar"] > :first-child,
|
|
80
81
|
html[data-dsh-prts][data-prts-background-mode="split"][data-prts-background-sidebar] [data-prts-region="sessions"] [data-slot="sidebar"] > :first-child {
|
|
81
|
-
|
|
82
|
-
|
|
82
|
+
position: relative;
|
|
83
|
+
z-index: 1;
|
|
83
84
|
}
|
|
84
85
|
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
86
|
+
html[data-dsh-prts]:is([data-prts-background-mode="full"][data-prts-background-full],[data-prts-background-mode="split"][data-prts-background-sidebar]) {
|
|
87
|
+
/* Opacity on the parent isolates backdrop sampling during slide-in. */
|
|
88
|
+
&[data-prts-rail-mode="overlay"] [data-prts-nav-rail]{opacity:1;transition:transform 180ms var(--prts-ease-snap),visibility 0s linear 180ms}
|
|
89
|
+
&[data-prts-rail-mode="overlay"][data-prts-rail-open] [data-prts-nav-rail]{transition-delay:0s}
|
|
90
|
+
/* Glass stays below rail controls. */
|
|
91
|
+
& [data-prts-nav-rail]::before {
|
|
92
|
+
content: "";
|
|
93
|
+
position: absolute;
|
|
94
|
+
inset: 0;
|
|
95
|
+
z-index: -1;
|
|
96
|
+
pointer-events: none;
|
|
97
|
+
background: color-mix(in srgb, var(--prts-panel) var(--prts-rail-opacity, 30%), transparent);
|
|
98
|
+
-webkit-backdrop-filter: blur(var(--prts-rail-blur, 12px)) saturate(1.15);
|
|
99
|
+
backdrop-filter: blur(var(--prts-rail-blur, 12px)) saturate(1.15);
|
|
100
|
+
box-shadow: inset -1px 0 color-mix(in srgb, var(--prts-ink) 10%, transparent), inset 0 1px rgb(255 255 255 / 8%);
|
|
97
101
|
}
|
|
98
102
|
|
|
99
103
|
/* Glass rail feedback retains the wallpaper instead of switching to solid black. */
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
+
& [data-prts-nav-rail] button {
|
|
105
|
+
color: var(--prts-muted) !important;
|
|
106
|
+
border-bottom-color: var(--prts-line);
|
|
107
|
+
transition: background-color 140ms ease, box-shadow 140ms ease, color 140ms ease;
|
|
104
108
|
}
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
+
& [data-prts-nav-rail] button:is(:hover, :focus-visible, [aria-expanded="true"]) {
|
|
110
|
+
background: color-mix(in srgb, var(--prts-panel-raised) 32%, transparent);
|
|
111
|
+
color: var(--prts-ink) !important;
|
|
112
|
+
box-shadow: inset 0 1px rgb(255 255 255 / 15%), inset 0 0 0 1px color-mix(in srgb, var(--prts-ink) 10%, transparent);
|
|
109
113
|
}
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
114
|
+
& [data-prts-nav-rail] button:active {
|
|
115
|
+
background: color-mix(in srgb, var(--prts-panel-raised) 48%, transparent);
|
|
116
|
+
box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--prts-ink) 18%, transparent);
|
|
113
117
|
}
|
|
114
118
|
|
|
115
119
|
/* Daylight needs a little contrast, rather than another white highlight. */
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
120
|
+
&[data-prts-scheme="light"] [data-prts-nav-rail] button:is(:hover, :focus-visible, [aria-expanded="true"]) {
|
|
121
|
+
background: color-mix(in srgb, var(--prts-ink) 8%, transparent);
|
|
122
|
+
box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--prts-ink) 16%, transparent);
|
|
119
123
|
}
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
124
|
+
&[data-prts-scheme="light"] [data-prts-nav-rail] button:active {
|
|
125
|
+
background: color-mix(in srgb, var(--prts-ink) 13%, transparent);
|
|
126
|
+
box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--prts-ink) 22%, transparent);
|
|
123
127
|
}
|
|
124
128
|
|
|
125
|
-
/*
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
color: #f3f6f7 !important;
|
|
130
|
-
box-shadow: inset 0 0 0 1px rgb(255 255 255 / 12%);
|
|
129
|
+
/* A dark solid-rail divider is too strong against the daylight wallpaper. */
|
|
130
|
+
&[data-prts-scheme="light"] [data-prts-nav-rail] {
|
|
131
|
+
border-right-color: color-mix(in srgb, var(--prts-ink) 10%, transparent);
|
|
132
|
+
box-shadow: none;
|
|
131
133
|
}
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
color: #f3f6f7 !important;
|
|
135
|
-
box-shadow: inset 0 0 0 1px rgb(255 255 255 / 20%);
|
|
134
|
+
&[data-prts-scheme="light"] [data-prts-nav-rail]::before {
|
|
135
|
+
box-shadow: inset 0 1px rgb(255 255 255 / 8%);
|
|
136
136
|
}
|
|
137
137
|
|
|
138
|
-
/* A dark solid-rail divider is too strong against the daylight wallpaper. */
|
|
139
|
-
html[data-dsh-prts][data-prts-scheme="light"][data-prts-background-mode="full"][data-prts-background-full] [data-prts-nav-rail] {
|
|
140
|
-
border-right-color: color-mix(in srgb, var(--prts-ink) 10%, transparent);
|
|
141
|
-
box-shadow: none;
|
|
142
138
|
}
|
|
143
|
-
|
|
144
|
-
|
|
139
|
+
/* The solid rail stays dark in both schemes; use the same light feedback
|
|
140
|
+
* instead of the conversation palette's light-mode ink/surface colors. */
|
|
141
|
+
html[data-dsh-prts]:not([data-prts-background-mode="full"][data-prts-background-full],[data-prts-background-mode="split"][data-prts-background-sidebar]) [data-prts-nav-rail] button:is(:hover, :focus-visible, [aria-expanded="true"]) {
|
|
142
|
+
background: rgb(255 255 255 / 8%);
|
|
143
|
+
color: #f3f6f7 !important;
|
|
144
|
+
box-shadow: inset 0 0 0 1px rgb(255 255 255 / 12%);
|
|
145
|
+
}
|
|
146
|
+
html[data-dsh-prts]:not([data-prts-background-mode="full"][data-prts-background-full],[data-prts-background-mode="split"][data-prts-background-sidebar]) [data-prts-nav-rail] button:active {
|
|
147
|
+
background: rgb(255 255 255 / 14%);
|
|
148
|
+
color: #f3f6f7 !important;
|
|
149
|
+
box-shadow: inset 0 0 0 1px rgb(255 255 255 / 20%);
|
|
145
150
|
}
|
|
146
151
|
|
|
147
152
|
/* Baker keeps its game palette; only a real conversation wallpaper enables glass. */
|
|
148
153
|
html[data-dsh-prts][data-prts-conversation-style="deck-chat"]:is(
|
|
149
|
-
|
|
150
|
-
|
|
154
|
+
[data-prts-background-mode="full"][data-prts-background-full],
|
|
155
|
+
[data-prts-background-mode="split"][data-prts-background-conversation]
|
|
151
156
|
) {
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
157
|
+
--prts-chat-user-surface: rgb(239 239 237 / var(--prts-baker-opacity, 50%));
|
|
158
|
+
--prts-chat-assistant-surface: rgb(69 70 68 / var(--prts-baker-opacity, 50%));
|
|
159
|
+
&[data-prts-scheme="light"] {
|
|
160
|
+
--prts-chat-user-surface: rgb(255 255 255 / var(--prts-baker-opacity, 50%));
|
|
161
|
+
--prts-chat-assistant-surface: rgb(223 227 223 / var(--prts-baker-opacity, 50%));
|
|
162
|
+
}
|
|
163
|
+
& :is([data-chat-flow-kind="user"], [data-submission-echo]:not([data-pending-steering])) [class$="_bubble"],
|
|
164
|
+
& :is([data-prts-ai-surface], [data-message-role="user"], [data-message-role="assistant"]),
|
|
165
|
+
& [data-chat-flow-kind="assistant-step"]:not([data-chat-group-part="reasoning"]) [class$="_body"]:has(:is([data-markdown], [data-slot*="markdown" i], .markdown-body)) {
|
|
166
|
+
-webkit-backdrop-filter: blur(var(--prts-baker-blur, 8px)) saturate(1.08);
|
|
167
|
+
backdrop-filter: blur(var(--prts-baker-blur, 8px)) saturate(1.08);
|
|
168
|
+
}
|
|
169
|
+
& [data-prts-ai-surface]::before,
|
|
170
|
+
& [data-message-role="assistant"]::after,
|
|
171
|
+
& :is([data-chat-flow-kind="user"], [data-submission-echo]:not([data-pending-steering])) [class$="_bubble"]::before,
|
|
172
|
+
& [data-message-role="user"]::before {
|
|
173
|
+
-webkit-backdrop-filter: blur(var(--prts-baker-blur, 8px)) saturate(1.08);
|
|
174
|
+
backdrop-filter: blur(var(--prts-baker-blur, 8px)) saturate(1.08);
|
|
175
|
+
}
|
|
171
176
|
}
|
|
172
177
|
|
|
173
178
|
/* Classic user messages share the wallpaper translucency controls with Baker bubbles. */
|
|
174
179
|
html[data-dsh-prts][data-prts-conversation-style="native"]:is(
|
|
175
|
-
|
|
176
|
-
|
|
180
|
+
[data-prts-background-mode="full"][data-prts-background-full],
|
|
181
|
+
[data-prts-background-mode="split"][data-prts-background-conversation]
|
|
177
182
|
) {
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
183
|
+
& [data-message-role="user"],
|
|
184
|
+
& :is([data-chat-flow-kind="user"], [data-submission-echo]:not([data-pending-steering])) [class$="_bubble"] {
|
|
185
|
+
background: rgb(23 29 33 / var(--prts-classic-user-opacity, 50%)) !important;
|
|
186
|
+
-webkit-backdrop-filter: blur(var(--prts-classic-user-blur, 8px)) saturate(1.08);
|
|
187
|
+
backdrop-filter: blur(var(--prts-classic-user-blur, 8px)) saturate(1.08);
|
|
188
|
+
}
|
|
189
|
+
&[data-prts-scheme="light"] {
|
|
190
|
+
& [data-message-role="user"],
|
|
191
|
+
& :is([data-chat-flow-kind="user"], [data-submission-echo]:not([data-pending-steering])) [class$="_bubble"] {
|
|
192
|
+
background: rgb(229 234 237 / var(--prts-classic-user-opacity, 50%)) !important;
|
|
193
|
+
}
|
|
194
|
+
}
|
|
190
195
|
}
|
|
191
196
|
|
|
192
197
|
[data-prts-opacity-settings] { min-width: 0; max-width: 420px; margin: 0; padding: 14px 0 0; border: 0; border-top: 1px solid var(--prts-line); }
|
|
@@ -233,15 +238,15 @@ html[data-prts-motion="reduced"] [data-prts-opacity-dial] [data-dial-tail] { dis
|
|
|
233
238
|
|
|
234
239
|
/* Match the two peer modules without boxing one of them in a second surface. */
|
|
235
240
|
html[data-dsh-prts] [data-prts-theme-settings] [data-prts-settings-section="appearance"] > section {
|
|
236
|
-
|
|
237
|
-
|
|
238
|
-
|
|
239
|
-
|
|
241
|
+
padding: 0;
|
|
242
|
+
border: 0;
|
|
243
|
+
border-radius: 0;
|
|
244
|
+
background: transparent;
|
|
240
245
|
}
|
|
241
246
|
html[data-dsh-prts] [data-prts-theme-settings] [data-prts-background-settings] {
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
|
|
247
|
+
margin-top: 24px;
|
|
248
|
+
padding-top: 12px;
|
|
249
|
+
border-top: 1px solid var(--prts-line);
|
|
245
250
|
}
|
|
246
251
|
/* SVG outlines are rectangular in Chromium. Draw keyboard focus inside the ring. */
|
|
247
252
|
html[data-dsh-prts] [data-prts-theme-settings] [data-prts-opacity-dial] svg:focus { outline: none !important; box-shadow: none; }
|
|
@@ -249,16 +254,16 @@ html[data-dsh-prts] [data-prts-theme-settings] [data-prts-opacity-dial] svg:focu
|
|
|
249
254
|
[data-prts-opacity-dial] svg:focus-visible [data-dial-focus] { opacity: .8; }
|
|
250
255
|
[data-prts-opacity-control][data-dragging] [data-dial-focus] { opacity: 0; }
|
|
251
256
|
[data-prts-material-preview] {
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
|
|
257
|
-
|
|
258
|
-
|
|
259
|
-
|
|
260
|
-
}
|
|
261
|
-
html[data-prts-background-mode="split"] [data-prts-material-preview="sidebarOpacity"] { background-image: var(--prts-background-sidebar, linear-gradient(135deg, #8bb6c2, #c7b69c)); }
|
|
257
|
+
position: relative;
|
|
258
|
+
width: 100%;
|
|
259
|
+
height: 104px;
|
|
260
|
+
overflow: hidden;
|
|
261
|
+
border: 1px solid var(--prts-line);
|
|
262
|
+
border-radius: 6px;
|
|
263
|
+
background: var(--prts-background-full, linear-gradient(135deg, #8bb6c2, #c7b69c)) center / cover;
|
|
264
|
+
--prts-preview-surface: var(--prts-panel);
|
|
265
|
+
}
|
|
266
|
+
html[data-prts-background-mode="split"] :is([data-prts-material-preview="sidebarOpacity"],[data-prts-material-preview="railOpacity"]) { background-image: var(--prts-background-sidebar, linear-gradient(135deg, #8bb6c2, #c7b69c)); }
|
|
262
267
|
html[data-prts-background-mode="split"] [data-prts-material-preview="bakerOpacity"] { background-image: var(--prts-background-conversation, linear-gradient(135deg, #8bb6c2, #c7b69c)); }
|
|
263
268
|
html[data-prts-background-mode="split"] [data-prts-material-preview="classicUserOpacity"] { background-image: var(--prts-background-conversation, linear-gradient(135deg, #8bb6c2, #c7b69c)); }
|
|
264
269
|
[data-prts-material-preview]::before { content: ""; position: absolute; inset: 0; background: var(--prts-background-wash); }
|
|
@@ -271,9 +276,9 @@ html[data-prts-scheme="light"] [data-prts-material-preview="bakerOpacity"] [data
|
|
|
271
276
|
[data-prts-material-preview="classicUserOpacity"] [data-prts-material-preview-surface] { inset: 16px 10px; border-left: 3px solid var(--prts-yellow); border-radius: var(--prts-radius-card); background: rgb(23 29 33 / var(--prts-classic-user-opacity, 50%)); backdrop-filter: blur(var(--prts-classic-user-blur, 8px)) saturate(1.08); }
|
|
272
277
|
html[data-prts-scheme="light"] [data-prts-material-preview="classicUserOpacity"] [data-prts-material-preview-surface] { background: rgb(229 234 237 / var(--prts-classic-user-opacity, 50%)); }
|
|
273
278
|
@media (max-width: 560px) {
|
|
274
|
-
|
|
275
|
-
|
|
276
|
-
|
|
279
|
+
[data-prts-opacity-control] { column-gap: 10px; }
|
|
280
|
+
[data-prts-opacity-heading] { gap: 6px; }
|
|
281
|
+
[data-prts-opacity-dial] { width: 88px; }
|
|
277
282
|
}
|
|
278
283
|
|
|
279
284
|
/* Backgrounds now have their own settings page. */
|
|
@@ -284,43 +289,43 @@ html[data-dsh-prts] [data-prts-settings-section="background"] [data-prts-backgro
|
|
|
284
289
|
[data-prts-composer-glass-required] { font-size: 12px; color: var(--prts-muted); }
|
|
285
290
|
|
|
286
291
|
/* The native active composer fades into DSH's base color. Baker paints a
|
|
287
|
-
|
|
292
|
+
* different solid backdrop, so match that backdrop while keeping the fade. */
|
|
288
293
|
html[data-dsh-prts][data-prts-conversation-style="deck-chat"][data-prts-background-mode="off"] [data-phase="active"] [data-composer-seat]:not(:has([data-prts-composer-glass-active])) {
|
|
289
|
-
|
|
294
|
+
background: linear-gradient(180deg, transparent 0, var(--prts-chat-dock-surface, var(--prts-chat-backdrop)) 36px) !important;
|
|
290
295
|
}
|
|
291
296
|
html[data-dsh-prts][data-prts-conversation-style="deck-chat"][data-prts-background-mode="off"][data-prts-texture="restrained"] {
|
|
292
|
-
|
|
297
|
+
--prts-chat-dock-surface: color-mix(in srgb, var(--prts-chat-backdrop) 82%, var(--prts-canvas));
|
|
293
298
|
}
|
|
294
299
|
html[data-dsh-prts][data-prts-conversation-style="deck-chat"][data-prts-background-mode="off"][data-prts-texture="off"] {
|
|
295
|
-
|
|
300
|
+
--prts-chat-dock-surface: color-mix(in srgb, var(--prts-chat-backdrop) 72%, var(--prts-canvas));
|
|
296
301
|
}
|
|
297
302
|
|
|
298
303
|
/* Native data-streaming disappears for settled and interrupted responses.
|
|
299
|
-
|
|
304
|
+
* Hide only the current response body, never reasoning, tools or earlier rounds. */
|
|
300
305
|
html[data-dsh-prts][data-prts-conversation-style="deck-chat"][data-prts-baker-loading]
|
|
301
306
|
[data-chat-flow-kind="assistant-step"]:not([data-chat-group-part="reasoning"])
|
|
302
307
|
[data-streaming] > :is([data-prts-ai-surface], [class$="_body"]) {
|
|
303
|
-
|
|
304
|
-
|
|
305
|
-
|
|
306
|
-
|
|
307
|
-
|
|
308
|
-
|
|
309
|
-
|
|
310
|
-
|
|
311
|
-
|
|
312
|
-
|
|
313
|
-
|
|
314
|
-
|
|
315
|
-
|
|
316
|
-
|
|
317
|
-
|
|
318
|
-
|
|
319
|
-
|
|
320
|
-
|
|
308
|
+
min-width: 78px;
|
|
309
|
+
width: 78px !important;
|
|
310
|
+
min-height: 42px;
|
|
311
|
+
box-sizing: border-box;
|
|
312
|
+
display: flex;
|
|
313
|
+
align-items: center;
|
|
314
|
+
justify-content: center;
|
|
315
|
+
padding: 12px 18px !important;
|
|
316
|
+
& > * { display: none !important; }
|
|
317
|
+
&::after {
|
|
318
|
+
content: "正在生成回复";
|
|
319
|
+
font-size: 0;
|
|
320
|
+
display: block;
|
|
321
|
+
width: 4px;
|
|
322
|
+
height: 4px;
|
|
323
|
+
border-radius: 1px;
|
|
324
|
+
animation: prts-baker-typing 1.2s linear infinite;
|
|
325
|
+
}
|
|
321
326
|
}
|
|
322
327
|
@keyframes prts-baker-typing {
|
|
323
|
-
|
|
324
|
-
|
|
325
|
-
|
|
328
|
+
0%, 100% { background: color-mix(in srgb,currentColor 30%,transparent); box-shadow: -10px 0 0 currentColor, 10px 0 0 color-mix(in srgb,currentColor 30%,transparent); }
|
|
329
|
+
33% { background: currentColor; box-shadow: -10px 0 0 color-mix(in srgb,currentColor 30%,transparent), 10px 0 0 color-mix(in srgb,currentColor 30%,transparent); }
|
|
330
|
+
66% { background: color-mix(in srgb,currentColor 30%,transparent); box-shadow: -10px 0 0 color-mix(in srgb,currentColor 30%,transparent), 10px 0 0 currentColor; }
|
|
326
331
|
}
|
package/src/styles/prts.css
CHANGED
|
@@ -1340,20 +1340,26 @@ html[data-dsh-prts][data-prts-conversation-style="deck-chat"] :is(
|
|
|
1340
1340
|
color: var(--prts-ink) !important;
|
|
1341
1341
|
}
|
|
1342
1342
|
|
|
1343
|
-
/*
|
|
1343
|
+
/* Baker code cards and tables. */
|
|
1344
1344
|
html[data-dsh-prts][data-prts-conversation-style="deck-chat"] :is(
|
|
1345
|
-
|
|
1346
|
-
|
|
1345
|
+
[data-prts-ai-surface], [data-message-role="assistant"], [data-message-role="user"],
|
|
1346
|
+
:is([data-chat-flow-kind="user"], [data-submission-echo]:not([data-pending-steering])) [class$="_bubble"]
|
|
1347
1347
|
) {
|
|
1348
|
-
|
|
1349
|
-
|
|
1350
|
-
|
|
1351
|
-
|
|
1352
|
-
|
|
1353
|
-
|
|
1354
|
-
|
|
1355
|
-
|
|
1356
|
-
|
|
1348
|
+
/* Clip preserves header stickiness. */
|
|
1349
|
+
& :has(>[data-code-block-content]){
|
|
1350
|
+
box-sizing:border-box;max-width:100%;border:1px solid var(--prts-line);border-left:3px solid var(--prts-cyan);border-radius:12px;overflow:clip;
|
|
1351
|
+
& [data-code-block-banner]{border-radius:11px 11px 0 0;background:color-mix(in srgb,var(--prts-ink) 7%,var(--prts-canvas));border-bottom:1px solid var(--prts-line)}
|
|
1352
|
+
&>[data-code-block-content] pre{box-sizing:border-box;width:100%;border:0!important;border-radius:0 0 11px 11px;margin:0!important}
|
|
1353
|
+
}
|
|
1354
|
+
& :is(th,td){padding-inline:14px!important}
|
|
1355
|
+
& :is(.md-table-wide,[class*="_tableScroll_"]){
|
|
1356
|
+
box-sizing:border-box;width:100%;max-width:100%;min-width:0;
|
|
1357
|
+
margin-inline:0!important;padding:0!important;overflow:auto;
|
|
1358
|
+
border:1px solid color-mix(in srgb,var(--prts-cyan) 24%,var(--prts-line));
|
|
1359
|
+
border-radius:10px;corner-shape:round;
|
|
1360
|
+
background:color-mix(in srgb,var(--prts-canvas) 88%,transparent);
|
|
1361
|
+
& > table{border:0;background:transparent;margin:0;width:100%}
|
|
1362
|
+
}
|
|
1357
1363
|
}
|
|
1358
1364
|
|
|
1359
1365
|
/* Group process avatars without changing reply alignment or final-answer avatars. */
|
|
@@ -1361,10 +1367,10 @@ html[data-dsh-prts][data-prts-conversation-style="deck-chat"] [data-prts-avatar-
|
|
|
1361
1367
|
|
|
1362
1368
|
/* Baker quote surfaces; classic prose retains the host styling. */
|
|
1363
1369
|
html[data-dsh-prts][data-prts-conversation-style="deck-chat"] :is([data-chat-flow-kind],[data-message-role],[data-prts-ai-surface],[data-submission-echo]) blockquote {
|
|
1364
|
-
|
|
1365
|
-
|
|
1366
|
-
|
|
1367
|
-
|
|
1370
|
+
border-radius:10px;corner-shape:round;padding:8px 14px;
|
|
1371
|
+
border-inline-start:3px solid var(--prts-cyan)!important;
|
|
1372
|
+
& > :first-child{margin-top:0}
|
|
1373
|
+
& > :last-child{margin-bottom:0}
|
|
1368
1374
|
}
|
|
1369
1375
|
|
|
1370
1376
|
html[data-dsh-prts] [aria-invalid="true"],
|