raffel 1.1.80 → 1.1.82

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,10 +1,10 @@
1
1
  export const schemaCodeStyles = ` /* ========== RESPONSE SAMPLES (Right Panel) ========== */
2
2
  .response-samples {
3
- margin-top: 20px;
3
+ margin-top: 16px;
4
4
  }
5
5
 
6
6
  .response-samples-header {
7
- font-size: 14px;
7
+ font-size: 12px;
8
8
  font-weight: 600;
9
9
  color: var(--code-panel-text);
10
10
  margin-bottom: 12px;
@@ -12,14 +12,14 @@ export const schemaCodeStyles = ` /* ========== RESPONSE SAMPLES (Right Panel
12
12
 
13
13
  .sample-tabs {
14
14
  display: flex;
15
- gap: 8px;
16
- margin-bottom: 16px;
15
+ gap: 6px;
16
+ margin-bottom: 12px;
17
17
  }
18
18
 
19
19
  .sample-tab {
20
- padding: 6px 14px;
20
+ padding: 4px 10px;
21
21
  border-radius: 4px;
22
- font-size: 13px;
22
+ font-size: 11px;
23
23
  font-weight: 500;
24
24
  cursor: pointer;
25
25
  background: transparent;
@@ -50,19 +50,19 @@ export const schemaCodeStyles = ` /* ========== RESPONSE SAMPLES (Right Panel
50
50
  }
51
51
 
52
52
  .sample-content-type {
53
- font-size: 12px;
53
+ font-size: 11px;
54
54
  color: #90a4ae;
55
55
  margin-bottom: 8px;
56
56
  }
57
57
 
58
58
  .sample-actions {
59
59
  display: flex;
60
- gap: 16px;
61
- margin-bottom: 12px;
60
+ gap: 12px;
61
+ margin-bottom: 8px;
62
62
  }
63
63
 
64
64
  .sample-action {
65
- font-size: 12px;
65
+ font-size: 11px;
66
66
  color: #90a4ae;
67
67
  cursor: pointer;
68
68
  background: none;
@@ -78,10 +78,10 @@ export const schemaCodeStyles = ` /* ========== RESPONSE SAMPLES (Right Panel
78
78
  .sample-json {
79
79
  background: rgba(0,0,0,0.3);
80
80
  border-radius: 6px;
81
- padding: 14px;
81
+ padding: 10px;
82
82
  font-family: 'SF Mono', 'Monaco', monospace;
83
- font-size: 12px;
84
- line-height: 1.5;
83
+ font-size: 11px;
84
+ line-height: 1.4;
85
85
  color: #e2e8f0;
86
86
  overflow-x: auto;
87
87
  white-space: pre-wrap;
@@ -98,7 +98,7 @@ export const schemaCodeStyles = ` /* ========== RESPONSE SAMPLES (Right Panel
98
98
  .right-panel-content {
99
99
  display: flex;
100
100
  flex-direction: column;
101
- gap: 24px;
101
+ gap: 18px;
102
102
  }
103
103
 
104
104
  .right-section {
@@ -106,13 +106,13 @@ export const schemaCodeStyles = ` /* ========== RESPONSE SAMPLES (Right Panel
106
106
  }
107
107
 
108
108
  .right-section-header {
109
- font-size: 13px;
109
+ font-size: 11px;
110
110
  font-weight: 600;
111
111
  color: #90a4ae;
112
112
  text-transform: uppercase;
113
113
  letter-spacing: 0.5px;
114
- margin-bottom: 16px;
115
- padding-bottom: 8px;
114
+ margin-bottom: 12px;
115
+ padding-bottom: 6px;
116
116
  border-bottom: 1px solid rgba(255,255,255,0.1);
117
117
  }
118
118
 
@@ -157,9 +157,9 @@ export const schemaCodeStyles = ` /* ========== RESPONSE SAMPLES (Right Panel
157
157
  display: flex;
158
158
  align-items: center;
159
159
  justify-content: space-between;
160
- padding: 10px 14px;
160
+ padding: 8px 10px;
161
161
  background: var(--code-panel-header);
162
- font-size: 12px;
162
+ font-size: 11px;
163
163
  font-weight: 600;
164
164
  color: #90a4ae;
165
165
  text-transform: uppercase;
@@ -172,32 +172,33 @@ export const schemaCodeStyles = ` /* ========== RESPONSE SAMPLES (Right Panel
172
172
  border: none;
173
173
  border-radius: 0;
174
174
  color: #e2e8f0;
175
- padding: 14px;
175
+ padding: 10px;
176
176
  }
177
177
 
178
178
  .code-example code {
179
179
  color: #e2e8f0;
180
180
  white-space: pre-wrap;
181
181
  word-break: break-word;
182
- font-size: 12px;
182
+ font-size: 11px;
183
+ line-height: 1.4;
183
184
  }
184
185
 
185
186
  /* Code language tabs */
186
187
  .code-tabs {
187
188
  display: flex;
188
189
  gap: 2px;
189
- padding: 8px 14px;
190
+ padding: 6px 10px;
190
191
  background: var(--code-panel-header);
191
192
  border-bottom: 1px solid rgba(255,255,255,0.1);
192
193
  }
193
194
 
194
195
  .code-tab {
195
- padding: 6px 12px;
196
+ padding: 4px 9px;
196
197
  border: none;
197
198
  border-radius: 4px;
198
199
  background: transparent;
199
200
  color: #90a4ae;
200
- font-size: 12px;
201
+ font-size: 11px;
201
202
  font-weight: 500;
202
203
  cursor: pointer;
203
204
  transition: all 0.15s;
@@ -227,12 +228,12 @@ export const schemaCodeStyles = ` /* ========== RESPONSE SAMPLES (Right Panel
227
228
 
228
229
  pre {
229
230
  background: var(--code-bg);
230
- padding: 16px;
231
+ padding: 12px;
231
232
  border-radius: 8px;
232
233
  overflow-x: auto;
233
234
  font-family: 'SF Mono', 'Fira Code', 'Monaco', monospace;
234
- font-size: 13px;
235
- line-height: 1.5;
235
+ font-size: 11px;
236
+ line-height: 1.45;
236
237
  border: 1px solid var(--border-color);
237
238
  }
238
239
 
@@ -247,7 +248,7 @@ export const schemaCodeStyles = ` /* ========== RESPONSE SAMPLES (Right Panel
247
248
  .schema-row {
248
249
  display: flex;
249
250
  align-items: flex-start;
250
- padding: 12px 16px;
251
+ padding: 8px 12px;
251
252
  border-bottom: 1px solid var(--border-color);
252
253
  transition: background 0.15s;
253
254
  }
@@ -274,7 +275,7 @@ export const schemaCodeStyles = ` /* ========== RESPONSE SAMPLES (Right Panel
274
275
 
275
276
  .schema-name {
276
277
  font-family: 'SF Mono', 'Monaco', monospace;
277
- font-size: 13px;
278
+ font-size: 12px;
278
279
  font-weight: 600;
279
280
  color: var(--text-color);
280
281
  }
@@ -282,17 +283,17 @@ export const schemaCodeStyles = ` /* ========== RESPONSE SAMPLES (Right Panel
282
283
  .schema-required {
283
284
  color: #ef4444;
284
285
  font-weight: 700;
285
- font-size: 14px;
286
+ font-size: 12px;
286
287
  }
287
288
 
288
289
  .schema-type {
289
290
  display: inline-flex;
290
291
  align-items: center;
291
292
  gap: 4px;
292
- padding: 2px 8px;
293
+ padding: 1px 6px;
293
294
  border-radius: 4px;
294
295
  font-family: 'SF Mono', 'Monaco', monospace;
295
- font-size: 11px;
296
+ font-size: 10px;
296
297
  font-weight: 500;
297
298
  }
298
299
 
@@ -319,10 +320,64 @@ export const schemaCodeStyles = ` /* ========== RESPONSE SAMPLES (Right Panel
319
320
 
320
321
  .schema-desc {
321
322
  color: var(--text-muted);
322
- font-size: 13px;
323
+ font-size: 12px;
323
324
  margin-bottom: 4px;
324
325
  }
325
326
 
327
+ /* Compact response-body tree. Nested wrappers use a fixed step so
328
+ indentation grows predictably instead of compounding by depth. */
329
+ .schema-tree-root {
330
+ margin-top: 6px;
331
+ }
332
+
333
+ .schema-tree-nested {
334
+ padding-left: 10px;
335
+ }
336
+
337
+ .schema-tree-row {
338
+ padding: 4px 0;
339
+ font-size: 12px;
340
+ line-height: 1.35;
341
+ }
342
+
343
+ .schema-tree-root > .schema-tree-row {
344
+ padding-left: 6px;
345
+ border-left: 1px solid var(--border-color);
346
+ }
347
+
348
+ .schema-tree-property {
349
+ display: flex;
350
+ align-items: center;
351
+ gap: 5px;
352
+ color: var(--text-primary);
353
+ font-weight: 500;
354
+ }
355
+
356
+ .schema-tree-required {
357
+ color: #ef4444;
358
+ }
359
+
360
+ .schema-tree-description {
361
+ margin-top: 2px;
362
+ color: var(--text-muted);
363
+ font-size: 11px;
364
+ line-height: 1.4;
365
+ }
366
+
367
+ .schema-tree-label {
368
+ color: var(--text-primary);
369
+ font-weight: 500;
370
+ }
371
+
372
+ .schema-tree-meta {
373
+ color: var(--text-secondary);
374
+ }
375
+
376
+ .schema-tree-unresolved {
377
+ color: var(--text-muted);
378
+ font-style: italic;
379
+ }
380
+
326
381
  .schema-constraints {
327
382
  display: flex;
328
383
  flex-wrap: wrap;
@@ -569,11 +624,11 @@ export const schemaCodeStyles = ` /* ========== RESPONSE SAMPLES (Right Panel
569
624
 
570
625
  /* ========== HTTP ENDPOINT (ReDoc-style) ========== */
571
626
  .http-param-group {
572
- margin-bottom: 20px;
627
+ margin-bottom: 14px;
573
628
  }
574
629
 
575
630
  .http-param-group-title {
576
- font-size: 12px;
631
+ font-size: 11px;
577
632
  font-weight: 600;
578
633
  text-transform: uppercase;
579
634
  letter-spacing: 0.5px;
@@ -588,7 +643,7 @@ export const schemaCodeStyles = ` /* ========== RESPONSE SAMPLES (Right Panel
588
643
  }
589
644
 
590
645
  .http-param {
591
- padding: 12px 16px;
646
+ padding: 8px 12px;
592
647
  border-bottom: 1px solid var(--border-color);
593
648
  }
594
649
 
@@ -598,12 +653,12 @@ export const schemaCodeStyles = ` /* ========== RESPONSE SAMPLES (Right Panel
598
653
  display: flex;
599
654
  align-items: center;
600
655
  flex-wrap: wrap;
601
- gap: 8px;
656
+ gap: 6px;
602
657
  }
603
658
 
604
659
  .http-param-name {
605
660
  font-family: 'SF Mono', 'Monaco', monospace;
606
- font-size: 13px;
661
+ font-size: 12px;
607
662
  font-weight: 600;
608
663
  color: var(--text-color);
609
664
  }
@@ -626,22 +681,22 @@ export const schemaCodeStyles = ` /* ========== RESPONSE SAMPLES (Right Panel
626
681
 
627
682
  .http-param-desc {
628
683
  color: var(--text-muted);
629
- font-size: 13px;
630
- margin-top: 6px;
631
- line-height: 1.5;
684
+ font-size: 12px;
685
+ margin-top: 4px;
686
+ line-height: 1.4;
632
687
  }
633
688
 
634
689
  /* Validation constraint chips (reuses .schema-constraint look) */
635
690
  .constraint-chips {
636
691
  display: flex;
637
692
  flex-wrap: wrap;
638
- gap: 6px;
639
- margin-top: 8px;
693
+ gap: 4px;
694
+ margin-top: 5px;
640
695
  }
641
696
 
642
697
  .constraint-chip {
643
- font-size: 11px;
644
- padding: 2px 8px;
698
+ font-size: 10px;
699
+ padding: 1px 6px;
645
700
  border-radius: 4px;
646
701
  background: var(--code-bg);
647
702
  color: var(--text-muted);
@@ -664,21 +719,21 @@ export const schemaCodeStyles = ` /* ========== RESPONSE SAMPLES (Right Panel
664
719
  .response-accordion {
665
720
  border: 1px solid var(--border-color);
666
721
  border-radius: 8px;
667
- margin-bottom: 10px;
722
+ margin-bottom: 8px;
668
723
  overflow: hidden;
669
724
  }
670
725
 
671
726
  .response-accordion-header {
672
727
  display: flex;
673
728
  align-items: center;
674
- gap: 10px;
729
+ gap: 8px;
675
730
  width: 100%;
676
- padding: 12px 14px;
731
+ padding: 9px 12px;
677
732
  background: var(--code-bg);
678
733
  border: none;
679
734
  cursor: pointer;
680
735
  text-align: left;
681
- font-size: 13px;
736
+ font-size: 12px;
682
737
  color: var(--text-color);
683
738
  transition: background 0.15s;
684
739
  }
@@ -697,8 +752,8 @@ export const schemaCodeStyles = ` /* ========== RESPONSE SAMPLES (Right Panel
697
752
  }
698
753
 
699
754
  .response-status-dot {
700
- width: 9px;
701
- height: 9px;
755
+ width: 8px;
756
+ height: 8px;
702
757
  border-radius: 50%;
703
758
  flex-shrink: 0;
704
759
  }
@@ -718,7 +773,7 @@ export const schemaCodeStyles = ` /* ========== RESPONSE SAMPLES (Right Panel
718
773
  }
719
774
 
720
775
  .response-accordion-body {
721
- padding: 14px;
776
+ padding: 10px 12px;
722
777
  border-top: 1px solid var(--border-color);
723
778
  display: none;
724
779
  }
@@ -726,15 +781,15 @@ export const schemaCodeStyles = ` /* ========== RESPONSE SAMPLES (Right Panel
726
781
  .response-accordion.open .response-accordion-body { display: block; }
727
782
 
728
783
  .response-subhead {
729
- font-size: 11px;
784
+ font-size: 10px;
730
785
  font-weight: 600;
731
786
  text-transform: uppercase;
732
787
  letter-spacing: 0.5px;
733
788
  color: var(--text-muted);
734
- margin: 0 0 8px;
789
+ margin: 0 0 6px;
735
790
  }
736
791
 
737
- .response-block + .response-block { margin-top: 16px; }
792
+ .response-block + .response-block { margin-top: 12px; }
738
793
 
739
794
  /* Multi-language code samples */
740
795
  .http-code-samples {
@@ -756,14 +811,14 @@ export const schemaCodeStyles = ` /* ========== RESPONSE SAMPLES (Right Panel
756
811
 
757
812
  .http-code-sample-pre {
758
813
  margin: 0;
759
- padding: 14px;
814
+ padding: 10px;
760
815
  background: transparent;
761
816
  border: none;
762
817
  border-radius: 0;
763
818
  overflow-x: auto;
764
819
  font-family: 'SF Mono', 'Fira Code', 'Monaco', monospace;
765
- font-size: 12px;
766
- line-height: 1.55;
820
+ font-size: 11px;
821
+ line-height: 1.4;
767
822
  color: var(--text-color);
768
823
  white-space: pre;
769
824
  }
@@ -771,12 +826,12 @@ export const schemaCodeStyles = ` /* ========== RESPONSE SAMPLES (Right Panel
771
826
  .http-code-copy,
772
827
  .sample-code-copy {
773
828
  margin-left: auto;
774
- padding: 4px 10px;
829
+ padding: 3px 8px;
775
830
  background: transparent;
776
831
  border: 1px solid var(--border-color);
777
832
  border-radius: 4px;
778
833
  color: var(--text-muted);
779
- font-size: 11px;
834
+ font-size: 10px;
780
835
  cursor: pointer;
781
836
  transition: all 0.15s;
782
837
  }
@@ -790,7 +845,7 @@ export const schemaCodeStyles = ` /* ========== RESPONSE SAMPLES (Right Panel
790
845
  /* Right panel (third column): keep request/response samples dark & legible
791
846
  regardless of the active theme, matching ReDoc's sample column. */
792
847
  .endpoint-right .endpoint-right-section + .endpoint-right-section {
793
- margin-top: 24px;
848
+ margin-top: 18px;
794
849
  }
795
850
 
796
851
  .endpoint-right .http-code-samples {
@@ -810,9 +865,9 @@ export const schemaCodeStyles = ` /* ========== RESPONSE SAMPLES (Right Panel
810
865
  .response-example-toolbar {
811
866
  display: flex;
812
867
  align-items: center;
813
- gap: 12px;
814
- min-height: 28px;
815
- margin: 4px 0 8px;
868
+ gap: 8px;
869
+ min-height: 24px;
870
+ margin: 2px 0 6px;
816
871
  }
817
872
 
818
873
  .response-example-toolbar .response-example-name {
@@ -821,7 +876,7 @@ export const schemaCodeStyles = ` /* ========== RESPONSE SAMPLES (Right Panel
821
876
 
822
877
  .endpoint-right .sample-code {
823
878
  margin: 0;
824
- padding: 14px;
879
+ padding: 10px;
825
880
  overflow-x: auto;
826
881
  border: 1px solid rgba(255,255,255,0.1);
827
882
  border-radius: 6px;
@@ -834,8 +889,8 @@ export const schemaCodeStyles = ` /* ========== RESPONSE SAMPLES (Right Panel
834
889
  .endpoint-right .sample-code code {
835
890
  color: inherit;
836
891
  font-family: 'SF Mono', 'Fira Code', 'Monaco', monospace;
837
- font-size: 12px;
838
- line-height: 1.55;
892
+ font-size: 11px;
893
+ line-height: 1.4;
839
894
  white-space: inherit;
840
895
  }
841
896
 
@@ -1 +1 @@
1
- {"version":3,"file":"schema-code.js","sourceRoot":"","sources":["../../../../src/docs/ui/style-sections/schema-code.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,gBAAgB,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAynC/B,CAAA"}
1
+ {"version":3,"file":"schema-code.js","sourceRoot":"","sources":["../../../../src/docs/ui/style-sections/schema-code.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,gBAAgB,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAgrC/B,CAAA"}
@@ -23,17 +23,17 @@ export function generateShellStyles(primaryColor, primaryHover, heroBackgroundCS
23
23
  --code-panel-header: #37474f;
24
24
 
25
25
  /* Compact documentation type scale. */
26
- --font-size-body: 14px;
27
- --font-size-small: 13px;
28
- --font-size-xs: 11px;
29
- --font-size-h1: 30px;
30
- --font-size-h2: 24px;
31
- --font-size-h3: 19px;
32
- --font-size-h4: 16px;
33
- --font-size-h5: 14px;
34
- --font-size-h6: 13px;
35
- --font-size-code: 12px;
36
- --line-height-body: 1.6;
26
+ --font-size-body: 13px;
27
+ --font-size-small: 12px;
28
+ --font-size-xs: 10px;
29
+ --font-size-h1: 28px;
30
+ --font-size-h2: 22px;
31
+ --font-size-h3: 18px;
32
+ --font-size-h4: 15px;
33
+ --font-size-h5: 13px;
34
+ --font-size-h6: 12px;
35
+ --font-size-code: 11px;
36
+ --line-height-body: 1.5;
37
37
  --line-height-tight: 1.25;
38
38
  }
39
39
 
@@ -135,7 +135,7 @@ export function generateShellStyles(primaryColor, primaryHover, heroBackgroundCS
135
135
  background: var(--bg-color);
136
136
  color: var(--text-color);
137
137
  font-size: var(--font-size-body);
138
- line-height: 1.6;
138
+ line-height: var(--line-height-body);
139
139
  }
140
140
 
141
141
  code,
@@ -150,9 +150,9 @@ export function generateShellStyles(primaryColor, primaryHover, heroBackgroundCS
150
150
  z-index: 50;
151
151
  display: flex;
152
152
  align-items: center;
153
- gap: 24px;
154
- min-height: 56px;
155
- padding: 0 24px;
153
+ gap: 20px;
154
+ min-height: 48px;
155
+ padding: 0 20px;
156
156
  border-bottom: 1px solid var(--border-color);
157
157
  background: color-mix(in srgb, var(--bg-color) 92%, transparent);
158
158
  backdrop-filter: blur(10px);
@@ -184,7 +184,7 @@ export function generateShellStyles(primaryColor, primaryHover, heroBackgroundCS
184
184
  .top-nav-menu summary {
185
185
  color: var(--text-color);
186
186
  text-decoration: none;
187
- font-size: 14px;
187
+ font-size: var(--font-size-body);
188
188
  font-weight: 500;
189
189
  white-space: nowrap;
190
190
  }
@@ -281,23 +281,23 @@ export function generateShellStyles(primaryColor, primaryHover, heroBackgroundCS
281
281
  .docs-state-pill {
282
282
  display: inline-flex;
283
283
  align-items: center;
284
- gap: 5px;
284
+ gap: 4px;
285
285
  min-width: 0;
286
- height: 26px;
287
- padding: 0 8px;
286
+ height: 22px;
287
+ padding: 0 6px;
288
288
  border: 1px solid var(--border-color);
289
289
  border-radius: 6px;
290
290
  background: color-mix(in srgb, var(--surface-color) 84%, transparent);
291
291
  color: var(--text-secondary);
292
- font-size: 11px;
292
+ font-size: var(--font-size-xs);
293
293
  font-weight: 600;
294
294
  line-height: 1;
295
295
  white-space: nowrap;
296
296
  }
297
297
 
298
298
  .docs-state-dot {
299
- width: 7px;
300
- height: 7px;
299
+ width: 6px;
300
+ height: 6px;
301
301
  border-radius: 999px;
302
302
  background: var(--text-muted);
303
303
  flex: 0 0 auto;