forked from
npmx.dev/npmx.dev
[READ-ONLY]
a fast, modern browser for the npm registry
style: replace physical RTL classes with logical ones (#404)
Co-authored-by: Daniel Roe <daniel@roe.dev>
authored by
TAKAHASHI Shuuji
Daniel Roe
and committed by
GitHub
d5b7637d
f80f5a57
+55
-65
+1
-1
CONTRIBUTING.md
+1
-1
CONTRIBUTING.md
···
232
232
- Do not use `rtl-` classes, such as `rtl-left-0`.
233
233
- For icons that should be rotated for RTL, add `class="rtl-flip"`. This can only be used for icons outside of elements with `dir="auto"`.
234
234
- For absolute positioned elements, don't use `left/right`: for example `left-0`. Use `inset-inline-start/end` instead. `UnoCSS` shortcuts are `inset-is` for `inset-inline-start` and `inset-ie` for `inset-inline-end`. Example: `left-0` should be replaced with `inset-is-0`.
235
-
- If you need to change the border radius for an entire left or right side, use `border-inline-start/end`. `UnoCSS` shortcuts are `rounded-is` for left side, `rounded-ie` for right side. Example: `rounded-l-5` should be replaced with `rounded-ie-5`.
235
+
- If you need to change the border radius for an entire left or right side, use `border-inline-start/end`. `UnoCSS` shortcuts are `rounded-is` for left side, `rounded-ie` for right side. Example: `rounded-l-5` should be replaced with `rounded-is-5`.
236
236
- If you need to change the border radius for one corner, use `border-start-end-radius` and similar rules. `UnoCSS` shortcuts are `rounded` + top/bottom as either `-bs` (top) or `-be` (bottom) + left/right as either `-is` (left) or `-ie` (right). Example: `rounded-tl-0` should be replaced with `rounded-bs-is-0`.
237
237
238
238
## Localization (i18n)
+14
-18
app/assets/main.css
+14
-18
app/assets/main.css
···
156
156
.skip-link {
157
157
position: fixed;
158
158
top: -100%;
159
-
left: 0;
159
+
inset-inline-start: 0;
160
160
padding: 0.5rem 1rem;
161
161
background: var(--fg);
162
162
color: var(--bg);
163
163
font-size: 0.875rem;
164
164
z-index: 100;
165
165
transition: top 0.2s ease;
166
-
}
167
-
168
-
html[dir='rtl'] .skip-link {
169
-
left: unset;
170
-
right: 0;
171
166
}
172
167
173
168
.skip-link:hover {
···
298
293
.readme-content ul,
299
294
.readme-content ol {
300
295
margin: 1rem 0;
301
-
padding-left: 1.5rem;
296
+
padding-inline-start: 1.5rem;
302
297
}
303
298
304
299
.readme-content ul {
···
319
314
}
320
315
321
316
.readme-content blockquote {
322
-
border-left: 2px solid var(--border);
323
-
padding-left: 1rem;
317
+
border-inline-start: 2px solid var(--border);
318
+
padding-inline-start: 1rem;
324
319
margin: 1.5rem 0;
325
320
color: var(--fg-subtle);
326
321
font-style: italic;
···
328
323
329
324
/* GitHub-style callouts/alerts */
330
325
.readme-content blockquote[data-callout] {
331
-
border-left-width: 3px;
332
-
padding: 1rem 1rem 1rem 1.25rem;
326
+
border-inline-start-width: 3px;
327
+
padding: 1rem;
328
+
padding-inline-start: 1.25rem;
333
329
background: var(--bg-subtle);
334
330
font-style: normal;
335
331
color: var(--fg-subtle);
···
344
340
text-transform: uppercase;
345
341
letter-spacing: 0.05em;
346
342
margin-bottom: 0.5rem;
347
-
padding-left: 1.5rem;
343
+
padding-inline-start: 1.5rem;
348
344
}
349
345
350
346
.readme-content blockquote[data-callout]::after {
···
365
361
366
362
/* Note - blue */
367
363
.readme-content blockquote[data-callout='note'] {
368
-
border-left-color: var(--syntax-str);
364
+
border-inline-start-color: var(--syntax-str);
369
365
background: rgba(59, 130, 246, 0.05);
370
366
}
371
367
.readme-content blockquote[data-callout='note']::before {
···
380
376
381
377
/* Tip - green */
382
378
.readme-content blockquote[data-callout='tip'] {
383
-
border-left-color: #22c55e;
379
+
border-inline-start-color: #22c55e;
384
380
background: rgba(34, 197, 94, 0.05);
385
381
}
386
382
.readme-content blockquote[data-callout='tip']::before {
···
395
391
396
392
/* Important - purple */
397
393
.readme-content blockquote[data-callout='important'] {
398
-
border-left-color: var(--syntax-fn);
394
+
border-inline-start-color: var(--syntax-fn);
399
395
background: rgba(168, 85, 247, 0.05);
400
396
}
401
397
.readme-content blockquote[data-callout='important']::before {
···
410
406
411
407
/* Warning - yellow/orange */
412
408
.readme-content blockquote[data-callout='warning'] {
413
-
border-left-color: #eab308;
409
+
border-inline-start-color: #eab308;
414
410
background: rgba(234, 179, 8, 0.05);
415
411
}
416
412
.readme-content blockquote[data-callout='warning']::before {
···
425
421
426
422
/* Caution - red */
427
423
.readme-content blockquote[data-callout='caution'] {
428
-
border-left-color: #ef4444;
424
+
border-inline-start-color: #ef4444;
429
425
background: rgba(239, 68, 68, 0.05);
430
426
}
431
427
.readme-content blockquote[data-callout='caution']::before {
···
452
448
.readme-content td {
453
449
border: 1px solid var(--border);
454
450
padding: 0.75rem 1rem;
455
-
text-align: left;
451
+
text-align: start;
456
452
}
457
453
458
454
.readme-content th {
+4
-4
app/components/AppTooltip.vue
+4
-4
app/components/AppTooltip.vue
···
10
10
const tooltipId = useId()
11
11
12
12
const positionClasses: Record<string, string> = {
13
-
top: 'bottom-full left-1/2 -translate-x-1/2 mb-1',
14
-
bottom: 'top-full left-0 mt-1',
15
-
left: 'right-full top-1/2 -translate-y-1/2 mr-2',
16
-
right: 'left-full top-1/2 -translate-y-1/2 ml-2',
13
+
top: 'bottom-full inset-is-1/2 -translate-x-1/2 mb-1',
14
+
bottom: 'top-full inset-is-0 mt-1',
15
+
left: 'inset-ie-full top-1/2 -translate-y-1/2 me-2',
16
+
right: 'inset-is-full top-1/2 -translate-y-1/2 ms-2',
17
17
}
18
18
19
19
const tooltipPosition = computed(() => positionClasses[props.position || 'bottom'])
+2
-2
app/components/ColumnPicker.vue
+2
-2
app/components/ColumnPicker.vue
···
93
93
v-if="isOpen"
94
94
ref="menuRef"
95
95
:id="menuId"
96
-
class="absolute right-0 mt-2 w-60 bg-bg-subtle border border-border rounded-lg shadow-lg z-20"
96
+
class="absolute inset-ie-0 mt-2 w-60 bg-bg-subtle border border-border rounded-lg shadow-lg z-20"
97
97
role="group"
98
98
:aria-label="$t('filters.columns.show')"
99
99
>
···
144
144
<div class="border-t border-border py-1">
145
145
<button
146
146
type="button"
147
-
class="w-full px-3 py-2 text-left text-sm font-mono text-fg-muted hover:bg-bg-muted hover:text-fg transition-colors duration-200 focus-visible:ring-2 focus-visible:ring-fg focus-visible:ring-inset"
147
+
class="w-full px-3 py-2 text-start text-sm font-mono text-fg-muted hover:bg-bg-muted hover:text-fg transition-colors duration-200 focus-visible:ring-2 focus-visible:ring-fg focus-visible:ring-inset"
148
148
@click="handleReset"
149
149
>
150
150
{{ $t('filters.columns.reset') }}
+1
-1
app/components/FilterChips.vue
+1
-1
app/components/FilterChips.vue
···
21
21
}}</span>
22
22
<button
23
23
type="button"
24
-
class="ml-0.5 hover:text-fg rounded-full p-0.5 transition-colors duration-200 focus-visible:ring-2 focus-visible:ring-fg focus-visible:ring-offset-1"
24
+
class="ms-0.5 hover:text-fg rounded-full p-0.5 transition-colors duration-200 focus-visible:ring-2 focus-visible:ring-fg focus-visible:ring-offset-1"
25
25
:aria-label="$t('filters.remove_filter', { label: chip.label })"
26
26
@click="emit('remove', chip)"
27
27
>
+2
-2
app/components/FilterPanel.vue
+2
-2
app/components/FilterPanel.vue
···
171
171
<!-- Collapsed header -->
172
172
<button
173
173
type="button"
174
-
class="w-full flex items-center gap-3 px-4 py-3 text-left hover:bg-bg-muted transition-colors duration-200 focus-visible:ring-2 focus-visible:ring-fg focus-visible:ring-inset"
174
+
class="w-full flex items-center gap-3 px-4 py-3 text-start hover:bg-bg-muted transition-colors duration-200 focus-visible:ring-2 focus-visible:ring-fg focus-visible:ring-inset"
175
175
:aria-expanded="isExpanded"
176
176
@click="isExpanded = !isExpanded"
177
177
>
···
183
183
{{ filterSummary }}
184
184
</span>
185
185
<span
186
-
class="i-carbon-chevron-down w-4 h-4 text-fg-subtle transition-transform duration-200 shrink-0 ml-auto"
186
+
class="i-carbon-chevron-down w-4 h-4 text-fg-subtle transition-transform duration-200 shrink-0 ms-auto"
187
187
:class="{ 'rotate-180': isExpanded }"
188
188
aria-hidden="true"
189
189
/>
+4
-4
app/components/OrgTeamsPanel.vue
+4
-4
app/components/OrgTeamsPanel.vue
···
406
406
<div
407
407
v-if="expandedTeams.has(teamName)"
408
408
:id="`team-${teamName}-members`"
409
-
class="pl-9 pr-3 pb-3"
409
+
class="ps-9 pe-3 pb-3"
410
410
>
411
411
<!-- Members list -->
412
412
<ul
···
417
417
<li
418
418
v-for="user in teamUsers[teamName]"
419
419
:key="user"
420
-
class="flex items-center justify-start py-1 pl-2 pr-1 rounded hover:bg-bg-subtle transition-colors duration-200"
420
+
class="flex items-center justify-start py-1 ps-2 pe-1 rounded hover:bg-bg-subtle transition-colors duration-200"
421
421
>
422
422
<NuxtLink
423
423
:to="{ name: '~username', params: { username: user } }"
···
497
497
<form class="flex items-center gap-2" @submit.prevent="handleCreateTeam">
498
498
<div class="flex-1 flex items-center">
499
499
<span
500
-
class="px-2 py-1.5 font-mono text-sm text-fg-subtle bg-bg border border-r-0 border-border rounded-l"
500
+
class="px-2 py-1.5 font-mono text-sm text-fg-subtle bg-bg border border-ie-0 border-border rounded-is"
501
501
>
502
502
{{ orgName }}:
503
503
</span>
···
509
509
name="new-team-name"
510
510
:placeholder="$t('org.teams.team_name_placeholder')"
511
511
v-bind="noCorrect"
512
-
class="flex-1 px-2 py-1.5 font-mono text-sm bg-bg border border-border rounded-r text-fg placeholder:text-fg-subtle transition-colors duration-200 focus:border-border-hover focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-fg/50"
512
+
class="flex-1 px-2 py-1.5 font-mono text-sm bg-bg border border-border rounded-ie text-fg placeholder:text-fg-subtle transition-colors duration-200 focus:border-border-hover focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-fg/50"
513
513
/>
514
514
</div>
515
515
<button
+4
-4
app/components/PackageDeprecatedTree.vue
+4
-4
app/components/PackageDeprecatedTree.vue
···
24
24
// Styling for each depth level
25
25
const depthStyles = {
26
26
root: {
27
-
bg: 'bg-purple-500/5 border-l-2 border-l-purple-600',
27
+
bg: 'bg-purple-500/5 border-is-2 border-is-purple-600',
28
28
text: 'text-fg',
29
29
},
30
30
direct: {
31
-
bg: 'bg-purple-500/5 border-l-2 border-l-purple-500',
31
+
bg: 'bg-purple-500/5 border-is-2 border-is-purple-500',
32
32
text: 'text-fg-muted',
33
33
},
34
34
transitive: {
35
-
bg: 'bg-purple-500/5 border-l-2 border-l-purple-400',
35
+
bg: 'bg-purple-500/5 border-is-2 border-is-purple-400',
36
36
text: 'text-fg-muted',
37
37
},
38
38
} as const
···
48
48
<!-- Header -->
49
49
<button
50
50
type="button"
51
-
class="w-full flex items-center justify-between gap-3 px-4 py-3 text-left transition-colors duration-200 hover:bg-white/5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-fg/50"
51
+
class="w-full flex items-center justify-between gap-3 px-4 py-3 text-start transition-colors duration-200 hover:bg-white/5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-fg/50"
52
52
:aria-expanded="isExpanded"
53
53
aria-controls="deprecated-tree-details"
54
54
@click="isExpanded = !isExpanded"
+2
-2
app/components/PackageListToolbar.vue
+2
-2
app/components/PackageListToolbar.vue
···
159
159
<select
160
160
id="sort-select"
161
161
:value="currentSort.key"
162
-
class="appearance-none bg-bg-subtle border border-border rounded-md pl-3 pr-8 py-1.5 font-mono text-sm text-fg cursor-pointer transition-colors duration-200 hover:border-border-hover focus-visible:ring-2 focus-visible:ring-fg focus-visible:ring-offset-2 focus-visible:ring-offset-bg focus-visible:outline-none"
162
+
class="appearance-none bg-bg-subtle border border-border rounded-md ps-3 pe-8 py-1.5 font-mono text-sm text-fg cursor-pointer transition-colors duration-200 hover:border-border-hover focus-visible:ring-2 focus-visible:ring-fg focus-visible:ring-offset-2 focus-visible:ring-offset-bg focus-visible:outline-none"
163
163
@change="handleSortKeyChange"
164
164
>
165
165
<option
···
173
173
</option>
174
174
</select>
175
175
<div
176
-
class="absolute right-2 top-1/2 -translate-y-1/2 text-fg-subtle pointer-events-none"
176
+
class="absolute inset-ie-2 top-1/2 -translate-y-1/2 text-fg-subtle pointer-events-none"
177
177
aria-hidden="true"
178
178
>
179
179
<span class="i-carbon-chevron-down w-4 h-4" />
+2
-2
app/components/PackageReplacement.vue
+2
-2
app/components/PackageReplacement.vue
···
51
51
:href="mdnUrl"
52
52
target="_blank"
53
53
rel="noopener noreferrer"
54
-
class="inline-flex items-center gap-1 ml-1 underline underline-offset-4 decoration-amber-600/60 dark:decoration-amber-400/50 hover:decoration-fg transition-colors"
54
+
class="inline-flex items-center gap-1 ms-1 underline underline-offset-4 decoration-amber-600/60 dark:decoration-amber-400/50 hover:decoration-fg transition-colors"
55
55
>
56
56
{{ $t('package.replacement.mdn') }}
57
57
<span class="i-carbon-launch w-3 h-3" aria-hidden="true" />
···
61
61
:href="docPath"
62
62
target="_blank"
63
63
rel="noopener noreferrer"
64
-
class="inline-flex items-center gap-1 ml-1 underline underline-offset-4 decoration-amber-600/60 dark:decoration-amber-400/50 hover:decoration-fg transition-colors"
64
+
class="inline-flex items-center gap-1 ms-1 underline underline-offset-4 decoration-amber-600/60 dark:decoration-amber-400/50 hover:decoration-fg transition-colors"
65
65
>
66
66
{{ $t('package.replacement.learn_more') }}
67
67
<span class="i-carbon-launch w-3 h-3" aria-hidden="true" />
+8
-8
app/components/PackageTable.vue
+8
-8
app/components/PackageTable.vue
···
104
104
105
105
<template>
106
106
<div class="overflow-x-auto">
107
-
<table class="w-full text-left">
107
+
<table class="w-full text-start">
108
108
<thead class="border-b border-border">
109
109
<tr>
110
110
<!-- Name (always visible) -->
···
160
160
<th
161
161
v-if="isColumnVisible('downloads')"
162
162
scope="col"
163
-
class="py-3 px-3 text-xs font-mono font-medium text-fg-muted uppercase tracking-wider text-right focus-visible:ring-2 focus-visible:ring-fg focus-visible:ring-inset focus-visible:outline-none"
163
+
class="py-3 px-3 text-xs font-mono font-medium text-fg-muted uppercase tracking-wider text-end focus-visible:ring-2 focus-visible:ring-fg focus-visible:ring-inset focus-visible:outline-none"
164
164
:class="{
165
165
'cursor-pointer hover:text-fg transition-colors duration-200':
166
166
isSortable('downloads'),
···
245
245
<th
246
246
v-if="isColumnVisible('qualityScore')"
247
247
scope="col"
248
-
class="py-3 px-3 text-xs font-mono font-medium text-fg-muted uppercase tracking-wider text-right"
248
+
class="py-3 px-3 text-xs font-mono font-medium text-fg-muted uppercase tracking-wider text-end"
249
249
>
250
250
{{ $t(getColumnLabelKey('qualityScore')) }}
251
251
</th>
···
253
253
<th
254
254
v-if="isColumnVisible('popularityScore')"
255
255
scope="col"
256
-
class="py-3 px-3 text-xs font-mono font-medium text-fg-muted uppercase tracking-wider text-right"
256
+
class="py-3 px-3 text-xs font-mono font-medium text-fg-muted uppercase tracking-wider text-end"
257
257
>
258
258
{{ $t(getColumnLabelKey('popularityScore')) }}
259
259
</th>
···
261
261
<th
262
262
v-if="isColumnVisible('maintenanceScore')"
263
263
scope="col"
264
-
class="py-3 px-3 text-xs font-mono font-medium text-fg-muted uppercase tracking-wider text-right"
264
+
class="py-3 px-3 text-xs font-mono font-medium text-fg-muted uppercase tracking-wider text-end"
265
265
>
266
266
{{ $t(getColumnLabelKey('maintenanceScore')) }}
267
267
</th>
···
269
269
<th
270
270
v-if="isColumnVisible('combinedScore')"
271
271
scope="col"
272
-
class="py-3 px-3 text-xs font-mono font-medium text-fg-muted uppercase tracking-wider text-right"
272
+
class="py-3 px-3 text-xs font-mono font-medium text-fg-muted uppercase tracking-wider text-end"
273
273
>
274
274
{{ $t(getColumnLabelKey('combinedScore')) }}
275
275
</th>
···
296
296
<td v-if="isColumnVisible('description')" class="py-3 px-3">
297
297
<div class="h-4 w-48 bg-bg-muted rounded animate-pulse" />
298
298
</td>
299
-
<td v-if="isColumnVisible('downloads')" class="py-3 px-3 text-right">
300
-
<div class="h-4 w-16 bg-bg-muted rounded animate-pulse ml-auto" />
299
+
<td v-if="isColumnVisible('downloads')" class="py-3 px-3 text-end">
300
+
<div class="h-4 w-16 bg-bg-muted rounded animate-pulse ms-auto" />
301
301
</td>
302
302
<td v-if="isColumnVisible('updated')" class="py-3 px-3">
303
303
<div class="h-4 w-20 bg-bg-muted rounded animate-pulse" />
+5
-5
app/components/PackageTableRow.vue
+5
-5
app/components/PackageTableRow.vue
···
77
77
<!-- Downloads -->
78
78
<td
79
79
v-if="isColumnVisible('downloads')"
80
-
class="py-2 px-3 font-mono text-xs text-fg-muted text-right tabular-nums"
80
+
class="py-2 px-3 font-mono text-xs text-fg-muted text-end tabular-nums"
81
81
>
82
82
{{ formatDownloads(result.downloads?.weekly) }}
83
83
</td>
···
142
142
<!-- Quality Score -->
143
143
<td
144
144
v-if="isColumnVisible('qualityScore')"
145
-
class="py-2 px-3 font-mono text-xs text-fg-muted text-right tabular-nums"
145
+
class="py-2 px-3 font-mono text-xs text-fg-muted text-end tabular-nums"
146
146
>
147
147
{{ formatScore(score?.detail?.quality) }}
148
148
</td>
···
150
150
<!-- Popularity Score -->
151
151
<td
152
152
v-if="isColumnVisible('popularityScore')"
153
-
class="py-2 px-3 font-mono text-xs text-fg-muted text-right tabular-nums"
153
+
class="py-2 px-3 font-mono text-xs text-fg-muted text-end tabular-nums"
154
154
>
155
155
{{ formatScore(score?.detail?.popularity) }}
156
156
</td>
···
158
158
<!-- Maintenance Score -->
159
159
<td
160
160
v-if="isColumnVisible('maintenanceScore')"
161
-
class="py-2 px-3 font-mono text-xs text-fg-muted text-right tabular-nums"
161
+
class="py-2 px-3 font-mono text-xs text-fg-muted text-end tabular-nums"
162
162
>
163
163
{{ formatScore(score?.detail?.maintenance) }}
164
164
</td>
···
166
166
<!-- Combined Score -->
167
167
<td
168
168
v-if="isColumnVisible('combinedScore')"
169
-
class="py-2 px-3 font-mono text-xs text-fg-muted text-right tabular-nums"
169
+
class="py-2 px-3 font-mono text-xs text-fg-muted text-end tabular-nums"
170
170
>
171
171
{{ formatScore(score?.final) }}
172
172
</td>
+2
-2
app/components/PaginationControls.vue
+2
-2
app/components/PaginationControls.vue
···
154
154
<select
155
155
id="page-size"
156
156
:value="pageSize"
157
-
class="appearance-none bg-bg-subtle border border-border rounded-md pl-3 pr-8 py-1 font-mono text-sm text-fg cursor-pointer transition-colors duration-200 hover:border-border-hover focus-visible:ring-2 focus-visible:ring-fg focus-visible:ring-offset-2 focus-visible:ring-offset-bg focus-visible:outline-none"
157
+
class="appearance-none bg-bg-subtle border border-border rounded-md ps-3 pe-8 py-1 font-mono text-sm text-fg cursor-pointer transition-colors duration-200 hover:border-border-hover focus-visible:ring-2 focus-visible:ring-fg focus-visible:ring-offset-2 focus-visible:ring-offset-bg focus-visible:outline-none"
158
158
@change="handlePageSizeChange"
159
159
>
160
160
<option v-for="size in PAGE_SIZE_OPTIONS" :key="size" :value="size">
···
166
166
</option>
167
167
</select>
168
168
<div
169
-
class="absolute right-2 top-1/2 -translate-y-1/2 text-fg-subtle pointer-events-none"
169
+
class="absolute inset-ie-2 top-1/2 -translate-y-1/2 text-fg-subtle pointer-events-none"
170
170
aria-hidden="true"
171
171
>
172
172
<span class="i-carbon-chevron-down w-3 h-3" />
+3
-9
app/pages/[...package].vue
+3
-9
app/pages/[...package].vue
···
532
532
<!-- Fade overlay with show more button - only when collapsed and overflowing -->
533
533
<div
534
534
v-if="pkg.description && descriptionOverflows && !descriptionExpanded"
535
-
class="absolute bottom-0 inside-is-0 inside-ie-0 h-10 bg-gradient-to-t from-bg via-bg/90 to-transparent flex items-end justify-end"
535
+
class="absolute bottom-0 inset-is-0 inset-ie-0 h-10 bg-gradient-to-t from-bg via-bg/90 to-transparent flex items-end justify-end"
536
536
>
537
537
<button
538
538
type="button"
···
1016
1016
<dl class="space-y-2">
1017
1017
<div v-if="displayVersion.engines.node" class="flex justify-between gap-4 py-1">
1018
1018
<dt class="text-fg-muted text-sm shrink-0">node</dt>
1019
-
<dd
1020
-
class="font-mono text-sm text-fg text-right"
1021
-
:title="displayVersion.engines.node"
1022
-
>
1019
+
<dd class="font-mono text-sm text-fg text-end" :title="displayVersion.engines.node">
1023
1020
{{ displayVersion.engines.node }}
1024
1021
</dd>
1025
1022
</div>
1026
1023
<div v-if="displayVersion.engines.npm" class="flex justify-between gap-4 py-1">
1027
1024
<dt class="text-fg-muted text-sm shrink-0">npm</dt>
1028
-
<dd
1029
-
class="font-mono text-sm text-fg text-right"
1030
-
:title="displayVersion.engines.npm"
1031
-
>
1025
+
<dd class="font-mono text-sm text-fg text-end" :title="displayVersion.engines.npm">
1032
1026
{{ displayVersion.engines.npm }}
1033
1027
</dd>
1034
1028
</div>
+1
-1
server/utils/docs/render.ts
+1
-1
server/utils/docs/render.ts
···
405
405
)
406
406
407
407
const showSymbols = kindSymbols.slice(0, MAX_TOC_ITEMS_PER_KIND)
408
-
lines.push(`<ul class="pl-3 space-y-0.5 border-l border-border/50">`)
408
+
lines.push(`<ul class="ps-3 space-y-0.5 border-is border-border/50">`)
409
409
for (const symbol of showSymbols) {
410
410
const id = createSymbolId(symbol.kind, symbol.name)
411
411
lines.push(