@stainless-api/docs-ui 0.1.0-beta.22 → 0.1.0-beta.23

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