robindoc 3.3.2 → 3.4.0

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 (58) hide show
  1. package/LICENSE +1 -1
  2. package/README.md +1 -1
  3. package/lib/components/blocks/code-section/index.d.ts +3 -0
  4. package/lib/components/blocks/code-section/index.d.ts.map +1 -1
  5. package/lib/components/blocks/code-section/index.js +1 -1
  6. package/lib/components/blocks/code-section/index.js.map +1 -1
  7. package/lib/components/blocks/contents/index.d.ts.map +1 -1
  8. package/lib/components/blocks/contents/index.js +1 -1
  9. package/lib/components/blocks/contents/index.js.map +1 -1
  10. package/lib/components/blocks/no-js/index.js +1 -1
  11. package/lib/components/blocks/no-js/index.js.map +1 -1
  12. package/lib/components/blocks/pagination/index.d.ts +0 -6
  13. package/lib/components/blocks/pagination/index.d.ts.map +1 -1
  14. package/lib/components/blocks/pagination/index.js +1 -1
  15. package/lib/components/blocks/pagination/index.js.map +1 -1
  16. package/lib/components/blocks/theme-detector/index.d.ts.map +1 -1
  17. package/lib/components/blocks/theme-detector/index.js +2 -1
  18. package/lib/components/blocks/theme-detector/index.js.map +1 -1
  19. package/lib/components/contexts/contents/context.d.ts +4 -1
  20. package/lib/components/contexts/contents/context.d.ts.map +1 -1
  21. package/lib/components/contexts/contents/context.js +1 -1
  22. package/lib/components/contexts/contents/context.js.map +1 -1
  23. package/lib/components/contexts/contents/provider.d.ts.map +1 -1
  24. package/lib/components/contexts/contents/provider.js +1 -1
  25. package/lib/components/contexts/contents/provider.js.map +1 -1
  26. package/lib/components/contexts/contents/use-heading-index.d.ts +4 -1
  27. package/lib/components/contexts/contents/use-heading-index.d.ts.map +1 -1
  28. package/lib/components/elements/article/document.d.ts.map +1 -1
  29. package/lib/components/elements/article/document.js +1 -1
  30. package/lib/components/elements/article/document.js.map +1 -1
  31. package/lib/components/elements/article/index.d.ts.map +1 -1
  32. package/lib/components/elements/article/index.js +1 -1
  33. package/lib/components/elements/article/index.js.map +1 -1
  34. package/lib/components/elements/article/utils.d.ts +1 -1
  35. package/lib/components/elements/article/utils.d.ts.map +1 -1
  36. package/lib/components/elements/article/utils.js +1 -1
  37. package/lib/components/elements/article/utils.js.map +1 -1
  38. package/lib/components/elements/robin-provider/index.d.ts +0 -2
  39. package/lib/components/elements/robin-provider/index.d.ts.map +1 -1
  40. package/lib/components/elements/robin-provider/index.js +1 -1
  41. package/lib/components/elements/robin-provider/index.js.map +1 -1
  42. package/lib/components/elements/sidebar/sidebar-drop/index.d.ts.map +1 -1
  43. package/lib/components/elements/sidebar/sidebar-drop/index.js +1 -1
  44. package/lib/components/elements/sidebar/sidebar-drop/index.js.map +1 -1
  45. package/lib/components/ui/copy-button/index.d.ts +1 -2
  46. package/lib/components/ui/copy-button/index.d.ts.map +1 -1
  47. package/lib/components/ui/copy-button/index.js.map +1 -1
  48. package/lib/components/ui/copy-text/index.d.ts +2 -0
  49. package/lib/components/ui/copy-text/index.d.ts.map +1 -1
  50. package/lib/components/ui/copy-text/index.js +1 -1
  51. package/lib/components/ui/copy-text/index.js.map +1 -1
  52. package/lib/components/ui/tabs/tabs-styles/index.js +1 -1
  53. package/lib/components/ui/tabs/tabs-styles/index.js.map +1 -1
  54. package/lib/global.css +24 -0
  55. package/lib/styles.css +393 -450
  56. package/package.json +8 -7
  57. package/lib/components/blocks/theme-styles/index.js +0 -2
  58. package/lib/components/blocks/theme-styles/index.js.map +0 -1
package/lib/styles.css CHANGED
@@ -1,8 +1,8 @@
1
1
  .r-header {
2
2
  position: sticky;
3
- background-color: var(--r-body);
3
+ background-color: var(--r-main-50);
4
4
  top: 0;
5
- border-bottom: 1px solid var(--r-neutral-300);
5
+ border-bottom: 1px solid var(--r-main-300);
6
6
  height: 60px;
7
7
  z-index: 1000;
8
8
  box-sizing: border-box;
@@ -20,12 +20,12 @@
20
20
  .r-header-logo {
21
21
  display: block;
22
22
  margin-right: 24px;
23
- color: var(--r-neutral-700);
23
+ color: var(--r-main-700);
24
24
  transition: color 0.2s;
25
25
  box-sizing: border-box;
26
26
  }
27
27
  .r-header-logo:hover, .r-header-logo:focus {
28
- color: var(--r-neutral-950);
28
+ color: var(--r-main-950);
29
29
  }
30
30
 
31
31
  .r-header-nav {
@@ -40,14 +40,14 @@
40
40
  }
41
41
 
42
42
  .r-header-link {
43
- color: var(--r-neutral-600);
43
+ color: var(--r-main-600);
44
44
  text-decoration: none;
45
45
  padding: 4px 0;
46
46
  transition: color 0.2s;
47
47
  box-sizing: border-box;
48
48
  }
49
49
  .r-header-link:hover, .r-header-link:focus-visible {
50
- color: var(--r-neutral-950);
50
+ color: var(--r-main-950);
51
51
  }
52
52
 
53
53
  .r-header-link._target {
@@ -88,9 +88,9 @@
88
88
  left: 0;
89
89
  }
90
90
  }.r-footer {
91
- border-top: 1px solid var(--r-neutral-300);
92
- padding-top: 24px;
93
- padding-bottom: 24px;
91
+ border-top: 1px solid var(--r-main-300);
92
+ padding-top: 16px;
93
+ padding-bottom: 16px;
94
94
  }
95
95
 
96
96
  .r-footer-row {
@@ -101,79 +101,40 @@
101
101
  }
102
102
 
103
103
  .r-footer-additional {
104
- margin-top: 32px;
104
+ margin-top: 20px;
105
105
  justify-content: flex-end;
106
106
  }
107
107
 
108
108
  .r-copyright {
109
- color: var(--r-neutral-800);
109
+ color: var(--r-main-800);
110
110
  }
111
111
 
112
112
  .r-powered {
113
113
  font-size: 14px;
114
114
  display: block;
115
- color: var(--r-neutral-600);
115
+ color: var(--r-main-600);
116
116
  }
117
117
 
118
118
  .r-powered-link {
119
119
  font-weight: 600;
120
120
  text-decoration: none;
121
- color: var(--r-neutral-950);
121
+ color: var(--r-main-950);
122
122
  }
123
123
  .r-powered-link:hover {
124
124
  color: var(--r-primary-900);
125
125
  }.r-root {
126
- overflow: hidden;
127
- --rb-neutral-50: #f8fafc;
128
- --rb-neutral-100: #f1f5f9;
129
- --rb-neutral-200: #e2e8f0;
130
- --rb-neutral-300: #cbd5e1;
131
- --rb-neutral-400: #94a3b8;
132
- --rb-neutral-500: #64748b;
133
- --rb-neutral-600: #475569;
134
- --rb-neutral-700: #334155;
135
- --rb-neutral-800: #1e293b;
136
- --rb-neutral-900: #0f172a;
137
- --rb-neutral-950: #020617;
138
- --rb-primary-50: #fff7ed;
139
- --rb-primary-100: #ffedd5;
140
- --rb-primary-200: #fed7aa;
141
- --rb-primary-300: #fdba74;
142
- --rb-primary-400: #fb923c;
143
- --rb-primary-500: #f97316;
144
- --rb-primary-600: #ea580c;
145
- --rb-primary-700: #c2410c;
146
- --rb-primary-800: #9a3412;
147
- --rb-primary-900: #7c2d12;
148
- --rb-primary-950: #27130d;
149
- --rb-secondary-50: #eff6ff;
150
- --rb-secondary-100: #dbeafe;
151
- --rb-secondary-200: #bfdbfe;
152
- --rb-secondary-300: #93c5fd;
153
- --rb-secondary-400: #60a5fa;
154
- --rb-secondary-500: #3b82f6;
155
- --rb-secondary-600: #2563eb;
156
- --rb-secondary-700: #1d4ed8;
157
- --rb-secondary-800: #1e40af;
158
- --rb-secondary-900: #1e3a8a;
159
- --rb-secondary-950: #172554;
160
- --rb-body-50: #ffffff;
161
- --rb-body-950: #00020a;
162
- }
163
-
164
- .r-root {
165
126
  --r-header-height: 60px;
166
127
  position: relative;
167
128
  padding: 0;
168
129
  margin: 0;
169
130
  accent-color: var(--r-primary-600, #ea580c);
170
131
  box-sizing: border-box;
171
- background-color: var(--r-body);
172
- color: var(--r-neutral-950);
132
+ background-color: var(--r-main-50);
133
+ color: var(--r-main-950);
173
134
  height: 100dvh;
174
135
  overflow: hidden auto;
175
136
  scroll-padding-top: calc(var(--r-header-height) + 20px);
176
- scrollbar-color: var(--r-neutral-400) var(--r-neutral-200);
137
+ scrollbar-color: var(--r-main-400) var(--r-main-100);
177
138
  white-space: pre-wrap;
178
139
  box-sizing: border-box;
179
140
  }
@@ -207,52 +168,38 @@
207
168
 
208
169
  .r-root.r-theme-light {
209
170
  color-scheme: light;
210
- --r-body: var(--rb-body-50);
211
- --r-neutral-50: var(--rb-neutral-50, #f8fafc);
212
- --r-neutral-100: var(--rb-neutral-100, #f1f5f9);
213
- --r-neutral-200: var(--rb-neutral-200, #e2e8f0);
214
- --r-neutral-300: var(--rb-neutral-300, #cbd5e1);
215
- --r-neutral-400: var(--rb-neutral-400, #94a3b8);
216
- --r-neutral-500: var(--rb-neutral-500, #64748b);
217
- --r-neutral-600: var(--rb-neutral-600, #475569);
218
- --r-neutral-700: var(--rb-neutral-700, #334155);
219
- --r-neutral-800: var(--rb-neutral-800, #1e293b);
220
- --r-neutral-900: var(--rb-neutral-900, #0f172a);
221
- --r-neutral-950: var(--rb-neutral-950, #020617);
222
- --r-primary-50: var(--rb-primary-50, #fff7ed);
223
- --r-primary-100: var(--rb-primary-100, #ffedd5);
224
- --r-primary-200: var(--rb-primary-200, #fed7aa);
225
- --r-primary-300: var(--rb-primary-300, #fdba74);
226
- --r-primary-400: var(--rb-primary-400, #fb923c);
227
- --r-primary-500: var(--rb-primary-500, #f97316);
228
- --r-primary-600: var(--rb-primary-600, #ea580c);
229
- --r-primary-700: var(--rb-primary-700, #c2410c);
230
- --r-primary-800: var(--rb-primary-800, #9a3412);
231
- --r-primary-900: var(--rb-primary-900, #7c2d12);
232
- --r-primary-950: var(--rb-primary-950, #27130d);
233
- --r-secondary-50: var(--rb-secondary-50, #eff6ff);
234
- --r-secondary-100: var(--rb-secondary-100, #dbeafe);
235
- --r-secondary-200: var(--rb-secondary-200, #bfdbfe);
236
- --r-secondary-300: var(--rb-secondary-300, #93c5fd);
237
- --r-secondary-400: var(--rb-secondary-400, #60a5fa);
238
- --r-secondary-500: var(--rb-secondary-500, #3b82f6);
239
- --r-secondary-600: var(--rb-secondary-600, #2563eb);
240
- --r-secondary-700: var(--rb-secondary-700, #1d4ed8);
241
- --r-secondary-800: var(--rb-secondary-800, #1e40af);
242
- --r-secondary-900: var(--rb-secondary-900, #1e3a8a);
243
- --r-secondary-950: var(--rb-secondary-950, #172554);
171
+ --r-main-50: var(--rb-body-50);
172
+ --r-main-50: var(--rb-main-50, oklch(98.5% 0 0deg));
173
+ --r-main-100: var(--rb-main-100, oklch(97% 0 0deg));
174
+ --r-main-200: var(--rb-main-200, oklch(92.2% 0 0deg));
175
+ --r-main-300: var(--rb-main-300, oklch(87% 0 0deg));
176
+ --r-main-400: var(--rb-main-400, oklch(70.8% 0 0deg));
177
+ --r-main-500: var(--rb-main-500, oklch(55.6% 0 0deg));
178
+ --r-main-600: var(--rb-main-600, oklch(43.9% 0 0deg));
179
+ --r-main-700: var(--rb-main-700, oklch(37.1% 0 0deg));
180
+ --r-main-800: var(--rb-main-800, oklch(26.9% 0 0deg));
181
+ --r-main-900: var(--rb-main-900, oklch(20.5% 0 0deg));
182
+ --r-main-950: var(--rb-main-950, oklch(14.5% 0 0deg));
183
+ --r-primary-50: var(--rb-primary-50, oklch(98% 0.016 73.684deg));
184
+ --r-primary-100: var(--rb-primary-100, oklch(95.4% 0.038 75.164deg));
185
+ --r-primary-200: var(--rb-primary-200, oklch(90.1% 0.076 70.697deg));
186
+ --r-primary-300: var(--rb-primary-300, oklch(83.7% 0.128 66.29deg));
187
+ --r-primary-400: var(--rb-primary-400, oklch(75% 0.183 55.934deg));
188
+ --r-primary-500: var(--rb-primary-500, oklch(70.5% 0.213 47.604deg));
189
+ --r-primary-600: var(--rb-primary-600, oklch(64.6% 0.222 41.116deg));
190
+ --r-primary-700: var(--rb-primary-700, oklch(55.3% 0.195 38.402deg));
191
+ --r-primary-800: var(--rb-primary-800, oklch(47% 0.157 37.304deg));
192
+ --r-primary-900: var(--rb-primary-900, oklch(40.8% 0.123 38.172deg));
193
+ --r-primary-950: var(--rb-primary-950, oklch(26.6% 0.079 36.259deg));
244
194
  --r-success: #15803d;
245
195
  --r-note: #0e7490;
246
196
  --r-tip: #047857;
247
197
  --r-important: #a21caf;
248
198
  --r-warning: #b45309;
249
199
  --r-caution: #b91c1c;
250
- --r-link: var(--r-secondary-600);
251
- --r-link-hovered: var(--r-secondary-800);
252
- --r-link-active: var(--r-primary-700);
253
200
  /* SHIKI */
254
201
  --r-cl-1: #f9826c;
255
- --r-cl-2: var(--r-neutral-100);
202
+ --r-cl-2: var(--r-main-100);
256
203
  --r-cl-3: #e1e4e8;
257
204
  --r-cl-4: #2f363d;
258
205
  --r-cl-5: #959da5;
@@ -317,52 +264,37 @@
317
264
 
318
265
  .r-root.r-theme-dark {
319
266
  color-scheme: dark;
320
- --r-body: var(--rb-body-950);
321
- --r-neutral-50: var(--rb-neutral-950, #020617);
322
- --r-neutral-100: var(--rb-neutral-900, #0f172a);
323
- --r-neutral-200: var(--rb-neutral-800, #1e293b);
324
- --r-neutral-300: var(--rb-neutral-700, #334155);
325
- --r-neutral-400: var(--rb-neutral-600, #475569);
326
- --r-neutral-500: var(--rb-neutral-500, #64748b);
327
- --r-neutral-600: var(--rb-neutral-400, #94a3b8);
328
- --r-neutral-700: var(--rb-neutral-300, #cbd5e1);
329
- --r-neutral-800: var(--rb-neutral-200, #e2e8f0);
330
- --r-neutral-900: var(--rb-neutral-100, #f1f5f9);
331
- --r-neutral-950: var(--rb-neutral-50, #f8fafc);
332
- --r-primary-50: var(--rb-primary-950, #27130d);
333
- --r-primary-100: var(--rb-primary-900, #7c2d12);
334
- --r-primary-200: var(--rb-primary-800, #9a3412);
335
- --r-primary-300: var(--rb-primary-700, #c2410c);
336
- --r-primary-400: var(--rb-primary-600, #ea580c);
337
- --r-primary-500: var(--rb-primary-500, #f97316);
338
- --r-primary-600: var(--rb-primary-400, #fb923c);
339
- --r-primary-700: var(--rb-primary-300, #fdba74);
340
- --r-primary-800: var(--rb-primary-200, #fed7aa);
341
- --r-primary-900: var(--rb-primary-100, #ffedd5);
342
- --r-primary-950: var(--rb-primary-50, #fff7ed);
343
- --r-secondary-50: var(--rb-secondary-950, #172554);
344
- --r-secondary-100: var(--rb-secondary-900, #1e3a8a);
345
- --r-secondary-200: var(--rb-secondary-800, #1e40af);
346
- --r-secondary-300: var(--rb-secondary-700, #1d4ed8);
347
- --r-secondary-400: var(--rb-secondary-600, #2563eb);
348
- --r-secondary-500: var(--rb-secondary-500, #3b82f6);
349
- --r-secondary-600: var(--rb-secondary-400, #60a5fa);
350
- --r-secondary-700: var(--rb-secondary-300, #93c5fd);
351
- --r-secondary-800: var(--rb-secondary-200, #bfdbfe);
352
- --r-secondary-900: var(--rb-secondary-100, #dbeafe);
353
- --r-secondary-950: var(--rb-secondary-50, #eff6ff);
267
+ --r-main-50: var(--rb-main-950, oklch(14.5% 0 0deg));
268
+ --r-main-100: var(--rb-main-900, oklch(20.5% 0 0deg));
269
+ --r-main-200: var(--rb-main-800, oklch(26.9% 0 0deg));
270
+ --r-main-300: var(--rb-main-700, oklch(37.1% 0 0deg));
271
+ --r-main-400: var(--rb-main-600, oklch(43.9% 0 0deg));
272
+ --r-main-500: var(--rb-main-500, oklch(55.6% 0 0deg));
273
+ --r-main-600: var(--rb-main-400, oklch(70.8% 0 0deg));
274
+ --r-main-700: var(--rb-main-300, oklch(87% 0 0deg));
275
+ --r-main-800: var(--rb-main-200, oklch(92.2% 0 0deg));
276
+ --r-main-900: var(--rb-main-100, oklch(97% 0 0deg));
277
+ --r-main-950: var(--rb-main-50, oklch(98.5% 0 0deg));
278
+ --r-primary-50: var(--rb-primary-950, oklch(26.6% 0.079 36.259deg));
279
+ --r-primary-100: var(--rb-primary-900, oklch(40.8% 0.123 38.172deg));
280
+ --r-primary-200: var(--rb-primary-800, oklch(47% 0.157 37.304deg));
281
+ --r-primary-300: var(--rb-primary-700, oklch(55.3% 0.195 38.402deg));
282
+ --r-primary-400: var(--rb-primary-600, oklch(64.6% 0.222 41.116deg));
283
+ --r-primary-500: var(--rb-primary-500, oklch(70.5% 0.213 47.604deg));
284
+ --r-primary-600: var(--rb-primary-400, oklch(75% 0.183 55.934deg));
285
+ --r-primary-700: var(--rb-primary-300, oklch(83.7% 0.128 66.29deg));
286
+ --r-primary-800: var(--rb-primary-200, oklch(90.1% 0.076 70.697deg));
287
+ --r-primary-900: var(--rb-primary-100, oklch(95.4% 0.038 75.164deg));
288
+ --r-primary-950: var(--rb-primary-50, oklch(98% 0.016 73.684deg));
354
289
  --r-success: #86efac;
355
290
  --r-note: #22d3ee;
356
291
  --r-tip: #34d399;
357
292
  --r-important: #e879f9;
358
293
  --r-warning: #fbbf24;
359
294
  --r-caution: #f87171;
360
- --r-link: var(--r-secondary-500);
361
- --r-link-hovered: var(--r-secondary-800);
362
- --r-link-active: var(--r-primary-700);
363
295
  /* SHIKI */
364
296
  --r-cl-1: #f9826c;
365
- --r-cl-2: var(--r-neutral-100);
297
+ --r-cl-2: var(--r-main-100);
366
298
  --r-cl-3: #444d56;
367
299
  --r-cl-4: #e1e4e8;
368
300
  --r-cl-5: #959da5;
@@ -422,24 +354,6 @@
422
354
  --r-cl-60: #86181d;
423
355
  --r-cl-61: #144620;
424
356
  --r-cl-62: #c24e00;
425
- }.r-blog-container {
426
- min-height: calc(100dvh - var(--r-header-height));
427
- overflow-wrap: break-word;
428
- box-sizing: border-box;
429
- }
430
- @media screen and (width >= 1180px) {
431
- .r-blog-container {
432
- display: grid;
433
- justify-content: space-between;
434
- column-gap: 40px;
435
- grid-template-areas: "breadcrumbs contents" "content contents" "pagination contents";
436
- grid-template-columns: 760px 220px;
437
- grid-template-rows: auto 1fr auto;
438
- }
439
- }.r-page-container {
440
- min-height: calc(100dvh - var(--r-header-height));
441
- overflow-wrap: break-word;
442
- box-sizing: border-box;
443
357
  }.r-docs-container {
444
358
  min-height: calc(100dvh - var(--r-header-height));
445
359
  overflow-wrap: break-word;
@@ -462,25 +376,46 @@
462
376
  grid-template-columns: 1fr 640px 1fr;
463
377
  grid-template-rows: auto 1fr auto;
464
378
  }
379
+ }.r-blog-container {
380
+ min-height: calc(100dvh - var(--r-header-height));
381
+ overflow-wrap: break-word;
382
+ box-sizing: border-box;
383
+ }
384
+ @media screen and (width >= 1180px) {
385
+ .r-blog-container {
386
+ display: grid;
387
+ justify-content: space-between;
388
+ column-gap: 40px;
389
+ grid-template-areas: "breadcrumbs contents" "content contents" "pagination contents";
390
+ grid-template-columns: 760px 220px;
391
+ grid-template-rows: auto 1fr auto;
392
+ }
393
+ }.r-page-container {
394
+ min-height: calc(100dvh - var(--r-header-height));
395
+ overflow-wrap: break-word;
396
+ box-sizing: border-box;
465
397
  }.keylink-to-content {
466
398
  position: absolute !important;
467
399
  top: 8px;
468
400
  left: 12px;
469
401
  z-index: 1001;
470
- }.keylink-to-navigation {
402
+ }.r-keylink.keylink-to-navigation:focus {
471
403
  margin-top: -40px;
472
404
  }.r-article {
473
- padding: 20px 0 80px;
405
+ padding: 20px 0 40px;
474
406
  grid-area: content;
475
407
  }
476
408
  @media screen and (width >= 1180px) {
477
409
  .r-article {
478
- padding: 32px 0 80px;
410
+ padding: 32px 0 40px;
479
411
  }
480
412
  }
481
413
  .r-article > *:first-child {
482
414
  margin-top: 0;
483
415
  }
416
+ .r-article > *:last-child {
417
+ margin-bottom: 0;
418
+ }
484
419
 
485
420
  .r-checkbox {
486
421
  cursor: pointer;
@@ -529,8 +464,8 @@
529
464
  top: var(--r-header-height);
530
465
  left: 0;
531
466
  margin: 0 -12px;
532
- background-color: var(--r-body);
533
- border-bottom: 1px solid var(--r-neutral-200);
467
+ background-color: var(--r-main-50);
468
+ border-bottom: 1px solid var(--r-main-200);
534
469
  z-index: 10;
535
470
  opacity: 0.98;
536
471
  padding: 0;
@@ -581,7 +516,7 @@
581
516
  right: 0;
582
517
  height: 2px;
583
518
  border-bottom-left-radius: 2px;
584
- background-color: var(--r-neutral-200);
519
+ background-color: var(--r-main-200);
585
520
  z-index: 1;
586
521
  transition: background-color 0.2s cubic-bezier(0, 0.66, 0.58, 1) 0.05s;
587
522
  box-sizing: border-box;
@@ -602,7 +537,7 @@
602
537
  top: var(--r-header-height);
603
538
  overflow: auto;
604
539
  scrollbar-width: thin;
605
- scrollbar-color: var(--r-neutral-200) transparent;
540
+ scrollbar-color: var(--r-main-200) transparent;
606
541
  scrollbar-gutter: stable;
607
542
  max-height: calc(100dvh - var(--r-header-height));
608
543
  }
@@ -628,8 +563,8 @@
628
563
  padding: 12px;
629
564
  background: none;
630
565
  cursor: pointer;
631
- color: var(--r-neutral-800);
632
- background-color: var(--r-body);
566
+ color: var(--r-main-800);
567
+ background-color: var(--r-main-50);
633
568
  z-index: 1;
634
569
  box-sizing: border-box;
635
570
  }
@@ -651,7 +586,7 @@
651
586
  }
652
587
 
653
588
  .r-sidebar-list {
654
- color: var(--r-neutral-700);
589
+ color: var(--r-main-700);
655
590
  list-style: none;
656
591
  padding: 0;
657
592
  margin: 0;
@@ -688,7 +623,7 @@
688
623
  top: -1px;
689
624
  width: 2px;
690
625
  height: calc(100% + 4px);
691
- background-color: var(--r-neutral-200);
626
+ background-color: var(--r-main-200);
692
627
  transition: background-color 0.2s cubic-bezier(0, 0.66, 0.58, 1) 0.05s;
693
628
  box-sizing: border-box;
694
629
  }
@@ -701,7 +636,7 @@
701
636
  }
702
637
 
703
638
  .r-sidebar-li._separator {
704
- background: var(--r-neutral-200);
639
+ background: var(--r-main-200);
705
640
  padding: 1px;
706
641
  }
707
642
 
@@ -719,7 +654,7 @@
719
654
  }
720
655
 
721
656
  .r-sidebar-heading {
722
- color: var(--r-neutral-900);
657
+ color: var(--r-main-900);
723
658
  font-weight: 600;
724
659
  margin-block-end: 4px;
725
660
  }
@@ -739,12 +674,12 @@
739
674
 
740
675
  .r-sidebar-link._target {
741
676
  color: var(--r-primary-950);
742
- background-color: var(--r-neutral-50);
677
+ background-color: var(--r-main-50);
743
678
  }
744
679
 
745
680
  .r-sidebar-link:hover {
746
681
  color: var(--r-primary-800);
747
- background-color: var(--r-neutral-100);
682
+ background-color: var(--r-main-100);
748
683
  transition-delay: initial;
749
684
  }
750
685
  .r-sidebar-link:hover::before {
@@ -754,7 +689,7 @@
754
689
 
755
690
  .r-sidebar-link._active {
756
691
  color: var(--r-primary-700);
757
- background-color: var(--r-neutral-50);
692
+ background-color: var(--r-main-50);
758
693
  }
759
694
  .r-sidebar-link._active::before {
760
695
  background-color: currentColor;
@@ -766,13 +701,11 @@
766
701
  top: 5px;
767
702
  border-radius: 4px;
768
703
  padding: 4px;
769
- background-color: var(--r-neutral-200);
770
704
  list-style: none;
771
705
  cursor: pointer;
772
- transition: background-color 0.2s cubic-bezier(0, 0.66, 0.58, 1) 0.05s, color 0.2s cubic-bezier(0, 0.66, 0.58, 1) 0.05s;
706
+ transition: color 0.2s cubic-bezier(0, 0.66, 0.58, 1) 0.05s;
773
707
  }
774
708
  .r-sidebar-drop-btn:hover {
775
- background-color: var(--r-neutral-300);
776
709
  color: var(--r-primary-500);
777
710
  transition-delay: initial;
778
711
  }
@@ -819,7 +752,7 @@
819
752
  .r-header-responsive {
820
753
  flex-direction: column-reverse;
821
754
  padding: 12px;
822
- background-color: var(--r-body);
755
+ background-color: var(--r-main-50);
823
756
  position: fixed;
824
757
  top: 60px;
825
758
  right: 0;
@@ -858,7 +791,7 @@
858
791
  width: 20px;
859
792
  height: 1.5px;
860
793
  position: absolute;
861
- background-color: var(--r-neutral-700);
794
+ background-color: var(--r-main-700);
862
795
  margin: auto;
863
796
  transition: transform 0.3s;
864
797
  box-sizing: border-box;
@@ -880,110 +813,13 @@
880
813
  .r-header-input:checked ~ .r-header-burger .r-burger-line._bottom {
881
814
  transform: translateY(0) rotate(-45deg);
882
815
  margin-top: 0;
883
- }.r-dropdown {
884
- position: relative;
885
- color: var(--r-neutral-600);
886
- transition: color 0.2s 0.1s;
887
- }
888
- .r-dropdown:hover, .r-dropdown:focus-within {
889
- color: var(--r-neutral-950);
890
- }
891
- .r-dropdown:hover .r-dropdown-drop, .r-dropdown:focus-within .r-dropdown-drop {
892
- visibility: visible;
893
- pointer-events: all;
894
- transform: translateY(20px);
895
- opacity: 1;
896
- }
897
- .r-dropdown:hover .r-dropdown-chevron, .r-dropdown:focus-within .r-dropdown-chevron {
898
- transform: rotate(180deg);
899
- }
900
-
901
- .r-dropdown-summary {
902
- display: flex;
903
- justify-content: space-between;
904
- align-items: center;
905
- width: 100%;
906
- position: relative;
907
- color: inherit;
908
- cursor: pointer;
909
- padding: 10px 4px;
910
- font-size: 16px;
911
- border: 0;
912
- background: none;
913
- z-index: 1;
914
- box-sizing: border-box;
915
- }
916
-
917
- .r-dropdown-chevron {
918
- display: block;
919
- margin-left: 6px;
920
- transition: transform 0.3s 0.1s;
921
- box-sizing: border-box;
922
- }
923
-
924
- .r-dropdown-drop {
925
- list-style: none;
926
- position: absolute;
927
- top: 16px;
928
- left: -12px;
929
- visibility: hidden;
930
- pointer-events: none;
931
- opacity: 0;
932
- transition: transform 0.3s 0.1s, opacity 0.3s 0.1s, visibility 0.3s 0.1s;
933
- background-color: var(--r-neutral-50);
934
- border: 1px solid var(--r-neutral-100);
935
- border-radius: 8px;
936
- margin: 0;
937
- padding: 2px 6px;
938
- min-width: 120px;
939
- max-width: 180px;
940
- box-sizing: border-box;
941
- }
942
-
943
- .r-dropdown-link {
944
- display: block;
945
- width: 100%;
946
- text-decoration: none;
947
- color: var(--r-neutral-700);
948
- padding: 4px 8px;
949
- margin-top: 4px;
950
- margin-bottom: 4px;
951
- border-radius: 4px;
952
- transition: background-color 0.2s;
953
- box-sizing: border-box;
954
- }
955
- .r-dropdown-link:hover {
956
- color: var(--r-neutral-900);
957
- background-color: var(--r-neutral-100);
958
- }
959
-
960
- .r-dropdown-link._active {
961
- color: var(--r-primary-700);
962
- }.r-header-social {
963
- display: flex;
964
- flex: 1;
965
- justify-content: flex-end;
966
- }
967
- @media screen and (width >= 1024px) {
968
- .r-header-social {
969
- flex: none;
970
- justify-content: unset;
971
- }
972
- }
973
-
974
- .r-header-social-git {
975
- color: var(--r-neutral-700);
976
- transition: color 0.2s;
977
- }
978
- .r-header-social-git:hover, .r-header-social-git:focus {
979
- color: var(--r-neutral-950);
980
816
  }.r-search-btn {
981
817
  position: relative;
982
818
  border-radius: 6px;
983
- background-color: var(--r-neutral-100);
984
- color: var(--r-neutral-600);
819
+ background-color: var(--r-main-100);
820
+ color: var(--r-main-600);
985
821
  padding: 8px 20px;
986
- border: 1px solid var(--r-neutral-200);
822
+ border: 1px solid var(--r-main-200);
987
823
  width: 100%;
988
824
  text-align: left;
989
825
  cursor: text;
@@ -996,10 +832,10 @@
996
832
  }
997
833
  }
998
834
  .r-search-btn:hover {
999
- border-color: var(--r-neutral-600);
835
+ border-color: var(--r-main-600);
1000
836
  }
1001
837
  .r-search-btn:hover .r-search-kbd {
1002
- color: var(--r-neutral-950);
838
+ color: var(--r-main-950);
1003
839
  }
1004
840
 
1005
841
  .r-search-title {
@@ -1024,15 +860,15 @@
1024
860
 
1025
861
  .r-search-popup-header {
1026
862
  position: relative;
1027
- border-bottom: 1px solid var(--r-neutral-200);
863
+ border-bottom: 1px solid var(--r-main-200);
1028
864
  }
1029
865
 
1030
866
  .r-search-input {
1031
867
  border-radius: 12px 12px 0 0;
1032
- background-color: var(--r-neutral-50);
868
+ background-color: var(--r-main-50);
1033
869
  padding: 16px 20px;
1034
870
  border: none;
1035
- border-bottom: 2px solid var(--r-neutral-300);
871
+ border-bottom: 2px solid var(--r-main-300);
1036
872
  width: 100%;
1037
873
  font-size: 16px;
1038
874
  box-sizing: border-box;
@@ -1050,11 +886,11 @@
1050
886
  border-bottom-color: var(--r-primary-600);
1051
887
  }
1052
888
  .r-search-input::placeholder {
1053
- color: var(--r-neutral-500);
889
+ color: var(--r-main-500);
1054
890
  }
1055
891
 
1056
892
  .r-search-popup-kbd {
1057
- color: var(--r-neutral-600);
893
+ color: var(--r-main-600);
1058
894
  right: 20px;
1059
895
  }
1060
896
 
@@ -1064,7 +900,7 @@
1064
900
  overflow-y: auto;
1065
901
  list-style: none;
1066
902
  scrollbar-width: thin;
1067
- scrollbar-color: var(--r-neutral-200) transparent;
903
+ scrollbar-color: var(--r-main-200) transparent;
1068
904
  margin: 0;
1069
905
  box-sizing: border-box;
1070
906
  }
@@ -1072,17 +908,17 @@
1072
908
  .r-search-item {
1073
909
  display: block;
1074
910
  text-decoration: none;
1075
- color: var(--r-neutral-700);
911
+ color: var(--r-main-700);
1076
912
  padding: 8px 12px;
1077
- border: 1px solid var(--r-neutral-100);
913
+ border: 1px solid var(--r-main-100);
1078
914
  border-radius: 6px;
1079
915
  width: 100%;
1080
916
  margin-top: 6px;
1081
917
  box-sizing: border-box;
1082
918
  }
1083
919
  .r-search-item:hover, .r-search-item:focus {
1084
- color: var(--r-neutral-950);
1085
- background-color: var(--r-neutral-50);
920
+ color: var(--r-main-950);
921
+ background-color: var(--r-main-50);
1086
922
  }
1087
923
 
1088
924
  .r-search-item-title {
@@ -1091,8 +927,105 @@
1091
927
 
1092
928
  .r-search-item-desc {
1093
929
  font-size: 14px;
1094
- color: var(--r-neutral-600);
930
+ color: var(--r-main-600);
1095
931
  margin: 12px 0 0;
932
+ }.r-header-social {
933
+ display: flex;
934
+ flex: 1;
935
+ justify-content: flex-end;
936
+ }
937
+ @media screen and (width >= 1024px) {
938
+ .r-header-social {
939
+ flex: none;
940
+ justify-content: unset;
941
+ }
942
+ }
943
+
944
+ .r-header-social-git {
945
+ color: var(--r-main-700);
946
+ transition: color 0.2s;
947
+ }
948
+ .r-header-social-git:hover, .r-header-social-git:focus {
949
+ color: var(--r-main-950);
950
+ }.r-dropdown {
951
+ position: relative;
952
+ color: var(--r-main-600);
953
+ transition: color 0.2s 0.1s;
954
+ }
955
+ .r-dropdown:hover, .r-dropdown:focus-within {
956
+ color: var(--r-main-950);
957
+ }
958
+ .r-dropdown:hover .r-dropdown-drop, .r-dropdown:focus-within .r-dropdown-drop {
959
+ visibility: visible;
960
+ pointer-events: all;
961
+ transform: translateY(20px);
962
+ opacity: 1;
963
+ }
964
+ .r-dropdown:hover .r-dropdown-chevron, .r-dropdown:focus-within .r-dropdown-chevron {
965
+ transform: rotate(180deg);
966
+ }
967
+
968
+ .r-dropdown-summary {
969
+ display: flex;
970
+ justify-content: space-between;
971
+ align-items: center;
972
+ width: 100%;
973
+ position: relative;
974
+ color: inherit;
975
+ cursor: pointer;
976
+ padding: 10px 4px;
977
+ font-size: 16px;
978
+ border: 0;
979
+ background: none;
980
+ z-index: 1;
981
+ box-sizing: border-box;
982
+ }
983
+
984
+ .r-dropdown-chevron {
985
+ display: block;
986
+ margin-left: 6px;
987
+ transition: transform 0.3s 0.1s;
988
+ box-sizing: border-box;
989
+ }
990
+
991
+ .r-dropdown-drop {
992
+ list-style: none;
993
+ position: absolute;
994
+ top: 16px;
995
+ left: -12px;
996
+ visibility: hidden;
997
+ pointer-events: none;
998
+ opacity: 0;
999
+ transition: transform 0.3s 0.1s, opacity 0.3s 0.1s, visibility 0.3s 0.1s;
1000
+ background-color: var(--r-main-50);
1001
+ border: 1px solid var(--r-main-100);
1002
+ border-radius: 8px;
1003
+ margin: 0;
1004
+ padding: 2px 6px;
1005
+ min-width: 120px;
1006
+ max-width: 180px;
1007
+ box-sizing: border-box;
1008
+ }
1009
+
1010
+ .r-dropdown-link {
1011
+ display: block;
1012
+ width: 100%;
1013
+ text-decoration: none;
1014
+ color: var(--r-main-700);
1015
+ padding: 4px 8px;
1016
+ margin-top: 4px;
1017
+ margin-bottom: 4px;
1018
+ border-radius: 4px;
1019
+ transition: background-color 0.2s;
1020
+ box-sizing: border-box;
1021
+ }
1022
+ .r-dropdown-link:hover {
1023
+ color: var(--r-main-900);
1024
+ background-color: var(--r-main-100);
1025
+ }
1026
+
1027
+ .r-dropdown-link._active {
1028
+ color: var(--r-primary-700);
1096
1029
  }.r-container {
1097
1030
  max-width: 1180px;
1098
1031
  padding-right: 12px;
@@ -1107,7 +1040,7 @@
1107
1040
  width: 108px;
1108
1041
  height: 36px;
1109
1042
  padding: 2px;
1110
- background-color: var(--r-neutral-950);
1043
+ background-color: var(--r-main-950);
1111
1044
  border-radius: 14px;
1112
1045
  box-sizing: border-box;
1113
1046
  }
@@ -1119,7 +1052,7 @@
1119
1052
  width: 32px;
1120
1053
  top: 2px;
1121
1054
  left: 2px;
1122
- background-color: var(--r-body);
1055
+ background-color: var(--r-main-50);
1123
1056
  border-radius: 12px;
1124
1057
  transition: left 0.2s;
1125
1058
  box-sizing: border-box;
@@ -1131,14 +1064,14 @@
1131
1064
  border: 0;
1132
1065
  border-radius: 12px;
1133
1066
  cursor: pointer;
1134
- color: var(--r-neutral-50);
1135
- fill: var(--r-neutral-950);
1067
+ color: var(--r-main-50);
1068
+ fill: var(--r-main-950);
1136
1069
  z-index: 1;
1137
1070
  transition: color 0.2s 0.1s, fill 0.2s;
1138
1071
  }
1139
1072
  .r-theme-switcher-btn:hover {
1140
- color: var(--r-neutral-50);
1141
- fill: var(--r-neutral-50);
1073
+ color: var(--r-main-50);
1074
+ fill: var(--r-main-50);
1142
1075
  }
1143
1076
 
1144
1077
  .r-theme-dark:not(.r-theme-system) .r-theme-switcher::before {
@@ -1146,7 +1079,7 @@
1146
1079
  }
1147
1080
 
1148
1081
  .r-theme-dark:not(.r-theme-system) .r-theme-switcher-btn__dark {
1149
- color: var(--r-neutral-950);
1082
+ color: var(--r-main-950);
1150
1083
  pointer-events: none;
1151
1084
  }
1152
1085
 
@@ -1156,7 +1089,7 @@
1156
1089
  }
1157
1090
 
1158
1091
  .r-theme-system .r-theme-switcher-btn__system {
1159
- color: var(--r-neutral-950);
1092
+ color: var(--r-main-950);
1160
1093
  pointer-events: none;
1161
1094
  }
1162
1095
 
@@ -1165,7 +1098,7 @@
1165
1098
  }
1166
1099
 
1167
1100
  .r-theme-light:not(.r-theme-system) .r-theme-switcher-btn__light {
1168
- color: var(--r-neutral-950);
1101
+ color: var(--r-main-950);
1169
1102
  pointer-events: none;
1170
1103
  }
1171
1104
 
@@ -1175,10 +1108,10 @@
1175
1108
  display: block;
1176
1109
  position: relative;
1177
1110
  padding: 8px 12px;
1178
- border: 2px solid var(--r-neutral-500);
1111
+ border: 2px solid var(--r-main-500);
1179
1112
  border-radius: 6px;
1180
1113
  text-decoration: none;
1181
- background: var(--r-body);
1114
+ background: var(--r-main-50);
1182
1115
  }
1183
1116
 
1184
1117
  .r-keylink:not(:focus) {
@@ -1191,6 +1124,47 @@
1191
1124
  user-select: none;
1192
1125
  pointer-events: none;
1193
1126
  box-sizing: border-box;
1127
+ }.r-breadcrumbs {
1128
+ grid-area: breadcrumbs;
1129
+ list-style: none;
1130
+ margin: 0;
1131
+ padding: 20px 0 0;
1132
+ line-height: 2;
1133
+ }
1134
+ @media screen and (width >= 768px) {
1135
+ .r-breadcrumbs {
1136
+ padding: 32px 0 0;
1137
+ }
1138
+ }
1139
+
1140
+ .r-breadcrumb {
1141
+ display: inline;
1142
+ }
1143
+
1144
+ .r-breadcrumb._previous::after {
1145
+ content: "/";
1146
+ font-weight: 600;
1147
+ margin-inline: 8px;
1148
+ }
1149
+
1150
+ .r-breadcrumb-link {
1151
+ color: var(--r-main-700);
1152
+ text-decoration: none;
1153
+ }
1154
+ .r-breadcrumb-link:hover {
1155
+ color: var(--r-primary-800);
1156
+ }
1157
+
1158
+ .r-breadcrumb-link,
1159
+ .r-breadcrumb-title {
1160
+ display: inline;
1161
+ padding: 6px 0;
1162
+ margin: 0;
1163
+ }
1164
+
1165
+ .r-breadcrumb-title {
1166
+ color: var(--r-main-950);
1167
+ font-weight: 600;
1194
1168
  }.r-contents {
1195
1169
  grid-area: contents;
1196
1170
  }
@@ -1207,7 +1181,7 @@
1207
1181
  max-height: calc(100dvh - var(--r-header-height));
1208
1182
  overflow: auto;
1209
1183
  scrollbar-width: thin;
1210
- scrollbar-color: var(--r-neutral-200) transparent;
1184
+ scrollbar-color: var(--r-main-200) transparent;
1211
1185
  scrollbar-gutter: stable;
1212
1186
  }
1213
1187
  }
@@ -1233,7 +1207,7 @@
1233
1207
  }
1234
1208
  @media screen and (width < 1180px) {
1235
1209
  .r-contents-control:checked + .r-contents-details .r-contents-title {
1236
- color: var(--r-neutral-800);
1210
+ color: var(--r-main-800);
1237
1211
  }
1238
1212
  }
1239
1213
  .r-contents-control:checked + .r-contents-details .r-contents-chevron {
@@ -1258,7 +1232,7 @@
1258
1232
 
1259
1233
  @media screen and (width < 1180px) {
1260
1234
  .r-contents-details {
1261
- background: var(--r-neutral-100);
1235
+ background: var(--r-main-100);
1262
1236
  border-radius: 4px;
1263
1237
  }
1264
1238
  }
@@ -1270,7 +1244,7 @@
1270
1244
  cursor: pointer;
1271
1245
  margin-top: 20px;
1272
1246
  padding: 12px;
1273
- color: var(--r-neutral-600);
1247
+ color: var(--r-main-600);
1274
1248
  z-index: 1;
1275
1249
  }
1276
1250
  @media screen and (width < 1180px) {
@@ -1282,8 +1256,8 @@
1282
1256
  }
1283
1257
  @media screen and (width >= 1180px) {
1284
1258
  .r-contents-title {
1285
- color: var(--r-neutral-900);
1286
- background: var(--r-body);
1259
+ color: var(--r-main-900);
1260
+ background: var(--r-main-50);
1287
1261
  font-weight: 600;
1288
1262
  margin-top: 0;
1289
1263
  padding: 32px 0 12px;
@@ -1292,7 +1266,7 @@
1292
1266
  }
1293
1267
  @media screen and (width < 1180px) {
1294
1268
  .r-contents-title:hover {
1295
- color: var(--r-neutral-900);
1269
+ color: var(--r-main-900);
1296
1270
  }
1297
1271
  }
1298
1272
 
@@ -1311,7 +1285,7 @@
1311
1285
  .r-contents-link {
1312
1286
  display: block;
1313
1287
  position: relative;
1314
- color: var(--r-neutral-600);
1288
+ color: var(--r-main-600);
1315
1289
  text-decoration: none;
1316
1290
  padding-top: 4px;
1317
1291
  padding-bottom: 4px;
@@ -1338,7 +1312,7 @@
1338
1312
  box-sizing: border-box;
1339
1313
  }
1340
1314
  .r-contents-link::before {
1341
- border-color: var(--r-neutral-200);
1315
+ border-color: var(--r-main-200);
1342
1316
  }
1343
1317
  .r-contents-link::after {
1344
1318
  mask-image: linear-gradient(135deg, #000 50%, transparent 50%);
@@ -1372,29 +1346,29 @@
1372
1346
  mask-position: 0 100% !important;
1373
1347
  }
1374
1348
 
1375
- .r-contents-link._nested + .r-contents-link._passed:not(._nested)::after {
1349
+ .r-contents-link._nested + .r-contents-link._visited:not(._nested)::after {
1376
1350
  mask-position: 100% 0 !important;
1377
1351
  }
1378
1352
 
1379
1353
  @media screen and (width >= 1180px) {
1380
- .r-contents-link._passed {
1381
- color: var(--r-neutral-800);
1354
+ .r-contents-link._visited {
1355
+ color: var(--r-main-600);
1382
1356
  }
1383
1357
  }
1384
1358
  @media screen and (width >= 1180px) {
1385
- .r-contents-link._passed::after {
1359
+ .r-contents-link._visited::after {
1386
1360
  mask-position: 0 0 !important;
1387
1361
  }
1388
1362
  }
1363
+ .r-contents-link._visited::after, .r-contents-link._visited + .r-contents-link::after {
1364
+ transition: mask-position 0.3s;
1365
+ }
1389
1366
 
1390
1367
  @media screen and (width >= 1180px) {
1391
1368
  .r-contents-link._active {
1392
- color: var(--r-primary-800);
1369
+ color: var(--r-main-900);
1393
1370
  }
1394
1371
  }
1395
- .r-contents-link._active::after, .r-contents-link._active + .r-contents-link::after {
1396
- transition: mask-position 0.3s;
1397
- }
1398
1372
 
1399
1373
  .r-contents-actions {
1400
1374
  position: sticky;
@@ -1402,7 +1376,7 @@
1402
1376
  padding-top: 2px;
1403
1377
  padding-bottom: 2px;
1404
1378
  margin-top: 20px;
1405
- background-color: var(--r-body);
1379
+ background-color: var(--r-main-50);
1406
1380
  }
1407
1381
  @media screen and (width < 1180px) {
1408
1382
  .r-contents-actions {
@@ -1414,7 +1388,7 @@
1414
1388
  display: block;
1415
1389
  width: 100%;
1416
1390
  position: relative;
1417
- color: var(--r-neutral-600);
1391
+ color: var(--r-main-600);
1418
1392
  text-decoration: none;
1419
1393
  padding-top: 10px;
1420
1394
  padding-bottom: 10px;
@@ -1423,54 +1397,13 @@
1423
1397
  box-sizing: border-box;
1424
1398
  }
1425
1399
  .r-contents-git:hover {
1426
- color: var(--r-neutral-900);
1427
- }.r-breadcrumbs {
1428
- grid-area: breadcrumbs;
1429
- list-style: none;
1430
- margin: 0;
1431
- padding: 20px 0 0;
1432
- line-height: 2;
1433
- }
1434
- @media screen and (width >= 768px) {
1435
- .r-breadcrumbs {
1436
- padding: 32px 0 0;
1437
- }
1438
- }
1439
-
1440
- .r-breadcrumb {
1441
- display: inline;
1442
- }
1443
-
1444
- .r-breadcrumb._previous::after {
1445
- content: "/";
1446
- font-weight: 600;
1447
- margin-inline: 8px;
1448
- }
1449
-
1450
- .r-breadcrumb-link {
1451
- color: var(--r-neutral-700);
1452
- text-decoration: none;
1453
- }
1454
- .r-breadcrumb-link:hover {
1455
- color: var(--r-primary-800);
1456
- }
1457
-
1458
- .r-breadcrumb-link,
1459
- .r-breadcrumb-title {
1460
- display: inline;
1461
- padding: 6px 0;
1462
- margin: 0;
1463
- }
1464
-
1465
- .r-breadcrumb-title {
1466
- color: var(--r-neutral-950);
1467
- font-weight: 600;
1400
+ color: var(--r-main-900);
1468
1401
  }.r-pagination {
1469
1402
  grid-area: pagination;
1470
1403
  display: grid;
1471
1404
  grid-template-columns: repeat(auto-fit, minmax(148px, 1fr));
1472
1405
  gap: 16px;
1473
- margin-bottom: 80px;
1406
+ margin-bottom: 40px;
1474
1407
  }
1475
1408
 
1476
1409
  .r-pagination-item {
@@ -1479,19 +1412,19 @@
1479
1412
  padding-bottom: 8px;
1480
1413
  text-decoration: none;
1481
1414
  font-size: 14px;
1482
- color: var(--r-neutral-700);
1415
+ color: var(--r-main-800);
1483
1416
  }
1484
1417
  .r-pagination-item:hover {
1485
- color: var(--r-neutral-900);
1418
+ color: var(--r-main-950);
1486
1419
  }
1487
1420
 
1488
1421
  .r-pagination-item._prev {
1489
- padding-left: 32px;
1422
+ padding-left: 28px;
1490
1423
  }
1491
1424
 
1492
1425
  .r-pagination-item._next {
1493
1426
  text-align: right;
1494
- padding-right: 32px;
1427
+ padding-right: 28px;
1495
1428
  }
1496
1429
 
1497
1430
  .r-pagination-text {
@@ -1501,8 +1434,7 @@
1501
1434
 
1502
1435
  .r-pagination-title {
1503
1436
  font-weight: 600;
1504
- font-size: 18px;
1505
- color: var(--r-neutral-950);
1437
+ font-size: 16px;
1506
1438
  }
1507
1439
 
1508
1440
  .r-pagination-icon {
@@ -1510,7 +1442,6 @@
1510
1442
  top: 50%;
1511
1443
  transform: translateY(-50%);
1512
1444
  transition: transform 0.2s;
1513
- margin: -4px;
1514
1445
  }
1515
1446
 
1516
1447
  .r-pagination-icon._prev {
@@ -1540,7 +1471,7 @@
1540
1471
  .r-pagination-svg {
1541
1472
  display: block;
1542
1473
  }.r-last-modified {
1543
- color: var(--r-neutral-700);
1474
+ color: var(--r-main-700);
1544
1475
  margin-block-start: 16px;
1545
1476
  }.r-git-logo {
1546
1477
  display: block;
@@ -1586,11 +1517,11 @@
1586
1517
  transition: opacity 0.3s allow-discrete;
1587
1518
  padding-inline: 8px;
1588
1519
  margin-inline-start: -4px;
1589
- color: var(--r-neutral-600);
1520
+ color: var(--r-main-600);
1590
1521
  text-decoration: none;
1591
1522
  }
1592
1523
  .r-anchor-heading-link:hover {
1593
- color: var(--r-link-base-hovered);
1524
+ color: var(--r-primary-800);
1594
1525
  }
1595
1526
  .r-anchor-heading-link::after {
1596
1527
  content: "#";
@@ -1598,6 +1529,10 @@
1598
1529
  position: relative;
1599
1530
  margin-block-start: 1.5em;
1600
1531
  margin-block-end: 1.75em;
1532
+ background-color: var(--r-main-100);
1533
+ padding: 3px;
1534
+ border-radius: 8px;
1535
+ border: 1px solid var(--r-main-200);
1601
1536
  }
1602
1537
 
1603
1538
  .r-code-section-header {
@@ -1607,16 +1542,16 @@
1607
1542
  align-items: center;
1608
1543
  border-top-left-radius: 6px;
1609
1544
  border-top-right-radius: 6px;
1610
- padding: 6px 20px;
1611
- background-color: var(--r-neutral-100);
1612
- border: 1px solid var(--r-neutral-300);
1613
- color: var(--r-neutral-700);
1545
+ padding-left: 20px;
1546
+ color: var(--r-main-700);
1547
+ }
1548
+
1549
+ .r-code-section-block._space-right {
1550
+ padding-right: 3rem;
1614
1551
  }
1615
1552
 
1616
1553
  .r-code-section-header + .r-code-section-block {
1617
- border-top-left-radius: 0;
1618
- border-top-right-radius: 0;
1619
- border-top: 0;
1554
+ border: 0;
1620
1555
  margin-block-start: 0;
1621
1556
  margin-block-end: 0;
1622
1557
  }
@@ -1630,6 +1565,9 @@
1630
1565
  right: 9px;
1631
1566
  top: 9px;
1632
1567
  opacity: 0;
1568
+ background: color-mix(in oklab, var(--r-main-100) 90%, transparent);
1569
+ border: 2px solid var(--r-main-50);
1570
+ backdrop-filter: blur(2px);
1633
1571
  transition: opacity 0.2s, color 0.2s, background-color 0.2s;
1634
1572
  }
1635
1573
  .r-code-section-copy.r-code-section-copy:hover, .r-code-section-copy.r-code-section-copy._active {
@@ -1644,12 +1582,12 @@
1644
1582
  margin-block-start: 12px;
1645
1583
  margin-block-end: 12px;
1646
1584
  scrollbar-width: thin;
1647
- scrollbar-color: var(--r-neutral-200) transparent;
1585
+ scrollbar-color: var(--r-main-200) transparent;
1648
1586
  box-sizing: border-box;
1649
1587
  }.r-blockquote {
1650
- background-color: var(--r-neutral-100);
1588
+ background-color: var(--r-main-100);
1651
1589
  padding: 8px 12px 8px 20px;
1652
- border-left: 6px solid var(--r-neutral-600);
1590
+ border-left: 6px solid var(--r-main-600);
1653
1591
  border-top-right-radius: 2px;
1654
1592
  border-bottom-right-radius: 2px;
1655
1593
  font: inherit;
@@ -1702,33 +1640,33 @@
1702
1640
  }
1703
1641
  .r-blockquote-caution .r-blockquote-title {
1704
1642
  color: var(--r-caution);
1705
- }.r-code-span {
1706
- font-family: var(--monospace-font, monospace, monospace);
1707
- background-color: var(--r-neutral-200);
1708
- color: var(--r-primary-900);
1709
- border-radius: 4px;
1710
- padding: 2px 6px;
1711
- font-size: 16px;
1712
- letter-spacing: 0.5px;
1713
- }
1714
-
1715
- .r-code-span + .r-content-link-external {
1716
- margin-left: -12px;
1717
1643
  }.r-code-block {
1718
1644
  font-family: var(--monospace-font, monospace, monospace);
1719
1645
  font-size: 16px;
1720
1646
  line-height: 1.33;
1721
1647
  border-radius: 6px;
1722
1648
  padding: 16px 20px;
1723
- margin-block-start: 1.5em;
1724
- margin-block-end: 1.75em;
1649
+ margin: 0;
1725
1650
  color: var(--r-primary-800);
1726
- background-color: var(--r-neutral-50);
1727
- border: 1px solid var(--r-neutral-300);
1651
+ background-color: var(--r-main-50);
1728
1652
  overflow-x: auto;
1729
1653
  scrollbar-width: thin;
1730
- scrollbar-color: var(--r-neutral-200) transparent;
1654
+ scrollbar-color: var(--r-main-200) transparent;
1731
1655
  box-sizing: border-box;
1656
+ }.r-code-span {
1657
+ font-family: var(--monospace-font, monospace, monospace);
1658
+ background-color: var(--r-main-100);
1659
+ border: 1px solid var(--r-main-200);
1660
+ color: var(--r-main-950);
1661
+ border-radius: 4px;
1662
+ padding: 2px 6px;
1663
+ font-size: inherit;
1664
+ font-weight: 500;
1665
+ letter-spacing: 0.5px;
1666
+ }
1667
+
1668
+ .r-code-span + .r-content-link-external {
1669
+ margin-left: -12px;
1732
1670
  }.r-h1 {
1733
1671
  font-size: 32px;
1734
1672
  line-height: 1.4;
@@ -1787,44 +1725,58 @@
1787
1725
  }
1788
1726
 
1789
1727
  .r-tab-list .r-code-section,
1790
- .r-tab-list .r-code-block,
1791
1728
  .r-tab-list .r-code-section-header {
1792
1729
  margin-block-start: 0;
1793
1730
  margin-block-end: 0;
1794
- border-top-left-radius: 0;
1795
- border-top-right-radius: 0;
1796
- background-color: var(--r-neutral-50);
1797
1731
  }
1798
1732
 
1799
1733
  .r-tabs-header {
1800
1734
  display: flex;
1735
+ margin: 0 12px;
1736
+ text-wrap: nowrap;
1737
+ overflow-x: auto;
1738
+ scrollbar-width: thin;
1801
1739
  }
1802
1740
 
1803
1741
  .r-tab-header {
1804
1742
  position: relative;
1805
1743
  cursor: pointer;
1806
- border: 1px solid var(--r-neutral-300);
1807
- color: var(--r-neutral-600);
1808
- border-bottom: 0;
1809
- margin-bottom: -1px;
1810
- background-color: var(--r-body);
1744
+ color: var(--r-main-600);
1811
1745
  border-top-left-radius: 4px;
1812
1746
  border-top-right-radius: 4px;
1813
- padding: 8px 20px;
1747
+ padding: 8px 12px 2px;
1748
+ border-bottom: 1px solid transparent;
1749
+ transition: border 0.2s ease, color 0.2s ease;
1814
1750
  }
1815
1751
  .r-tab-header:hover {
1816
- background-color: var(--r-neutral-50);
1817
- color: var(--r-primary-600);
1752
+ border-color: var(--r-main-500);
1753
+ color: var(--r-main-800);
1818
1754
  }
1819
1755
 
1820
1756
  .r-tab-header-code {
1821
1757
  font-family: var(--monospace-font, monospace, monospace);
1758
+ }.r-kbd-container {
1759
+ display: flex;
1760
+ gap: 4px;
1761
+ font-size: 14px;
1762
+ cursor: pointer;
1763
+ }
1764
+ .r-kbd-container:hover {
1765
+ color: var(--r-main-950);
1766
+ }.r-kbd-key {
1767
+ background-color: var(--r-main-200);
1768
+ font-size: 12px;
1769
+ border-radius: 4px;
1770
+ padding: 5px 8px;
1771
+ min-width: 24px;
1772
+ text-align: center;
1773
+ box-sizing: border-box;
1822
1774
  }.r-modal {
1823
1775
  position: fixed;
1824
1776
  left: 0;
1825
1777
  bottom: 0;
1826
1778
  width: 100%;
1827
- background-color: var(--r-body);
1779
+ background-color: var(--r-main-50);
1828
1780
  border-radius: 12px 12px 0 0;
1829
1781
  opacity: 0;
1830
1782
  visibility: hidden;
@@ -1854,28 +1806,11 @@
1854
1806
  .r-modal._visible {
1855
1807
  transform: translateX(-50%) scale(1);
1856
1808
  }
1857
- }.r-kbd-container {
1858
- display: flex;
1859
- gap: 4px;
1860
- font-size: 14px;
1861
- cursor: pointer;
1862
- }
1863
- .r-kbd-container:hover {
1864
- color: var(--r-neutral-950);
1865
- }.r-kbd-key {
1866
- background-color: var(--r-neutral-200);
1867
- font-size: 12px;
1868
- border-radius: 4px;
1869
- padding: 5px 8px;
1870
- min-width: 24px;
1871
- text-align: center;
1872
- box-sizing: border-box;
1873
1809
  }.r-copy-button {
1874
1810
  position: relative;
1875
- padding: 8px;
1811
+ padding: 6px;
1876
1812
  background: none;
1877
- color: var(--r-neutral-700);
1878
- background-color: var(--r-neutral-100);
1813
+ color: var(--r-main-700);
1879
1814
  border: 0;
1880
1815
  border-radius: 6px;
1881
1816
  cursor: pointer;
@@ -1886,16 +1821,15 @@
1886
1821
  .r-copy-button-success {
1887
1822
  opacity: 0;
1888
1823
  transform: scale(0.7);
1889
- transition: 0.2s;
1824
+ transition: transform 0.2s;
1890
1825
  }
1891
1826
 
1892
1827
  .r-copy-button-base {
1893
- transition: 0.2s;
1828
+ transition: transform 0.2s;
1894
1829
  }
1895
1830
 
1896
1831
  .r-copy-button:hover {
1897
- color: var(--r-neutral-950);
1898
- background-color: var(--r-neutral-200);
1832
+ color: var(--r-main-950);
1899
1833
  }
1900
1834
 
1901
1835
  .r-copy-button:active,
@@ -1922,20 +1856,22 @@
1922
1856
  border: 0;
1923
1857
  padding: 0;
1924
1858
  font: inherit;
1859
+ padding: 6px 0;
1925
1860
  }
1926
1861
  .r-copy-text:hover {
1927
- color: var(--r-neutral-950);
1862
+ color: var(--r-main-950);
1928
1863
  }
1929
1864
  .r-copy-text::before {
1930
1865
  content: "";
1931
1866
  position: absolute;
1932
- bottom: -2px;
1867
+ bottom: 0;
1933
1868
  left: 0;
1934
1869
  width: 100%;
1935
1870
  height: 1px;
1936
1871
  background: linear-gradient(to right, currentColor 30%, transparent 0%, transparent 80%, currentColor 80%) repeat-x 0px/8px;
1937
1872
  transition: background 0.2s;
1938
1873
  box-sizing: border-box;
1874
+ opacity: 0.6;
1939
1875
  }
1940
1876
 
1941
1877
  .r-copy-text:active,
@@ -1943,13 +1879,20 @@
1943
1879
  color: var(--r-success);
1944
1880
  }.r-content-link {
1945
1881
  text-decoration: none;
1946
- color: var(--r-link);
1882
+ color: inherit;
1883
+ text-decoration: underline;
1884
+ text-decoration-color: var(--r-primary-500);
1885
+ text-underline-offset: 3px;
1886
+ transition: text-decoration-offset 0.2s ease;
1947
1887
  }
1948
1888
  .r-content-link:hover {
1949
- color: var(--r-link-hovered);
1889
+ color: var(--r-main-700);
1890
+ text-decoration-color: var(--r-primary-400);
1891
+ text-underline-offset: 2px;
1892
+ text-decoration-thickness: 2px;
1950
1893
  }
1951
1894
  .r-content-link:active {
1952
- color: var(--r-link-active);
1895
+ color: var(--r-primary-600);
1953
1896
  }
1954
1897
 
1955
1898
  .r-content-link-external {
@@ -1983,11 +1926,6 @@
1983
1926
  background-color: currentColor;
1984
1927
  border-radius: 0 0 0 4px;
1985
1928
  box-sizing: border-box;
1986
- }.r-ol {
1987
- padding-inline-start: 0;
1988
- list-style-position: inside;
1989
- margin-block-start: 1em;
1990
- margin-block-end: 1em;
1991
1929
  }.r-li {
1992
1930
  line-height: 1.8;
1993
1931
  margin-block-start: 6px;
@@ -2000,8 +1938,11 @@
2000
1938
  margin-block-start: 6px;
2001
1939
  margin-block-end: 6px;
2002
1940
  }.r-ul {
2003
- padding-inline-start: 0;
2004
- list-style-position: inside;
1941
+ padding-inline-start: 2rem;
1942
+ margin-block-start: 1em;
1943
+ margin-block-end: 1em;
1944
+ }.r-ol {
1945
+ padding-inline-start: 2rem;
2005
1946
  margin-block-start: 1em;
2006
1947
  margin-block-end: 1em;
2007
1948
  }.r-table {
@@ -2011,15 +1952,15 @@
2011
1952
  box-sizing: border-box;
2012
1953
  }.r-td {
2013
1954
  padding: 6px 12px;
2014
- border-bottom: 1px solid var(--r-neutral-400);
1955
+ border-bottom: 1px solid var(--r-main-400);
2015
1956
  border-collapse: collapse;
2016
1957
  }.r-th {
2017
1958
  padding: 6px 12px;
2018
- border-top: 1px solid var(--r-neutral-500);
2019
- border-bottom: 1px solid var(--r-neutral-500);
1959
+ border-top: 1px solid var(--r-main-500);
1960
+ border-bottom: 1px solid var(--r-main-500);
2020
1961
  border-collapse: collapse;
2021
1962
  }.r-thead {
2022
- background-color: var(--r-neutral-100);
1963
+ background-color: var(--r-main-100);
2023
1964
  }.r-task-li.r-task-li {
2024
1965
  margin-block-start: 2px;
2025
1966
  margin-block-end: 2px;
@@ -2079,7 +2020,9 @@
2079
2020
  display: none;
2080
2021
  opacity: 0;
2081
2022
  position: absolute;
2082
- background: var(--r-neutral-200);
2023
+ background: color-mix(in oklab, var(--r-main-100) 90%, transparent);
2024
+ border: 2px solid var(--r-main-50);
2025
+ backdrop-filter: blur(2px);
2083
2026
  width: max-content;
2084
2027
  padding: 6px 12px;
2085
2028
  border-radius: 4px;
@@ -2089,12 +2032,12 @@
2089
2032
  box-sizing: border-box;
2090
2033
  }
2091
2034
  .r-tooltip._bottom-start {
2092
- bottom: -8px;
2093
- left: 0;
2035
+ bottom: -4px;
2036
+ left: -4px;
2094
2037
  }
2095
2038
  .r-tooltip._bottom-end {
2096
- bottom: -8px;
2097
- right: 0;
2039
+ bottom: -4px;
2040
+ right: -4px;
2098
2041
  }
2099
2042
 
2100
2043
  .r-tooltip._visible {