@stainless-api/docs-ui 0.1.0-beta.2 → 0.1.0-beta.20

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.
Files changed (57) hide show
  1. package/dist/index.js +1312 -1871
  2. package/dist/mcp.cjs +983441 -0
  3. package/dist/routing.js +4 -4
  4. package/dist/styles/main.css +743 -747
  5. package/dist/styles/primitives.css +444 -426
  6. package/dist/styles/resets.css +33 -41
  7. package/dist/styles/search.css +265 -248
  8. package/dist/styles/sidebar.css +58 -60
  9. package/dist/styles/snippets.css +86 -88
  10. package/dist/styles/variables.css +85 -89
  11. package/package.json +19 -10
  12. package/src/components/breadcrumbs.tsx +1 -1
  13. package/src/components/chat.tsx +18 -15
  14. package/src/components/method.tsx +12 -11
  15. package/src/components/overview.tsx +32 -19
  16. package/src/components/primitives.tsx +36 -19
  17. package/src/components/properties.tsx +4 -2
  18. package/src/components/scripts/dropdown.ts +1 -1
  19. package/src/components/sdk.tsx +28 -22
  20. package/src/components/sidebar.tsx +3 -3
  21. package/src/components/snippets.tsx +29 -11
  22. package/src/contexts/component-generics.tsx +10 -15
  23. package/src/contexts/docs.tsx +15 -4
  24. package/src/contexts/index.tsx +8 -5
  25. package/src/contexts/markdown.tsx +7 -6
  26. package/src/contexts/search.tsx +4 -5
  27. package/src/hooks/use-strict-context.tsx +16 -0
  28. package/src/languages/go.tsx +3 -3
  29. package/src/languages/http.tsx +31 -23
  30. package/src/languages/index.ts +7 -7
  31. package/src/languages/java.tsx +4 -4
  32. package/src/languages/python.tsx +12 -9
  33. package/src/languages/ruby.tsx +20 -13
  34. package/src/languages/typescript.tsx +18 -12
  35. package/src/markdown/index.ts +17 -12
  36. package/src/markdown/utils.ts +6 -3
  37. package/src/routing.ts +9 -9
  38. package/src/search/form.tsx +11 -8
  39. package/src/search/indexer.ts +17 -15
  40. package/src/search/mcp.ts +108 -16
  41. package/src/search/printer.tsx +1 -1
  42. package/src/search/providers/algolia.ts +5 -5
  43. package/src/search/providers/fuse.ts +4 -4
  44. package/src/search/providers/pagefind.ts +1 -1
  45. package/src/search/providers/walker.ts +5 -3
  46. package/src/search/results.tsx +9 -7
  47. package/src/search/types.ts +2 -2
  48. package/src/style.ts +1 -1
  49. package/src/styles/main.css +743 -747
  50. package/src/styles/primitives.css +444 -426
  51. package/src/styles/resets.css +33 -41
  52. package/src/styles/search.css +265 -248
  53. package/src/styles/sidebar.css +58 -60
  54. package/src/styles/snippets.css +86 -88
  55. package/src/styles/variables.css +85 -89
  56. package/src/utils.ts +14 -15
  57. package/dist/mcp.js +0 -16003
package/dist/styles/main.css CHANGED
@@ -1,990 +1,986 @@
1
- @layer docs-ui {
2
- /* Overview page content */
3
- .stldocs-root .stldocs-overview {
4
- .stldocs-overview-header {
5
- padding: var(--stldocs-title-padding-y) var(--stldocs-content-padding) var(--stldocs-content-padding);
1
+ /* Overview page content */
2
+ .stldocs-root .stldocs-overview {
3
+ .stldocs-overview-header {
4
+ padding: var(--stldocs-title-padding-y) 0;
6
5
 
7
- & > * {
8
- max-width: var(--stldocs-content-width);
9
- margin: auto 0;
10
- }
6
+ & > * {
7
+ max-width: var(--stldocs-content-width);
8
+ margin: auto 0;
9
+ }
11
10
 
12
- .stldocs-overview-header-info {
13
- margin-top: 16px;
14
- height: 40px;
15
- display: flex;
16
- align-items: center;
11
+ .stldocs-overview-header-info {
12
+ margin-top: 16px;
13
+ height: 40px;
14
+ display: flex;
15
+ align-items: center;
17
16
 
18
- .stldocs-overview-header-info-timestamp {
19
- font-size: var(--stldocs-font-size-small);
20
- color: var(--stldocs-color-text);
21
- opacity: 50%;
22
- }
17
+ .stldocs-overview-header-info-timestamp {
18
+ font-size: var(--stldocs-font-size-small);
19
+ color: var(--stldocs-color-text);
20
+ opacity: 50%;
23
21
  }
24
22
  }
23
+ }
25
24
 
26
- .stldocs-resource {
27
- padding: 2rem 0;
28
-
29
- .stldocs-resource-content {
30
- max-width: var(--stldocs-content-width);
31
- padding: 0 calc(var(--stldocs-content-padding));
32
- margin: auto 0;
33
- }
25
+ .stldocs-resource {
26
+ padding: 2rem 0;
34
27
 
35
- .stldocs-resource-header {
36
- display: flex;
37
- flex-direction: column;
38
- gap: 16px;
39
- opacity: 85%;
40
-
41
- .stldocs-resource-title {
42
- .stldocs-icon {
43
- margin-left: 8px;
44
- color: var(--stldocs-color-text-tertiary);
45
- vertical-align: middle;
46
- display: inline;
47
- height: 1rem;
48
- }
28
+ .stldocs-resource-content {
29
+ max-width: var(--stldocs-content-width);
30
+ margin: auto 0;
31
+ }
49
32
 
50
- .stldocs-resource-title-segment {
51
- margin-right: 8px;
52
- color: var(--stldocs-color-text);
33
+ .stldocs-resource-header {
34
+ display: flex;
35
+ flex-direction: column;
36
+ gap: 16px;
37
+ opacity: 85%;
53
38
 
54
- &:not(:last-child) {
55
- color: var(--stldocs-color-text-secondary);
56
- font-weight: 400;
57
- }
58
- }
39
+ .stldocs-resource-title {
40
+ .stldocs-icon {
41
+ margin-left: 8px;
42
+ color: var(--stldocs-color-text-tertiary);
43
+ vertical-align: middle;
44
+ display: inline;
45
+ height: 1rem;
59
46
  }
60
47
 
61
- .stldocs-resource-name {
62
- font-family: var(--stldocs-font-mono);
48
+ .stldocs-resource-title-segment {
49
+ margin-right: 8px;
63
50
  color: var(--stldocs-color-text);
64
- }
65
51
 
66
- .stldocs-resource-description {
67
- font-size: var(--stldocs-font-size-body);
68
- color: var(--stldocs-color-text-secondary);
69
- line-height: 150%;
52
+ &:not(:last-child) {
53
+ color: var(--stldocs-color-text-secondary);
54
+ font-weight: 400;
55
+ }
70
56
  }
71
57
  }
72
58
 
73
- .stldocs-resource-content {
74
- .stldocs-resource-content-group {
59
+ .stldocs-resource-name {
60
+ font-family: var(--stldocs-font-mono);
61
+ color: var(--stldocs-color-text);
62
+ }
63
+
64
+ .stldocs-resource-description {
65
+ font-size: var(--stldocs-font-size-body);
66
+ color: var(--stldocs-color-text-secondary);
67
+ line-height: 150%;
68
+ }
69
+ }
70
+
71
+ .stldocs-resource-content {
72
+ .stldocs-resource-content-group {
73
+ display: flex;
74
+ flex-direction: column;
75
+
76
+ .stldocs-resource-content-group-model-title {
77
+ padding-top: var(--stldocs-content-padding);
78
+ color: var(--stldocs-color-text-tertiary);
79
+ font-weight: normal;
80
+ font-size: 1rem;
81
+ padding-bottom: 0.5rem;
75
82
  display: flex;
76
- flex-direction: column;
77
-
78
- .stldocs-resource-content-group-model-title {
79
- padding-top: var(--stldocs-content-padding);
80
- color: var(--stldocs-color-text-tertiary);
81
- font-weight: normal;
82
- font-size: 1rem;
83
- padding-bottom: 0.5rem;
84
- display: flex;
85
- }
83
+ }
86
84
 
87
- .stldocs-resource-content-group-name {
88
- color: var(--stldocs-color-text-muted);
89
- }
85
+ .stldocs-resource-content-group-name {
86
+ color: var(--stldocs-color-text-muted);
87
+ }
90
88
 
91
- .stldocs-resource-content-properties {
92
- margin-left: calc(-1 * var(--stldocs-expander-margin-shift));
93
- }
89
+ .stldocs-resource-content-properties {
90
+ margin-left: calc(-1 * var(--stldocs-expander-margin-shift));
94
91
  }
95
92
  }
96
93
  }
94
+ }
97
95
 
98
- > .stldocs-resource:nth-child(2) {
99
- padding-top: 0;
100
- }
96
+ > .stldocs-resource:nth-child(2) {
97
+ padding-top: 0;
101
98
  }
99
+ }
102
100
 
103
- /* Overview page method summary */
104
- .stldocs-root .stldocs-overview .stldocs-method-summary {
105
- padding: var(--stldocs-content-padding) 0;
101
+ /* Overview page method summary */
102
+ .stldocs-root .stldocs-overview .stldocs-method-summary {
103
+ padding: var(--stldocs-content-padding) 0;
106
104
 
107
- .stldocs-method-header {
108
- display: flex;
109
- flex-direction: column;
110
- gap: 4px;
105
+ .stldocs-method-header {
106
+ display: flex;
107
+ flex-direction: column;
108
+ gap: 4px;
111
109
 
112
- .stldocs-method-title {
113
- margin-bottom: 2px;
110
+ .stldocs-method-title {
111
+ margin-bottom: 2px;
114
112
 
115
- a:hover {
116
- text-decoration: underline;
117
- }
113
+ a:hover {
114
+ text-decoration: underline;
118
115
  }
116
+ }
119
117
 
120
- .stldocs-method-route {
121
- padding-top: 4px;
122
- }
118
+ .stldocs-method-route {
119
+ padding-top: 4px;
123
120
  }
121
+ }
124
122
 
125
- .stldocs-method-signature {
126
- max-width: var(--stldocs-content-width);
127
- font-family: var(--stldocs-font-mono);
128
- font-size: var(--stldocs-font-size-body);
129
- color: var(--stldocs-color-text-tertiary);
130
- white-space: pre-wrap;
131
- word-wrap: break-word;
132
- overflow: hidden;
133
- text-overflow: ellipsis;
134
- line-height: 1.5rem;
123
+ .stldocs-method-signature {
124
+ max-width: var(--stldocs-content-width);
125
+ font-family: var(--stldocs-font-mono);
126
+ font-size: var(--stldocs-font-size-body);
127
+ color: var(--stldocs-color-text-tertiary);
128
+ white-space: pre-wrap;
129
+ word-wrap: break-word;
130
+ overflow: hidden;
131
+ text-overflow: ellipsis;
132
+ line-height: 1.5rem;
133
+
134
+ .stldocs-signature-qualified {
135
+ color: var(--stldocs-color-text-secondary);
136
+ font-weight: 400;
137
+ }
135
138
 
136
- .stldocs-signature-qualified {
137
- color: var(--stldocs-color-text-secondary);
138
- font-weight: 400;
139
- }
139
+ .stldocs-signature-name {
140
+ color: var(--stldocs-color-text);
141
+ font-weight: 600;
142
+ }
140
143
 
141
- .stldocs-signature-name {
144
+ .stldoc-signature-params {
145
+ .stldocs-text-identifier {
142
146
  color: var(--stldocs-color-text);
143
- font-weight: 600;
144
- }
145
-
146
- .stldoc-signature-params {
147
- .stldocs-text-identifier {
148
- color: var(--stldocs-color-text);
149
- }
150
147
  }
148
+ }
151
149
 
152
- .stldocs-type {
153
- color: var(--stldocs-color-text);
154
- }
150
+ .stldocs-type {
151
+ color: var(--stldocs-color-text);
152
+ }
155
153
 
156
- .stldocs-type-preview[data-stldocs-type-preview='properties'] {
157
- display: none;
158
- }
154
+ .stldocs-type-preview[data-stldocs-type-preview='properties'] {
155
+ display: none;
159
156
  }
157
+ }
160
158
 
161
- .stldocs-method-description {
162
- color: var(--stldocs-color-text-muted);
163
- height: 1.7rem;
164
- overflow-y: hidden;
165
- line-height: 1.7rem;
166
- padding-bottom: var(--stldocs-content-padding);
159
+ .stldocs-method-description {
160
+ color: var(--stldocs-color-text-muted);
161
+ height: 1.7rem;
162
+ overflow-y: hidden;
163
+ line-height: 1.7rem;
164
+ padding-bottom: var(--stldocs-content-padding);
167
165
 
168
- .stldocs-content > * {
169
- white-space: nowrap;
170
- overflow-x: hidden;
171
- text-overflow: ellipsis;
172
- }
166
+ .stldocs-content > * {
167
+ white-space: nowrap;
168
+ overflow-x: hidden;
169
+ text-overflow: ellipsis;
173
170
  }
174
171
  }
172
+ }
175
173
 
176
- /* Method route rendering is shared between method previews and pages */
177
- .stldocs-root .stldocs-method-header .stldocs-method-route {
174
+ /* Method route rendering is shared between method previews and pages */
175
+ .stldocs-root .stldocs-method-header .stldocs-method-route {
176
+ display: flex;
177
+ gap: 4px;
178
+ padding: 0;
179
+
180
+ .stldocs-method-route-endpoint {
181
+ font-family: var(--stldocs-font-mono);
182
+ font-size: var(--stldocs-font-size-body);
183
+ color: var(--stldocs-color-text-tertiary);
184
+ align-content: center;
185
+ line-height: 120%;
186
+ overflow: hidden;
187
+ text-overflow: ellipsis;
188
+ white-space: nowrap;
189
+ }
190
+ }
191
+
192
+ .stldocs-root {
193
+ .stldocs-method-route-httpmethod {
178
194
  display: flex;
179
195
  gap: 4px;
180
- padding: 0;
196
+ padding: 4px 8px 4px 4px;
197
+ text-transform: uppercase;
198
+ border-radius: 4px;
199
+ font-size: var(--stldocs-font-size-body-xs);
200
+ line-height: 100%;
201
+ align-content: center;
202
+ font-weight: 600;
203
+ align-items: center;
204
+ justify-content: center;
181
205
 
182
- .stldocs-method-route-endpoint {
183
- font-family: var(--stldocs-font-mono);
184
- font-size: var(--stldocs-font-size-body);
185
- color: var(--stldocs-color-text-tertiary);
186
- align-content: center;
187
- line-height: 120%;
188
- overflow-x: hidden;
189
- text-overflow: ellipsis;
206
+ .stldocs-icon {
207
+ max-width: unset;
208
+ stroke-width: 3px;
209
+ }
210
+
211
+ &.stldocs-method-route-httpmethod-icon-only {
212
+ padding: 4px;
190
213
  }
191
214
  }
215
+ }
192
216
 
193
- .stldocs-root {
194
- .stldocs-method-route-httpmethod {
195
- display: flex;
196
- gap: 4px;
197
- padding: 4px 8px 4px 4px;
198
- text-transform: uppercase;
199
- border-radius: 4px;
200
- font-size: var(--stldocs-font-size-body-xs);
201
- line-height: 100%;
202
- align-content: center;
203
- font-weight: 600;
204
- align-items: center;
205
- justify-content: center;
217
+ /* Models and properties */
218
+ .stldocs-root .stldocs-property,
219
+ .stldocs-root .stldocs-model {
220
+ display: flex;
221
+ flex-direction: column;
222
+ gap: 0.8rem;
223
+ padding: 0.5rem 0;
206
224
 
207
- .stldocs-icon {
208
- max-width: unset;
209
- stroke-width: 3px;
210
- }
225
+ .stldocs-expander-summary-content {
226
+ width: 100%;
227
+ }
211
228
 
212
- &.stldocs-method-route-httpmethod-icon-only {
213
- padding: 4px;
214
- }
215
- }
229
+ .stldocs-property-header {
230
+ align-items: first baseline;
231
+ display: flex;
232
+ gap: 0.5rem;
233
+ flex-wrap: wrap;
216
234
  }
217
235
 
218
- /* Models and properties */
219
- .stldocs-root .stldocs-property,
220
- .stldocs-root .stldocs-model {
236
+ .stldocs-property-info {
221
237
  display: flex;
222
238
  flex-direction: column;
223
- gap: 0.8rem;
224
- padding: 0.5rem 0;
225
239
 
226
- .stldocs-expander-summary-content {
227
- width: 100%;
228
- }
229
-
230
- .stldocs-property-header {
231
- align-items: first baseline;
232
- display: flex;
233
- gap: 0.5rem;
234
- flex-wrap: wrap;
240
+ & > .stldocs-property-type > .stldocs-text-identifier {
241
+ color: var(--stldocs-color-text);
235
242
  }
243
+ }
236
244
 
237
- .stldocs-property-info {
238
- display: flex;
239
- flex-direction: column;
245
+ .stldocs-property-type {
246
+ font-family: var(--stldocs-font-mono);
247
+ color: var(--stldocs-color-text-muted);
248
+ }
240
249
 
241
- & > .stldocs-property-type > .stldocs-text-identifier {
242
- color: var(--stldocs-color-text);
243
- }
250
+ .stldocs-property-type,
251
+ .stldocs-property-declaration {
252
+ .stldocs-type-preview[data-stldocs-type-preview='union']
253
+ .stldocs-type-preview[data-stldocs-type-preview='properties'] {
254
+ display: none;
244
255
  }
256
+ }
245
257
 
246
- .stldocs-property-type {
247
- font-family: var(--stldocs-font-mono);
248
- color: var(--stldocs-color-text-muted);
249
- }
258
+ .stldocs-property-deprecated {
259
+ font-family: var(--stldocs-font);
260
+ color: var(--stldocs-color-red);
261
+ font-size: var(--stldocs-font-size-body);
262
+ font-weight: 600;
263
+ }
250
264
 
251
- .stldocs-property-type,
252
- .stldocs-property-declaration {
253
- .stldocs-type-preview[data-stldocs-type-preview='union']
254
- .stldocs-type-preview[data-stldocs-type-preview='properties'] {
255
- display: none;
256
- }
257
- }
265
+ .stldocs-property-deprecated-message {
266
+ color: var(--stldocs-color-red);
267
+ font-size: var(--stldocs-font-size-small);
268
+ }
258
269
 
259
- .stldocs-property-deprecated {
260
- font-family: var(--stldocs-font);
261
- color: var(--stldocs-color-red);
262
- font-size: var(--stldocs-font-size-body);
263
- font-weight: 600;
264
- }
270
+ .stldocs-property-declaration {
271
+ white-space: nowrap;
272
+ overflow: hidden;
273
+ text-overflow: ellipsis;
274
+ font-size: var(--stldocs-font-size-body);
275
+ flex: 1;
276
+ min-width: 0;
265
277
 
266
- .stldocs-property-deprecated-message {
267
- color: var(--stldocs-color-red);
268
- font-size: var(--stldocs-font-size-small);
278
+ .stldocs-property-deprecated {
279
+ margin-right: 0.44rem;
269
280
  }
281
+ }
270
282
 
271
- .stldocs-property-declaration {
272
- white-space: nowrap;
273
- overflow: hidden;
274
- text-overflow: ellipsis;
275
- font-size: var(--stldocs-font-size-body);
276
- flex: 1;
277
- min-width: 0;
278
-
279
- .stldocs-property-deprecated {
280
- margin-right: 0.44rem;
281
- }
282
- }
283
+ .stldocs-property-description {
284
+ font-size: 0.9rem;
285
+ color: var(--stldocs-color-text-secondary);
283
286
 
284
- .stldocs-property-description {
285
- font-size: 0.9rem;
287
+ & .stldocs-content {
286
288
  color: var(--stldocs-color-text-secondary);
287
-
288
- & .stldocs-content {
289
- color: var(--stldocs-color-text-secondary);
290
- }
291
289
  }
290
+ }
292
291
 
293
- .stldocs-property-name {
294
- font-family: var(--stldocs-font-mono);
295
- font-size: var(--stldocs-font-size-body);
296
- color: var(--stldocs-color-text-bright);
297
- font-weight: 700;
298
- }
292
+ .stldocs-property-name {
293
+ font-family: var(--stldocs-font-mono);
294
+ font-size: var(--stldocs-font-size-body);
295
+ color: var(--stldocs-color-text-bright);
296
+ font-weight: 700;
297
+ }
299
298
 
300
- .stldocs-property-annotation {
301
- color: var(--stldocs-color-text-tertiary);
302
- font-size: var(--stldocs-font-size-body);
303
- }
299
+ .stldocs-property-annotation {
300
+ color: var(--stldocs-color-text-tertiary);
301
+ font-size: var(--stldocs-font-size-body);
302
+ }
304
303
 
305
- .stldocs-property-typename {
306
- font-size: var(--stldocs-font-size-small);
307
- color: var(--stldocs-color-text-tertiary);
308
- line-height: 175%;
304
+ .stldocs-property-typename {
305
+ font-size: var(--stldocs-font-size-small);
306
+ color: var(--stldocs-color-text-tertiary);
307
+ line-height: 175%;
309
308
 
310
- .stldocs-type-reference {
311
- font-size: 0.8rem;
312
- color: var(--stldocs-syntax-color-blue);
313
- font-weight: 600;
314
- }
309
+ .stldocs-type-reference {
310
+ font-size: 0.8rem;
311
+ color: var(--stldocs-syntax-color-blue);
312
+ font-weight: 600;
315
313
  }
314
+ }
316
315
 
317
- .stldocs-property-type {
318
- .stldocs-truncation {
319
- margin-right: 0.2rem;
320
- white-space: nowrap;
321
- }
316
+ .stldocs-property-type {
317
+ .stldocs-truncation {
318
+ margin-right: 0.2rem;
319
+ white-space: nowrap;
322
320
  }
321
+ }
323
322
 
324
- .stldocs-property-badges {
325
- display: flex;
326
- font-size: 0.85rem;
327
- gap: 0.5rem;
328
- text-transform: lowercase;
329
- line-height: 1.5rem;
330
-
331
- [data-badge-id='deprecated'] {
332
- color: var(--stldocs-color-red);
333
- background-color: var(--stldocs--color-red-low);
334
- padding: 0px 6px;
335
- border-radius: 4px;
336
- text-transform: capitalize;
337
- }
323
+ .stldocs-property-badges {
324
+ display: flex;
325
+ font-size: 0.85rem;
326
+ gap: 0.5rem;
327
+ text-transform: lowercase;
328
+ line-height: 1.5rem;
338
329
 
339
- [data-badge-id='optional'] {
340
- background-color: var(--stldocs-color-bg-inline-code);
341
- padding: 0px 6px;
342
- border-radius: 4px;
343
- text-transform: capitalize;
344
- }
330
+ [data-badge-id='deprecated'] {
331
+ color: var(--stldocs-color-red);
332
+ background-color: var(--stldocs--color-red-low);
333
+ padding: 0px 6px;
334
+ border-radius: 4px;
335
+ text-transform: capitalize;
345
336
  }
346
337
 
347
- .stldocs-property-constraints {
348
- display: flex;
349
- font-size: var(--stldocs-font-size-body);
338
+ [data-badge-id='optional'] {
339
+ background-color: var(--stldocs-color-bg-inline-code);
340
+ padding: 0px 6px;
341
+ border-radius: 4px;
342
+ text-transform: capitalize;
350
343
  }
344
+ }
351
345
 
352
- .stldocs-property-constraint {
353
- color: var(--stldocs-color-text-muted);
346
+ .stldocs-property-constraints {
347
+ display: flex;
348
+ font-size: var(--stldocs-font-size-body);
349
+ }
354
350
 
355
- &:not(:last-child) {
356
- &::after {
357
- content: ', ';
358
- margin-right: 0.4rem;
359
- color: var(--stldocs-color-text-tertiary);
360
- }
361
- }
351
+ .stldocs-property-constraint {
352
+ color: var(--stldocs-color-text-muted);
362
353
 
363
- .stldocs-property-constraint-name {
354
+ &:not(:last-child) {
355
+ &::after {
356
+ content: ', ';
357
+ margin-right: 0.4rem;
364
358
  color: var(--stldocs-color-text-tertiary);
365
-
366
- &::after {
367
- content: ':';
368
- margin-right: 0.4rem;
369
- }
370
- }
371
-
372
- .stldocs-property-constraint-value {
373
- background-color: var(--stldocs-color-bg-inline-code);
374
- color: var(--stldocs-color-text-secondary);
375
- font-family: var(--stldocs-font-mono);
376
- border-radius: 4px;
377
- padding: 3px 4px;
378
359
  }
379
360
  }
380
361
 
381
- .stldocs-property-type:not(:first-child) {
382
- font-size: 0.8rem;
362
+ .stldocs-property-constraint-name {
363
+ color: var(--stldocs-color-text-tertiary);
364
+
365
+ &::after {
366
+ content: ':';
367
+ margin-right: 0.4rem;
368
+ }
383
369
  }
384
370
 
385
- .stldocs-property .stldocs-property-type {
386
- font-size: 0.8rem;
371
+ .stldocs-property-constraint-value {
372
+ background-color: var(--stldocs-color-bg-inline-code);
373
+ color: var(--stldocs-color-text-secondary);
374
+ font-family: var(--stldocs-font-mono);
375
+ border-radius: 4px;
376
+ padding: 3px 4px;
387
377
  }
388
378
  }
389
379
 
390
- .stldocs-root {
391
- .stldocs-properties {
392
- display: flex;
393
- flex-direction: column;
394
- line-height: 150%;
395
- }
380
+ .stldocs-property-type:not(:first-child) {
381
+ font-size: 0.8rem;
396
382
  }
397
383
 
398
- .stldocs-root .stldocs-property {
399
- padding: 0.2rem 0;
384
+ .stldocs-property .stldocs-property-type {
385
+ font-size: 0.8rem;
386
+ }
387
+ }
400
388
 
401
- [open] > .stldocs-expander-summary {
402
- padding-bottom: 0;
403
- }
389
+ .stldocs-root {
390
+ .stldocs-properties {
391
+ display: flex;
392
+ flex-direction: column;
393
+ line-height: 150%;
404
394
  }
395
+ }
396
+
397
+ .stldocs-root .stldocs-property {
398
+ padding: 0.2rem 0;
405
399
 
406
- .stldocs-root .stldocs-property:not(.stldocs-property .stldocs-property) > .stldocs-property-info {
407
- margin-left: var(--stldocs-expander-margin-shift);
400
+ [open] > .stldocs-expander-summary {
401
+ padding-bottom: 0;
408
402
  }
403
+ }
404
+
405
+ .stldocs-root .stldocs-property:not(.stldocs-property .stldocs-property) > .stldocs-property-info {
406
+ margin-left: var(--stldocs-expander-margin-shift);
407
+ }
408
+
409
+ .stldocs-root .stldocs-tooltip-content .stldocs-property {
410
+ gap: 0.1rem;
411
+ padding: 0.1rem !important;
412
+ border: 0;
413
+ }
409
414
 
410
- .stldocs-root .stldocs-tooltip-content .stldocs-property {
411
- gap: 0.1rem;
412
- padding: 0.1rem !important;
413
- border: 0;
415
+ /* Method Pages */
416
+ .stldocs-root .stldocs-method {
417
+ .stldocs-method-content-column {
418
+ display: contents;
414
419
  }
415
420
 
416
- /* Method Pages */
417
- .stldocs-root .stldocs-method {
418
- .stldocs-method-content-column {
419
- display: contents;
421
+ .stldocs-method-header {
422
+ padding: var(--stldocs-title-padding-y) var(--stldocs-content-padding) var(--stldocs-content-padding);
423
+
424
+ .stldocs-method-title {
425
+ font-size: var(--stldocs-font-size-h1);
426
+ letter-spacing: -0.03em;
420
427
  }
421
428
 
422
- .stldocs-method-header {
423
- padding: var(--stldocs-title-padding-y) var(--stldocs-content-padding) var(--stldocs-content-padding);
429
+ .stldocs-method-badges {
430
+ margin-top: 1rem;
424
431
 
425
- .stldocs-method-title {
426
- font-size: var(--stldocs-font-size-h1);
432
+ .stldocs-badge {
433
+ display: inline-block;
434
+ background-color: var(--stldocs-color-gray-5);
435
+ padding: 0 0.5rem;
436
+ border-radius: 4px;
437
+ font-size: var(--stldocs-font-size-small);
438
+ font-weight: 500;
427
439
  }
440
+ }
428
441
 
429
- .stldocs-method-badges {
430
- margin-top: 1rem;
431
-
432
- .stldocs-badge {
433
- display: inline-block;
434
- background-color: var(--stldocs-color-gray-5);
435
- padding: 0 0.5rem;
436
- border-radius: 4px;
437
- font-size: var(--stldocs-font-size-small);
438
- font-weight: 500;
439
- }
440
- }
442
+ .stldocs-method-signature {
443
+ margin-top: 0.75rem;
444
+ font-family: var(--stldocs-font-mono);
445
+ font-size: var(--stldocs-font-size-body);
446
+ color: var(--stldocs-color-text-tertiary);
447
+ white-space: pre-wrap;
448
+ word-wrap: break-word;
449
+ font-weight: 400;
441
450
 
442
- .stldocs-method-signature {
443
- margin-top: 0.75rem;
444
- font-family: var(--stldocs-font-mono);
445
- font-size: var(--stldocs-font-size-body);
446
- color: var(--stldocs-color-text-tertiary);
447
- white-space: pre-wrap;
448
- word-wrap: break-word;
451
+ .stldocs-signature-qualified {
452
+ color: var(--stldocs-color-text-secondary);
449
453
  font-weight: 400;
454
+ }
450
455
 
451
- .stldocs-signature-qualified {
452
- color: var(--stldocs-color-text-secondary);
453
- font-weight: 400;
454
- }
455
-
456
- .stldocs-signature-name {
457
- color: var(--stldocs-color-text);
458
- font-weight: 600;
459
- }
460
-
461
- .stldoc-signature-params {
462
- .stldocs-text-identifier {
463
- color: var(--stldocs-color-text);
464
- }
465
- }
456
+ .stldocs-signature-name {
457
+ color: var(--stldocs-color-text);
458
+ font-weight: 600;
459
+ }
466
460
 
467
- .stldocs-type {
461
+ .stldoc-signature-params {
462
+ .stldocs-text-identifier {
468
463
  color: var(--stldocs-color-text);
469
464
  }
470
465
  }
471
466
 
472
- .stldocs-method-route {
473
- padding-top: 12px;
474
- }
475
-
476
- .stldocs-type-preview[data-stldocs-type-preview='properties'] {
477
- display: none;
467
+ .stldocs-type {
468
+ color: var(--stldocs-color-text);
478
469
  }
479
470
  }
480
471
 
481
- .stldocs-method-description {
482
- grid-area: 1 / 1/ 2/ 2;
483
- padding-bottom: var(--stldocs-content-padding);
472
+ .stldocs-method-route {
473
+ padding-top: 12px;
474
+ }
484
475
 
485
- code {
486
- line-height: 150%;
487
- font-size: 0.93rem;
488
- }
476
+ .stldocs-type-preview[data-stldocs-type-preview='properties'] {
477
+ display: none;
489
478
  }
479
+ }
490
480
 
491
- .stldocs-method-example {
492
- margin-top: 1rem;
493
- grid-area: 2/ 1/ 3/ 2;
481
+ .stldocs-method-description {
482
+ grid-area: 1 / 1/ 2/ 2;
483
+ padding-bottom: var(--stldocs-content-padding);
494
484
 
495
- .stldocs-snippet-multi-response {
496
- display: none;
497
- }
485
+ code {
486
+ line-height: 150%;
487
+ font-size: 0.93rem;
498
488
  }
489
+ }
490
+
491
+ .stldocs-method-example {
492
+ margin-top: 1rem;
493
+ grid-area: 2/ 1/ 3/ 2;
499
494
 
500
495
  .stldocs-snippet-multi-response {
501
- border: 1px solid var(--stldocs-color-hairline);
502
- border-radius: 12px;
496
+ display: none;
497
+ }
498
+ }
499
+
500
+ .stldocs-snippet-multi-response {
501
+ border: 1px solid var(--stldocs-color-hairline);
502
+ border-radius: 12px;
503
+
504
+ .stldocs-snippet {
505
+ background-color: transparent;
506
+ }
507
+ }
508
+
509
+ .stldocs-method-info {
510
+ padding: var(--stldocs-content-padding) 0;
511
+ grid-area: 3/ 1/ 4/ 2;
512
+ display: flex;
513
+ gap: 2rem;
514
+ flex-direction: column;
515
+ margin-top: 2.5rem;
516
+
517
+ h5 {
518
+ display: flex;
519
+ }
520
+ }
521
+
522
+ .stldocs-method-info-section {
523
+ display: flex;
524
+ gap: 0.5rem;
525
+ flex-direction: column;
526
+ }
527
+
528
+ .stldocs-method-content-column {
529
+ display: contents;
530
+ }
503
531
 
504
- .stldocs-snippet {
505
- background-color: transparent;
506
- }
532
+ .stldocs-method-body {
533
+ display: grid;
534
+ gap: 2rem;
535
+ grid-template-columns: minmax(0, 1fr);
536
+ grid-template-rows: repeat(4, auto);
537
+ padding: var(--stldocs-content-padding) 0;
538
+
539
+ .stldocs-method-description p {
540
+ color: var(--stldocs-color-text-secondary);
541
+ line-height: 150%;
507
542
  }
508
543
 
509
- .stldocs-method-info {
510
- padding: var(--stldocs-content-padding) 0;
511
- grid-area: 3/ 1/ 4/ 2;
512
- display: flex;
513
- gap: 2rem;
514
- flex-direction: column;
515
- margin-top: 2.5rem;
544
+ h5 {
545
+ font-weight: 400;
546
+ color: var(--stldocs-color-text-tertiary);
547
+ }
516
548
 
517
- h5 {
518
- display: flex;
519
- }
549
+ .stldocs-method-parameters,
550
+ .stldocs-method-parameters,
551
+ .stldocs-method-returns {
552
+ margin-left: calc(-1 * var(--stldocs-expander-margin-shift));
520
553
  }
521
554
 
522
- .stldocs-method-info-section {
555
+ .stldocs-method-parameters {
523
556
  display: flex;
524
- gap: 0.5rem;
525
557
  flex-direction: column;
558
+ gap: 0.5rem;
526
559
  }
527
560
 
528
- .stldocs-method-content-column {
529
- display: contents;
561
+ .stldocs-method-parameters h5 {
562
+ margin-left: var(--stldocs-expander-margin-shift);
530
563
  }
564
+ }
531
565
 
532
- .stldocs-method-body {
533
- display: grid;
534
- gap: 2rem;
535
- grid-template-columns: minmax(0, 1fr);
536
- grid-template-rows: repeat(4, auto);
537
- padding: var(--stldocs-content-padding) 0 var(--stldocs-content-padding) var(--stldocs-content-padding);
566
+ .stldocs-snippet {
567
+ top: calc(var(--sl-nav-height) + 1rem);
568
+ position: sticky;
569
+ z-index: 10;
570
+ border-radius: 16px;
571
+ background-color: transparent;
572
+ padding: 0;
573
+ font-size: 0.8rem;
574
+ font-family: var(--stldocs-font-mono);
538
575
 
539
- .stldocs-method-description p {
540
- color: var(--stldocs-color-text-secondary);
541
- line-height: 150%;
542
- }
576
+ .stldocs-snippet-request {
577
+ border: 1px solid var(--stldocs-color-hairline);
578
+ border-radius: 12px;
579
+ position: relative;
543
580
 
544
- h5 {
545
- font-weight: 400;
546
- color: var(--stldocs-color-text-tertiary);
581
+ .stldocs-snippet-code {
582
+ background-color: var(--stldocs-color-bg);
583
+ border-bottom-left-radius: 12px;
584
+ border-bottom-right-radius: 12px;
547
585
  }
586
+ }
587
+
588
+ .stldocs-snippet-request-title {
589
+ --stldocs-snippet-request-title-bg: var(--stldocs-color-bg);
548
590
 
549
- .stldocs-method-parameters,
550
- .stldocs-method-parameters,
551
- .stldocs-method-returns {
552
- margin-left: calc(-1 * var(--stldocs-expander-margin-shift));
591
+ display: flex;
592
+ justify-content: space-between;
593
+ background-color: var(--stldocs-snippet-request-title-bg);
594
+ color: var(--stldocs-color-snippet-title-muted);
595
+ border-bottom: 1px solid var(--stldocs-color-hairline);
596
+ border-top-right-radius: 12px;
597
+ border-top-left-radius: 12px;
598
+ padding: 0.5rem;
599
+ padding-left: 1rem;
600
+ gap: 0.5rem;
601
+
602
+ .stldocs-snippet-request-title-method {
603
+ flex-grow: 1;
604
+ min-width: 0;
553
605
  }
554
606
 
555
- .stldocs-method-parameters {
607
+ > div {
556
608
  display: flex;
557
- flex-direction: column;
558
609
  gap: 0.5rem;
610
+ align-items: center;
559
611
  }
560
612
 
561
- .stldocs-method-parameters h5 {
562
- margin-left: var(--stldocs-expander-margin-shift);
563
- }
564
- }
565
-
566
- .stldocs-snippet {
567
- top: calc(var(--sl-nav-height) + 1rem);
568
- position: sticky;
569
- z-index: 10;
570
- border-radius: 16px;
571
- background-color: transparent;
572
- padding: 0;
573
- font-size: 0.8rem;
574
- font-family: var(--stldocs-font-mono);
613
+ h5 {
614
+ font-weight: 500;
615
+ font-style: normal;
616
+ line-height: 100%;
617
+ font-size: var(--stldocs-font-size-body);
618
+ font-family: var(--stldocs-font);
619
+ color: var(--stldocs-color-text);
620
+ margin: 0;
575
621
 
576
- .stldocs-snippet-request {
577
- border: 1px solid var(--stldocs-color-hairline);
578
- border-radius: 12px;
579
- position: relative;
622
+ overflow: hidden;
623
+ white-space: nowrap;
624
+ text-overflow: ellipsis;
625
+ }
580
626
 
581
- .stldocs-snippet-code {
582
- background-color: var(--stldocs-color-bg);
583
- border-bottom-left-radius: 12px;
584
- border-bottom-right-radius: 12px;
627
+ @media (min-width: 1280px) {
628
+ .stldocs-snippet-request-title-label {
629
+ display: none;
585
630
  }
586
631
  }
587
632
 
588
- .stldocs-snippet-request-title {
633
+ .stldocs-icon {
634
+ width: 16px;
635
+ }
636
+
637
+ .stldocs-snippet-request-title-content {
638
+ font-family: var(--stldocs-font);
589
639
  display: flex;
590
- justify-content: space-between;
591
- background-color: var(--stldocs-color-bg);
592
- color: var(--stldocs-color-snippet-title-muted);
593
- border-bottom: 1px solid var(--stldocs-color-hairline);
594
- border-top-right-radius: 12px;
595
- border-top-left-radius: 12px;
596
- padding: 0.5rem;
597
- padding-left: 1rem;
598
640
  gap: 0.5rem;
599
641
 
600
- .stldocs-snippet-request-title-method {
601
- flex-grow: 1;
602
- min-width: 0;
603
- }
604
-
605
- > div {
642
+ .stldocs-snippet-request-title-language {
643
+ position: relative;
644
+ color: var(--stldocs-color-text);
645
+ cursor: pointer;
606
646
  display: flex;
607
- gap: 0.5rem;
608
647
  align-items: center;
609
- }
610
-
611
- h5 {
612
- font-weight: 500;
613
- font-style: normal;
614
- line-height: 100%;
615
- font-size: var(--stldocs-font-size-body);
616
- font-family: var(--stldocs-font);
617
- color: var(--stldocs-color-text);
618
-
619
- overflow: hidden;
620
- white-space: nowrap;
621
- text-overflow: ellipsis;
622
- }
623
-
624
- @media (min-width: 1280px) {
625
- .stldocs-snippet-request-title-label {
626
- display: none;
627
- }
628
- }
629
-
630
- .stldocs-icon {
631
- width: 16px;
632
- }
648
+ gap: 4px;
633
649
 
634
- .stldocs-snippet-request-title-content {
635
- font-family: var(--stldocs-font);
636
- display: flex;
637
- gap: 0.5rem;
638
-
639
- .stldocs-snippet-request-title-language {
640
- position: relative;
641
- color: var(--stldocs-color-text);
642
- cursor: pointer;
643
-
644
- select {
645
- z-index: 5;
646
- padding-right: 25px;
647
- display: flex;
648
- align-items: center;
649
- }
650
+ select {
651
+ z-index: 5;
652
+ padding-right: 25px;
653
+ display: flex;
654
+ align-items: center;
650
655
  }
651
656
  }
652
657
  }
658
+ }
653
659
 
654
- .stldocs-snippet-request-title-copy-button {
655
- color: var(--stldocs-color-snippet-title-muted);
656
- width: 1.5rem;
657
- height: 1.5rem;
658
- display: flex;
659
- align-items: center;
660
- justify-content: center;
661
- border-radius: 4px;
662
- align-self: center;
663
- cursor: pointer;
664
- }
665
-
666
- .stldocs-snippet-request-title-copy-button:hover {
667
- color: var(--stldocs-color-snippet-title-bright);
668
- }
669
-
670
- .stldocs-snippet-response-pane {
671
- padding: 0.5rem;
672
- background-color: var(--stldocs-color-bg-inline-code);
673
- display: none;
660
+ .stldocs-snippet-response-pane {
661
+ padding: 0.5rem;
662
+ background-color: var(--stldocs-color-bg-inline-code);
663
+ display: none;
674
664
 
675
- &.stldocs-snippet-response-pane-active {
676
- display: block;
677
- }
665
+ &.stldocs-snippet-response-pane-active {
666
+ display: block;
678
667
  }
668
+ }
679
669
 
680
- .stldocs-snippet-response {
681
- margin-top: 1rem;
670
+ .stldocs-snippet-response {
671
+ margin-top: 1rem;
682
672
 
683
- .stldocs-snippet-response-title {
684
- display: flex;
685
- gap: 0.5rem;
686
- color: var(--stldocs-color-snippet-title-muted);
687
- padding: 0 1rem;
688
- font-family: var(--stldocs-font);
689
- }
673
+ .stldocs-snippet-response-title {
674
+ display: flex;
675
+ gap: 0.5rem;
676
+ color: var(--stldocs-color-snippet-title-muted);
677
+ padding: 0 1rem;
678
+ font-family: var(--stldocs-font);
690
679
  }
691
680
  }
681
+ }
692
682
 
693
- .stldocs-method-response-column {
694
- display: flex;
695
- flex-direction: column;
696
- gap: 1rem;
697
- margin-top: 2.5rem;
698
- }
683
+ .stldocs-method-response-column {
684
+ display: flex;
685
+ flex-direction: column;
686
+ gap: 1rem;
687
+ margin-top: 2.5rem;
688
+ }
699
689
 
700
- .stldocs-snippet-code {
701
- width: 0;
702
- min-width: 100%;
703
- overflow: auto;
704
- display: block;
705
- white-space: preserve nowrap;
690
+ .stldocs-snippet-code {
691
+ width: 0;
692
+ min-width: 100%;
693
+ overflow: auto;
694
+ display: block;
695
+ white-space: preserve nowrap;
696
+ padding: 1rem;
697
+ max-height: 560px;
698
+ line-height: 1.75;
699
+ transition: height 240ms ease;
700
+ will-change: height;
701
+
702
+ .shiki {
706
703
  padding: 1rem;
707
- max-height: 560px;
708
- line-height: 1.75;
709
- transition: height 240ms ease;
710
- will-change: height;
711
-
712
- .shiki {
713
- padding: 1rem;
714
- --shiki-dark-bg: var(--sl-color-bg) !important;
715
- }
716
-
717
- pre.shiki {
718
- counter-reset: codeblock-line;
719
-
720
- .line {
721
- counter-increment: codeblock-line;
722
-
723
- &::before {
724
- content: counter(codeblock-line);
725
- color: var(--sl-color-text-tertiary);
726
- margin-right: 1rem;
727
- opacity: 0.5;
728
- display: inline-flex;
729
- width: 1rem;
730
- }
731
-
732
- &.ellipsis {
733
- color: var(--sl-color-text-tertiary) !important;
734
- opacity: 0.5;
735
- }
736
- }
737
- }
704
+ --shiki-dark-bg: var(--sl-color-bg) !important;
738
705
  }
739
706
 
740
- .stldocs-snippet-response-tab {
741
- display: flex;
742
- gap: 0.5rem;
743
- overflow-x: auto;
707
+ pre.shiki {
708
+ counter-reset: codeblock-line;
744
709
 
745
- .stldocs-snippet-response-tab-item {
746
- flex: 1;
747
- display: inline-block;
748
- text-align: center;
749
- padding: 0 0.5rem;
750
- border-bottom: 2px solid transparent;
751
- cursor: pointer;
752
- font-weight: 500;
753
- line-height: 100%;
754
- font-size: var(--stldocs-font-size-body);
755
- font-family: var(--stldocs-font);
756
- height: 40px;
757
- min-width: 160px;
758
- white-space: nowrap;
759
- overflow: hidden;
760
- text-overflow: ellipsis;
761
- vertical-align: middle;
710
+ .line {
711
+ counter-increment: codeblock-line;
762
712
 
763
- &:hover {
764
- background-color: var(--stldocs-color-bg-hover);
713
+ &::before {
714
+ content: counter(codeblock-line);
715
+ color: var(--sl-color-text-tertiary);
716
+ margin-right: 1rem;
717
+ opacity: 0.5;
718
+ display: inline-flex;
719
+ width: 1rem;
765
720
  }
766
- }
767
721
 
768
- .stldocs-snippet-response-tab-item-active {
769
- border-color: var(--stldocs-color-bg-accent);
770
- }
771
-
772
- &.stldocs-snippet-response-tab-single-return {
773
- background-color: var(--stldocs-color-bg-inline-code);
774
- border-top-left-radius: 12px;
775
- border-top-right-radius: 12px;
776
-
777
- .stldocs-snippet-response-tab-item {
778
- border: none;
779
- color: var(--stldocs-color-text-secondary);
780
- text-align: left;
781
- cursor: default;
782
- font-weight: 400;
722
+ &.ellipsis {
723
+ color: var(--sl-color-text-tertiary) !important;
724
+ opacity: 0.5;
783
725
  }
784
726
  }
785
727
  }
786
728
  }
787
729
 
788
- .stldocs-root .stldocs-language-block {
789
- background-color: var(--stldocs-color-bg);
790
- border: 1px solid var(--stldocs-color-hairline);
791
- border-radius: 8px;
792
- padding: 16px;
730
+ .stldocs-snippet-response-tab {
793
731
  display: flex;
794
- flex-direction: column;
795
- gap: 8px;
732
+ gap: 0.5rem;
733
+ overflow-x: auto;
796
734
 
797
- .stldocs-language-block-content {
798
- display: flex;
799
- gap: 12px;
735
+ .stldocs-snippet-response-tab-item {
736
+ flex: 1;
737
+ display: inline-block;
738
+ text-align: center;
739
+ padding: 0 0.5rem;
740
+ border-bottom: 2px solid transparent;
741
+ cursor: pointer;
742
+ font-weight: 500;
743
+ line-height: 100%;
744
+ font-size: var(--stldocs-font-size-body);
745
+ font-family: var(--stldocs-font);
746
+ height: 40px;
747
+ min-width: 160px;
748
+ white-space: nowrap;
749
+ overflow: hidden;
750
+ text-overflow: ellipsis;
751
+ vertical-align: middle;
752
+ background: none;
800
753
 
801
- .stldocs-language-block-content-icon {
802
- display: inline-flex;
803
- border: 1px solid var(--stldocs-color-hairline);
804
- border-radius: 4px;
805
- padding: 12px;
806
- aspect-ratio: 1 / 1;
754
+ &:hover {
755
+ background-color: var(--stldocs-color-bg-hover);
807
756
  }
757
+ }
808
758
 
809
- .stldocs-language-block-content-info {
810
- .stldocs-language-block-content-info-language {
811
- line-height: 120%;
812
- font-weight: 600;
813
- }
759
+ .stldocs-snippet-response-tab-item-active {
760
+ border-color: var(--stldocs-color-bg-accent);
761
+ }
814
762
 
815
- .stldocs-language-block-content-info-version {
816
- font-family: var(--stldocs-font-mono);
817
- font-size: var(--stldocs-font-size-code);
818
- font-weight: 200;
819
- }
763
+ &.stldocs-snippet-response-tab-single-return {
764
+ background-color: var(--stldocs-color-bg-inline-code);
765
+ border-top-left-radius: 12px;
766
+ border-top-right-radius: 12px;
767
+
768
+ .stldocs-snippet-response-tab-item {
769
+ border: none;
770
+ color: var(--stldocs-color-text-secondary);
771
+ text-align: left;
772
+ cursor: default;
773
+ font-weight: 400;
820
774
  }
821
775
  }
776
+ }
777
+ }
822
778
 
823
- .stldocs-language-block-install {
824
- display: flex;
825
- font-family: var(--stldocs-font-mono);
826
- font-size: var(--stldocs-font-size-code);
827
- background-color: var(--stldocs-color-bg-inline-code);
779
+ .stldocs-root .stldocs-language-block {
780
+ background-color: var(--stldocs-color-bg);
781
+ border: 1px solid var(--stldocs-color-hairline);
782
+ border-radius: 8px;
783
+ padding: 16px;
784
+ display: flex;
785
+ flex-direction: column;
786
+ gap: 8px;
787
+
788
+ .stldocs-language-block-content {
789
+ display: flex;
790
+ gap: 12px;
791
+
792
+ .stldocs-language-block-content-icon {
793
+ display: inline-flex;
828
794
  border: 1px solid var(--stldocs-color-hairline);
829
795
  border-radius: 4px;
830
- padding: 4px 8px;
796
+ padding: 12px;
797
+ aspect-ratio: 1 / 1;
798
+ }
831
799
 
832
- pre {
833
- flex-grow: 1;
834
- white-space: nowrap;
835
- overflow-x: hidden;
836
- text-overflow: ellipsis;
800
+ .stldocs-language-block-content-info {
801
+ .stldocs-language-block-content-info-language {
802
+ line-height: 120%;
803
+ font-weight: 600;
837
804
  }
838
805
 
839
- svg {
840
- vertical-align: middle;
841
- min-width: 16px;
806
+ .stldocs-language-block-content-info-version {
807
+ font-family: var(--stldocs-font-mono);
808
+ font-size: var(--stldocs-font-size-code);
809
+ font-weight: 200;
842
810
  }
843
811
  }
812
+ }
813
+
814
+ .stldocs-language-block-install {
815
+ display: flex;
816
+ font-family: var(--stldocs-font-mono);
817
+ font-size: var(--stldocs-font-size-code);
818
+ background-color: var(--stldocs-color-bg-inline-code);
819
+ border: 1px solid var(--stldocs-color-hairline);
820
+ color: var(--stldocs-color-text-secondary);
821
+ border-radius: 4px;
822
+ padding: 4px 8px;
844
823
 
845
- .stldocs-language-block-links {
824
+ pre {
825
+ flex-grow: 1;
826
+ white-space: nowrap;
827
+ overflow-x: hidden;
828
+ text-overflow: ellipsis;
846
829
  display: flex;
847
- gap: 8px;
830
+ align-items: center;
831
+ }
848
832
 
849
- & > a:last-child {
850
- flex-grow: 1;
851
- }
833
+ svg {
834
+ vertical-align: middle;
835
+ min-width: 16px;
852
836
  }
853
837
  }
854
838
 
855
- starlight-theme-select label {
856
- height: 2rem;
857
- }
839
+ .stldocs-language-block-links {
840
+ display: flex;
841
+ gap: 8px;
858
842
 
859
- starlight-theme-select select {
860
- height: 100%;
843
+ & > a:last-child {
844
+ flex-grow: 1;
845
+ }
861
846
  }
847
+ }
862
848
 
863
- /* Media Queries */
864
- @media (min-width: 1280px) {
865
- .stldocs-root .stldocs-method.stldocs-method-double-pane {
866
- .stldocs-method-example {
867
- flex: 1 1 500px;
868
- max-width: 100%;
869
- width: 100%;
870
- }
849
+ starlight-theme-select label {
850
+ height: 2rem;
851
+ }
871
852
 
872
- .stldocs-method-body {
873
- flex-direction: row;
874
- gap: 2rem;
875
- }
876
- }
877
- }
853
+ starlight-theme-select select {
854
+ height: 100%;
855
+ }
878
856
 
879
- /* Don't put expanders in the margin on mobile */
880
- @media (max-width: 50rem) {
881
- .stldocs-root .stldocs-method-body {
882
- padding: 1rem var(--stldocs-content-padding) !important;
857
+ /* Media Queries */
858
+ @media (min-width: 1280px) {
859
+ .stldocs-root .stldocs-method.stldocs-method-double-pane {
860
+ .stldocs-method-example {
861
+ flex: 1 1 500px;
862
+ max-width: 100%;
863
+ width: 100%;
864
+ }
883
865
 
884
- .stldocs-method-parameters,
885
- .stldocs-method-returns {
886
- margin-left: 0 !important;
887
- }
866
+ .stldocs-method-body {
867
+ flex-direction: row;
868
+ gap: 2rem;
888
869
  }
870
+ }
871
+ }
872
+
873
+ /* Don't put expanders in the margin on mobile */
874
+ @media (max-width: 50rem) {
875
+ .stldocs-root .stldocs-method-body {
876
+ padding: 1rem var(--stldocs-content-padding) !important;
877
+ }
889
878
 
890
- .stldocs-root .stldocs-resource .stldocs-resource-content {
891
- padding: 0 var(--stldocs-content-padding) !important;
879
+ .stldocs-root .stldocs-resource .stldocs-resource-content {
880
+ padding: 0 var(--stldocs-content-padding) !important;
892
881
 
893
- .stldocs-resource-content-properties {
894
- margin-left: 0 !important;
895
- }
882
+ .stldocs-resource-content-properties {
883
+ margin-left: 0 !important;
884
+ }
896
885
 
897
- .stldocs-snippet-response-closed {
898
- background-color: var(--stldocs-color-snippet-box-bg);
886
+ .stldocs-snippet-response-closed {
887
+ background-color: var(--stldocs-color-snippet-box-bg);
899
888
 
900
- .stldocs-snippet-response {
901
- max-height: 1000px;
902
- opacity: 1;
903
- }
889
+ .stldocs-snippet-response {
890
+ max-height: 1000px;
891
+ opacity: 1;
904
892
  }
905
893
  }
906
894
  }
895
+ }
907
896
 
908
- @media (min-width: 1280px) {
909
- .stldocs-root {
910
- .stldocs-method.stldocs-method-double-pane .stldocs-method-content-column {
911
- display: block;
912
- }
897
+ @media (min-width: 50rem) {
898
+ .stldocs-root .stldocs-method {
899
+ .stldocs-method-header {
900
+ padding: var(--stldocs-title-padding-y) 0;
901
+ }
902
+ }
903
+ }
913
904
 
914
- .stldocs-method.stldocs-method-double-pane .stldocs-method-body {
915
- grid-template-columns: repeat(2, minmax(0, 1fr));
916
- grid-template-areas: 'description example';
917
- grid-template-rows: unset;
905
+ @media (min-width: 1280px) {
906
+ .stldocs-root {
907
+ .stldocs-method.stldocs-method-double-pane .stldocs-method-content-column {
908
+ display: block;
909
+ }
918
910
 
919
- .stldocs-snippet {
920
- padding: 0.5rem;
921
- display: flex;
922
- flex-direction: column;
923
- background-color: var(--stldocs-color-bg-inline-code);
911
+ .stldocs-method.stldocs-method-double-pane .stldocs-method-body {
912
+ grid-template-columns: repeat(2, minmax(0, 1fr));
913
+ grid-template-areas: 'description example';
914
+ grid-template-rows: unset;
924
915
 
925
- .stldocs-snippet-response {
926
- display: block;
927
- }
916
+ .stldocs-snippet {
917
+ padding: 0.5rem;
918
+ display: flex;
919
+ flex-direction: column;
920
+ background-color: var(--stldocs-color-bg-inline-code);
928
921
 
929
- .stldocs-snippet-response-pane {
930
- position: relative;
931
- padding: 0;
922
+ .stldocs-snippet-response {
923
+ display: block;
924
+ }
932
925
 
933
- &::before {
934
- content: '';
935
- flex: 0 0 1rem;
936
- width: calc(100% + 2rem);
937
- height: 1px;
938
- position: absolute;
939
- top: calc(-0.5rem);
940
- left: -1rem;
941
- background-color: var(--stldocs-color-hairline);
942
- }
943
- }
926
+ .stldocs-snippet-response-pane {
927
+ position: relative;
928
+ padding: 0;
944
929
 
945
- .stldocs-snippet-multi-response {
946
- display: block;
947
- padding: 0;
930
+ &::before {
931
+ content: '';
932
+ flex: 0 0 1rem;
933
+ width: calc(100% + 2rem);
934
+ height: 1px;
935
+ position: absolute;
936
+ top: calc(-0.5rem);
937
+ left: -1rem;
938
+ background-color: var(--stldocs-color-hairline);
948
939
  }
949
940
  }
950
941
 
951
- .stldocs-method-response-column {
952
- display: none;
953
- margin-top: 0;
942
+ .stldocs-snippet-multi-response {
943
+ display: block;
944
+ padding: 0;
954
945
  }
946
+ }
955
947
 
956
- .stldocs-method-content-column {
957
- grid-area: description;
958
- }
948
+ .stldocs-method-response-column {
949
+ display: none;
950
+ margin-top: 0;
951
+ }
952
+
953
+ .stldocs-method-content-column {
954
+ grid-area: description;
955
+ }
959
956
 
960
- .stldocs-method-example {
961
- margin-top: 0;
962
- grid-area: example;
957
+ .stldocs-method-example {
958
+ margin-top: 0;
959
+ grid-area: example;
963
960
 
964
- .stldocs-snippet-multi-response {
965
- display: block;
966
- border: none;
961
+ .stldocs-snippet-multi-response {
962
+ display: block;
963
+ border: none;
967
964
 
968
- .stldocs-snippet {
969
- background-color: transparent;
970
- }
965
+ .stldocs-snippet {
966
+ background-color: transparent;
971
967
  }
972
968
  }
969
+ }
973
970
 
974
- .stldocs-method-info {
975
- grid-area: unset;
976
- margin-top: 0;
977
- }
971
+ .stldocs-method-info {
972
+ grid-area: unset;
973
+ margin-top: 0;
974
+ }
978
975
 
979
- .stldocs-snippet-response-tab {
980
- margin-bottom: 0.5rem;
976
+ .stldocs-snippet-response-tab {
977
+ margin-bottom: 0.5rem;
981
978
 
982
- &.stldocs-snippet-response-tab-single-return {
983
- background-color: transparent;
979
+ &.stldocs-snippet-response-tab-single-return {
980
+ background-color: transparent;
984
981
 
985
- .stldocs-snippet-response-tab-item {
986
- padding: 0;
987
- }
982
+ .stldocs-snippet-response-tab-item {
983
+ padding: 0;
988
984
  }
989
985
  }
990
986
  }