forked from
npmx.dev/npmx.dev
[READ-ONLY]
a fast, modern browser for the npm registry
style: fix alignment for invalid user (#625)
+14
-12
+14
-12
app/pages/~[username]/index.vue
+14
-12
app/pages/~[username]/index.vue
···
175
175
</script>
176
176
177
177
<template>
178
-
<main class="container flex-1 py-8 sm:py-12 w-full">
178
+
<main class="container flex-1 flex flex-col py-8 sm:py-12 w-full">
179
179
<!-- Header -->
180
180
<header class="mb-8 pb-8 border-b border-border">
181
-
<div class="flex flex-wrap items-end gap-4">
181
+
<div class="flex flex-wrap items-center gap-4">
182
182
<!-- Avatar placeholder -->
183
183
<div
184
184
class="size-16 shrink-0 rounded-full bg-bg-muted border border-border flex items-center justify-center"
···
236
236
<NuxtLink to="/" class="btn">{{ $t('common.go_back_home') }}</NuxtLink>
237
237
</div>
238
238
239
-
<!-- Empty state -->
240
-
<div v-else-if="results && results.total === 0" class="py-12 text-center">
241
-
<p class="text-fg-muted font-mono">
242
-
{{ $t('user.page.no_packages') }} <span class="text-fg">~{{ username }}</span>
243
-
</p>
244
-
<p class="text-fg-subtle text-sm mt-2">{{ $t('user.page.no_packages_hint') }}</p>
245
-
</div>
246
-
247
239
<!-- Package list -->
248
-
<section v-else-if="results && packages.length > 0">
240
+
<section v-else-if="packages.length > 0">
249
241
<h2 class="text-xs text-fg-subtle uppercase tracking-wider mb-4">
250
242
{{ $t('user.page.packages_title') }}
251
243
</h2>
···
254
246
<PackageListControls
255
247
v-model:filter="filterText"
256
248
v-model:sort="sortOption"
257
-
:placeholder="$t('user.page.filter_placeholder', { count: results.total })"
249
+
:placeholder="$t('user.page.filter_placeholder', { count: results?.total ?? 0 })"
258
250
:total-count="packageCount"
259
251
:filtered-count="filteredCount"
260
252
/>
···
278
270
@page-change="handlePageChange"
279
271
/>
280
272
</section>
273
+
274
+
<!-- Empty state (no packages found for user) -->
275
+
<div v-else-if="status === 'success'" class="flex-1 flex items-center justify-center">
276
+
<div class="text-center">
277
+
<p class="text-fg-muted font-mono">
278
+
{{ $t('user.page.no_packages') }} <span class="text-fg">~{{ username }}</span>
279
+
</p>
280
+
<p class="text-fg-subtle text-sm mt-2">{{ $t('user.page.no_packages_hint') }}</p>
281
+
</div>
282
+
</div>
281
283
</main>
282
284
</template>