Skip to content

Commit 18d6dfc

Browse files
carwackcarwack
committed
refactor: use new xs text fontsize classes
1 parent 3f63647 commit 18d6dfc

File tree

10 files changed

+29
-29
lines changed

10 files changed

+29
-29
lines changed

‎app/components/Compare/FacetSelector.vue‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -29,12 +29,12 @@ function isCategoryNoneSelected(category: string): boolean {
2929
<div v-for="category in categoryOrder" :key="category">
3030
<!-- Category header with all/none buttons -->
3131
<div class="flex items-center gap-2 mb-2">
32-
<span class="text-xxs text-fg-subtle uppercase tracking-wider">
32+
<span class="text-3xs text-fg-subtle uppercase tracking-wider">
3333
{{ getCategoryLabel(category) }}
3434
</span>
3535
<button
3636
type="button"
37-
class="text-xxs transition-colors focus-visible:outline-none focus-visible:underline focus-visible:underline-accent"
37+
class="text-3xs transition-colors focus-visible:outline-none focus-visible:underline focus-visible:underline-accent"
3838
:class="
3939
isCategoryAllSelected(category)
4040
? 'text-fg-muted'
@@ -48,10 +48,10 @@ function isCategoryNoneSelected(category: string): boolean {
4848
>
4949
{{ $t('compare.facets.all') }}
5050
</button>
51-
<span class="text-xxs text-fg-muted/40">/</span>
51+
<span class="text-2xs text-fg-muted/40">/</span>
5252
<button
5353
type="button"
54-
class="text-xxs transition-colors focus-visible:outline-none focus-visible:underline focus-visible:underline-accent"
54+
class="text-3xs transition-colors focus-visible:outline-none focus-visible:underline focus-visible:underline-accent"
5555
:class="
5656
isCategoryNoneSelected(category)
5757
? 'text-fg-muted'
@@ -94,7 +94,7 @@ function isCategoryNoneSelected(category: string): boolean {
9494
aria-hidden="true"
9595
/>
9696
{{ facet.label }}
97-
<span v-if="facet.comingSoon" class="text-xxs"
97+
<span v-if="facet.comingSoon" class="text-4xs"
9898
>({{ $t('compare.facets.coming_soon') }})</span
9999
>
100100
</button>

‎app/components/DependencyPathPopup.vue‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -68,7 +68,7 @@ function parsePackageString(pkg: string): { name: string; version: string } {
6868
<!-- Path badge button -->
6969
<button
7070
type="button"
71-
class="path-badge font-mono text-xxs px-1.5 py-0.5 rounded bg-amber-500/10 border border-amber-500/30 text-amber-700 dark:text-amber-400 cursor-pointer transition-all duration-200 ease-out whitespace-nowrap flex items-center gap-1 hover:bg-amber-500/20 hover:border-amber-500/50"
71+
class="path-badge font-mono text-3xs px-1.5 py-0.5 rounded bg-amber-500/10 border border-amber-500/30 text-amber-700 dark:text-amber-400 cursor-pointer transition-all duration-200 ease-out whitespace-nowrap flex items-center gap-1 hover:bg-amber-500/20 hover:border-amber-500/50"
7272
:aria-expanded="isOpen"
7373
@click.stop="togglePopup"
7474
>

‎app/components/Header/AccountMenu.client.vue‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -120,7 +120,7 @@ function openAuthModal() {
120120
<!-- Operation count badge (when npm connected with pending ops) -->
121121
<span
122122
v-if="isNpmConnected && operationCount > 0"
123-
class="absolute -top-1 -inset-ie-1 min-w-[1rem] h-4 px-1 flex items-center justify-center font-mono text-xxs rounded-full"
123+
class="absolute -top-1 -inset-ie-1 min-w-[1rem] h-4 px-1 flex items-center justify-center font-mono text-3xs rounded-full"
124124
:class="hasPendingOperations ? 'bg-yellow-500 text-black' : 'bg-blue-500 text-white'"
125125
aria-hidden="true"
126126
>

‎app/components/LicenseDisplay.vue‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@ const hasAnyValidLicense = computed(() => tokens.value.some(t => t.type === 'lic
2424
{{ token.value }}
2525
</a>
2626
<span v-else-if="token.type === 'license'">{{ token.value }}</span>
27-
<span v-else-if="token.type === 'operator'" class="text-xxs">{{ token.value }}</span>
27+
<span v-else-if="token.type === 'operator'" class="text-[0.65em]">{{ token.value }}</span>
2828
</template>
2929
<span
3030
v-if="hasAnyValidLicense"

‎app/components/Org/OperationsQueue.vue‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -321,7 +321,7 @@ watch(isExecuting, executing => {
321321
<!-- Show error output for failed operations -->
322322
<pre
323323
v-if="op.status === 'failed' && op.result?.stderr"
324-
class="mt-1 text-red-400/70 whitespace-pre-wrap text-xxs"
324+
class="mt-1 text-red-400/70 whitespace-pre-wrap text-2xs"
325325
>{{ op.result.stderr }}</pre
326326
>
327327
</div>

‎app/components/Package/DownloadAnalytics.vue‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -915,7 +915,7 @@ const chartConfig = computed(() => {
915915
</svg>
916916
</div>
917917
918-
<span class="text-xxs uppercase tracking-wide text-[var(--fg)]/70 truncate">
918+
<span class="text-3xs uppercase tracking-wide text-[var(--fg)]/70 truncate">
919919
${label}
920920
</span>
921921
@@ -962,7 +962,7 @@ const chartConfig = computed(() => {
962962
<div class="flex flex-col gap-1 sm:shrink-0">
963963
<label
964964
for="granularity"
965-
class="text-xxs font-mono text-fg-subtle tracking-wide uppercase"
965+
class="text-3xs font-mono text-fg-subtle tracking-wide uppercase"
966966
>
967967
{{ $t('package.downloads.granularity') }}
968968
</label>
@@ -988,7 +988,7 @@ const chartConfig = computed(() => {
988988
<div class="flex flex-col gap-1">
989989
<label
990990
for="startDate"
991-
class="text-xxs font-mono text-fg-subtle tracking-wide uppercase"
991+
class="text-3xs font-mono text-fg-subtle tracking-wide uppercase"
992992
>
993993
{{ $t('package.downloads.start_date') }}
994994
</label>
@@ -1007,7 +1007,7 @@ const chartConfig = computed(() => {
10071007
</div>
10081008

10091009
<div class="flex flex-col gap-1">
1010-
<label for="endDate" class="text-xxs font-mono text-fg-subtle tracking-wide uppercase">
1010+
<label for="endDate" class="text-3xs font-mono text-fg-subtle tracking-wide uppercase">
10111011
{{ $t('package.downloads.end_date') }}
10121012
</label>
10131013
<div

‎app/components/Package/Versions.vue‎

Lines changed: 11 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -379,7 +379,7 @@ function getTagVersions(tag: string): VersionDisplay[] {
379379
<span
380380
v-for="tag in row.tags"
381381
:key="tag"
382-
class="text-xxs font-semibold text-fg-subtle uppercase tracking-wide truncate max-w-[150px]"
382+
class="text-4xs font-semibold text-fg-subtle uppercase tracking-wide truncate max-w-[150px]"
383383
:title="tag"
384384
>
385385
{{ tag }}
@@ -431,7 +431,7 @@ function getTagVersions(tag: string): VersionDisplay[] {
431431
<DateTime
432432
v-if="v.time"
433433
:datetime="v.time"
434-
class="text-xxs text-fg-subtle"
434+
class="text-3xs text-fg-subtle"
435435
year="numeric"
436436
month="short"
437437
day="numeric"
@@ -451,7 +451,7 @@ function getTagVersions(tag: string): VersionDisplay[] {
451451
<span
452452
v-for="tag in filterExcludedTags(v.tags, row.tags)"
453453
:key="tag"
454-
class="text-xxs font-semibold text-fg-subtle uppercase tracking-wide truncate max-w-[120px]"
454+
class="text-5xs font-semibold text-fg-subtle uppercase tracking-wide truncate max-w-[120px]"
455455
:title="tag"
456456
>
457457
{{ tag }}
@@ -532,7 +532,7 @@ function getTagVersions(tag: string): VersionDisplay[] {
532532
<DateTime
533533
v-if="row.primaryVersion.time"
534534
:datetime="row.primaryVersion.time"
535-
class="text-xxs text-fg-subtle"
535+
class="text-3xs text-fg-subtle"
536536
year="numeric"
537537
month="short"
538538
day="numeric"
@@ -543,7 +543,7 @@ function getTagVersions(tag: string): VersionDisplay[] {
543543
<span
544544
v-for="tag in row.tags"
545545
:key="tag"
546-
class="text-xxs font-semibold text-fg-subtle uppercase tracking-wide truncate max-w-[120px]"
546+
class="text-5xs font-semibold text-fg-subtle uppercase tracking-wide truncate max-w-[120px]"
547547
:title="tag"
548548
>
549549
{{ tag }}
@@ -609,7 +609,7 @@ function getTagVersions(tag: string): VersionDisplay[] {
609609
<DateTime
610610
v-if="group.versions[0]?.time"
611611
:datetime="group.versions[0]?.time"
612-
class="text-xxs text-fg-subtle"
612+
class="text-3xs text-fg-subtle"
613613
year="numeric"
614614
month="short"
615615
day="numeric"
@@ -629,7 +629,7 @@ function getTagVersions(tag: string): VersionDisplay[] {
629629
<span
630630
v-for="tag in group.versions[0].tags"
631631
:key="tag"
632-
class="text-xxs font-semibold text-fg-subtle uppercase tracking-wide truncate max-w-[120px]"
632+
class="text-5xs font-semibold text-fg-subtle uppercase tracking-wide truncate max-w-[120px]"
633633
:title="tag"
634634
>
635635
{{ tag }}
@@ -670,7 +670,7 @@ function getTagVersions(tag: string): VersionDisplay[] {
670670
<DateTime
671671
v-if="group.versions[0]?.time"
672672
:datetime="group.versions[0]?.time"
673-
class="text-xxs text-fg-subtle"
673+
class="text-3xs text-fg-subtle"
674674
year="numeric"
675675
month="short"
676676
day="numeric"
@@ -687,7 +687,7 @@ function getTagVersions(tag: string): VersionDisplay[] {
687687
<span
688688
v-for="tag in group.versions[0].tags"
689689
:key="tag"
690-
class="text-xxs font-semibold text-fg-subtle uppercase tracking-wide"
690+
class="text-5xs font-semibold text-fg-subtle uppercase tracking-wide"
691691
>
692692
{{ tag }}
693693
</span>
@@ -720,7 +720,7 @@ function getTagVersions(tag: string): VersionDisplay[] {
720720
<DateTime
721721
v-if="v.time"
722722
:datetime="v.time"
723-
class="text-xxs text-fg-subtle"
723+
class="text-3xs text-fg-subtle"
724724
year="numeric"
725725
month="short"
726726
day="numeric"
@@ -737,7 +737,7 @@ function getTagVersions(tag: string): VersionDisplay[] {
737737
<span
738738
v-for="tag in v.tags"
739739
:key="tag"
740-
class="text-xxs font-semibold text-fg-subtle uppercase tracking-wide"
740+
class="text-5xs font-semibold text-fg-subtle uppercase tracking-wide"
741741
>
742742
{{ tag }}
743743
</span>

‎app/components/Package/VulnerabilityTree.vue‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -135,7 +135,7 @@ function getDepthStyle(depth: string | undefined) {
135135
<span
136136
v-for="s in SEVERITY_LEVELS.filter(s => pkg.counts[s] > 0)"
137137
:key="s"
138-
class="px-1.5 py-0.5 text-xxs font-mono rounded border"
138+
class="px-1.5 py-0.5 text-3xs font-mono rounded border"
139139
:class="SEVERITY_COLORS[s]"
140140
>
141141
{{ pkg.counts[s] }} {{ getPackageSeverityLabel(s) }}

‎app/components/VersionSelector.vue‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -604,7 +604,7 @@ watch(
604604
<span
605605
v-for="tag in v.tags"
606606
:key="tag"
607-
class="text-xxs px-1 py-0.5 rounded font-sans font-medium"
607+
class="text-4xs px-1 py-0.5 rounded font-sans font-medium"
608608
:class="
609609
tag === 'latest'
610610
? 'bg-emerald-500/10 text-emerald-400'

‎app/pages/compare.vue‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -169,18 +169,18 @@ useSeoMeta({
169169
</h2>
170170
<button
171171
type="button"
172-
class="text-xxs transition-colors focus-visible:outline-none focus-visible:underline focus-visible:underline-accent"
172+
class="text-3xs transition-colors focus-visible:outline-none focus-visible:underline focus-visible:underline-accent"
173173
:class="isAllSelected ? 'text-fg-muted' : 'text-fg-muted/60 hover:text-fg-muted'"
174174
:disabled="isAllSelected"
175175
:aria-label="$t('compare.facets.select_all')"
176176
@click="selectAll"
177177
>
178178
{{ $t('compare.facets.all') }}
179179
</button>
180-
<span class="text-xxs text-fg-muted/40" aria-hidden="true">/</span>
180+
<span class="text-3xs text-fg-muted/40" aria-hidden="true">/</span>
181181
<button
182182
type="button"
183-
class="text-xxs transition-colors focus-visible:outline-none focus-visible:underline focus-visible:underline-accent"
183+
class="text-3xs transition-colors focus-visible:outline-none focus-visible:underline focus-visible:underline-accent"
184184
:class="isNoneSelected ? 'text-fg-muted' : 'text-fg-muted/60 hover:text-fg-muted'"
185185
:disabled="isNoneSelected"
186186
:aria-label="$t('compare.facets.deselect_all')"

0 commit comments

Comments
 (0)