Skip to content

Commit 452e5a5

Browse files
committed
refactor: replace all pixel sized text font size 8px-11px classes to text-xxs
1 parent c190a85 commit 452e5a5

File tree

11 files changed

+30
-33
lines changed

11 files changed

+30
-33
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-[10px] text-fg-subtle uppercase tracking-wider">
32+
<span class="text-xxs text-fg-subtle uppercase tracking-wider">
3333
{{ getCategoryLabel(category) }}
3434
</span>
3535
<button
3636
type="button"
37-
class="text-[10px] transition-colors focus-visible:outline-none focus-visible:underline focus-visible:underline-accent"
37+
class="text-xxs 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-[10px] text-fg-muted/40">/</span>
51+
<span class="text-xxs text-fg-muted/40">/</span>
5252
<button
5353
type="button"
54-
class="text-[10px] transition-colors focus-visible:outline-none focus-visible:underline focus-visible:underline-accent"
54+
class="text-xxs 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-[9px]"
97+
<span v-if="facet.comingSoon" class="text-xxs"
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-[10px] 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-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"
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-[10px] 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-xxs 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-[0.65em]">{{ token.value }}</span>
27+
<span v-else-if="token.type === 'operator'" class="text-xxs">{{ 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-[11px]"
324+
class="mt-1 text-red-400/70 whitespace-pre-wrap text-xxs"
325325
>{{ op.result.stderr }}</pre
326326
>
327327
</div>

app/components/Package/Dependencies.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -174,7 +174,7 @@ const sortedOptionalDependencies = computed(() => {
174174
</NuxtLink>
175175
<span
176176
v-if="peer.optional"
177-
class="px-1 py-0.5 font-mono text-[10px] text-fg-subtle bg-bg-muted border border-border rounded shrink-0"
177+
class="px-1 py-0.5 font-mono text-xxs text-fg-subtle bg-bg-muted border border-border rounded shrink-0"
178178
:title="$t('package.dependencies.optional')"
179179
>
180180
{{ $t('package.dependencies.optional') }}

app/components/Package/DownloadAnalytics.vue

Lines changed: 4 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -911,7 +911,7 @@ const chartConfig = computed(() => {
911911
</svg>
912912
</div>
913913
914-
<span class="text-[10px] uppercase tracking-wide text-[var(--fg)]/70 truncate">
914+
<span class="text-xxs uppercase tracking-wide text-[var(--fg)]/70 truncate">
915915
${label}
916916
</span>
917917
@@ -958,7 +958,7 @@ const chartConfig = computed(() => {
958958
<div class="flex flex-col gap-1 sm:shrink-0">
959959
<label
960960
for="granularity"
961-
class="text-[10px] font-mono text-fg-subtle tracking-wide uppercase"
961+
class="text-xxs font-mono text-fg-subtle tracking-wide uppercase"
962962
>
963963
{{ $t('package.downloads.granularity') }}
964964
</label>
@@ -984,7 +984,7 @@ const chartConfig = computed(() => {
984984
<div class="flex flex-col gap-1">
985985
<label
986986
for="startDate"
987-
class="text-[10px] font-mono text-fg-subtle tracking-wide uppercase"
987+
class="text-xxs font-mono text-fg-subtle tracking-wide uppercase"
988988
>
989989
{{ $t('package.downloads.start_date') }}
990990
</label>
@@ -1003,10 +1003,7 @@ const chartConfig = computed(() => {
10031003
</div>
10041004

10051005
<div class="flex flex-col gap-1">
1006-
<label
1007-
for="endDate"
1008-
class="text-[10px] font-mono text-fg-subtle tracking-wide uppercase"
1009-
>
1006+
<label for="endDate" class="text-xxs font-mono text-fg-subtle tracking-wide uppercase">
10101007
{{ $t('package.downloads.end_date') }}
10111008
</label>
10121009
<div

app/components/Package/Versions.vue

Lines changed: 11 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -387,7 +387,7 @@ function getTagVersions(tag: string): VersionDisplay[] {
387387
<span
388388
v-for="tag in row.tags"
389389
:key="tag"
390-
class="text-[9px] font-semibold text-fg-subtle uppercase tracking-wide truncate max-w-[150px]"
390+
class="text-xxs font-semibold text-fg-subtle uppercase tracking-wide truncate max-w-[150px]"
391391
:title="tag"
392392
>
393393
{{ tag }}
@@ -447,7 +447,7 @@ function getTagVersions(tag: string): VersionDisplay[] {
447447
<DateTime
448448
v-if="v.time"
449449
:datetime="v.time"
450-
class="text-[10px] text-fg-subtle"
450+
class="text-xxs text-fg-subtle"
451451
year="numeric"
452452
month="short"
453453
day="numeric"
@@ -467,7 +467,7 @@ function getTagVersions(tag: string): VersionDisplay[] {
467467
<span
468468
v-for="tag in filterExcludedTags(v.tags, row.tags)"
469469
:key="tag"
470-
class="text-[8px] font-semibold text-fg-subtle uppercase tracking-wide truncate max-w-[120px]"
470+
class="text-xxs font-semibold text-fg-subtle uppercase tracking-wide truncate max-w-[120px]"
471471
:title="tag"
472472
>
473473
{{ tag }}
@@ -554,7 +554,7 @@ function getTagVersions(tag: string): VersionDisplay[] {
554554
<DateTime
555555
v-if="row.primaryVersion.time"
556556
:datetime="row.primaryVersion.time"
557-
class="text-[10px] text-fg-subtle"
557+
class="text-xxs text-fg-subtle"
558558
year="numeric"
559559
month="short"
560560
day="numeric"
@@ -565,7 +565,7 @@ function getTagVersions(tag: string): VersionDisplay[] {
565565
<span
566566
v-for="tag in row.tags"
567567
:key="tag"
568-
class="text-[8px] font-semibold text-fg-subtle uppercase tracking-wide truncate max-w-[120px]"
568+
class="text-xxs font-semibold text-fg-subtle uppercase tracking-wide truncate max-w-[120px]"
569569
:title="tag"
570570
>
571571
{{ tag }}
@@ -633,7 +633,7 @@ function getTagVersions(tag: string): VersionDisplay[] {
633633
<DateTime
634634
v-if="group.versions[0]?.time"
635635
:datetime="group.versions[0]?.time"
636-
class="text-[10px] text-fg-subtle"
636+
class="text-xxs text-fg-subtle"
637637
year="numeric"
638638
month="short"
639639
day="numeric"
@@ -653,7 +653,7 @@ function getTagVersions(tag: string): VersionDisplay[] {
653653
<span
654654
v-for="tag in group.versions[0].tags"
655655
:key="tag"
656-
class="text-[8px] font-semibold text-fg-subtle uppercase tracking-wide truncate max-w-[120px]"
656+
class="text-xxs font-semibold text-fg-subtle uppercase tracking-wide truncate max-w-[120px]"
657657
:title="tag"
658658
>
659659
{{ tag }}
@@ -696,7 +696,7 @@ function getTagVersions(tag: string): VersionDisplay[] {
696696
<DateTime
697697
v-if="group.versions[0]?.time"
698698
:datetime="group.versions[0]?.time"
699-
class="text-[10px] text-fg-subtle"
699+
class="text-xxs text-fg-subtle"
700700
year="numeric"
701701
month="short"
702702
day="numeric"
@@ -713,7 +713,7 @@ function getTagVersions(tag: string): VersionDisplay[] {
713713
<span
714714
v-for="tag in group.versions[0].tags"
715715
:key="tag"
716-
class="text-[8px] font-semibold text-fg-subtle uppercase tracking-wide"
716+
class="text-xxs font-semibold text-fg-subtle uppercase tracking-wide"
717717
>
718718
{{ tag }}
719719
</span>
@@ -754,7 +754,7 @@ function getTagVersions(tag: string): VersionDisplay[] {
754754
<DateTime
755755
v-if="v.time"
756756
:datetime="v.time"
757-
class="text-[10px] text-fg-subtle"
757+
class="text-xxs text-fg-subtle"
758758
year="numeric"
759759
month="short"
760760
day="numeric"
@@ -771,7 +771,7 @@ function getTagVersions(tag: string): VersionDisplay[] {
771771
<span
772772
v-for="tag in v.tags"
773773
:key="tag"
774-
class="text-[8px] font-semibold text-fg-subtle uppercase tracking-wide"
774+
class="text-xxs font-semibold text-fg-subtle uppercase tracking-wide"
775775
>
776776
{{ tag }}
777777
</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-[10px] font-mono rounded border"
138+
class="px-1.5 py-0.5 text-xxs 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-[9px] px-1 py-0.5 rounded font-sans font-medium"
607+
class="text-xxs px-1 py-0.5 rounded font-sans font-medium"
608608
:class="
609609
tag === 'latest'
610610
? 'bg-emerald-500/10 text-emerald-400'

0 commit comments

Comments
 (0)