forked from
npmx.dev/npmx.dev
[READ-ONLY]
a fast, modern browser for the npm registry
fix(ui): fix squashed avatars & add missing mobile bluesky avatar (#1022)
+17
-6
+4
-4
app/components/Header/AccountMenu.client.vue
+4
-4
app/components/Header/AccountMenu.client.vue
···
77
77
:alt="npmUser || $t('account_menu.npm_cli')"
78
78
width="24"
79
79
height="24"
80
-
class="w-6 h-6 rounded-full ring-2 ring-bg"
80
+
class="w-6 h-6 rounded-full ring-2 ring-bg object-cover"
81
81
/>
82
82
<span
83
83
v-else-if="isNpmConnected"
···
93
93
:alt="atprotoUser.handle"
94
94
width="24"
95
95
height="24"
96
-
class="w-6 h-6 rounded-full ring-2 ring-bg"
96
+
class="w-6 h-6 rounded-full ring-2 ring-bg object-cover"
97
97
:class="hasBothConnections ? 'relative z-10' : ''"
98
98
/>
99
99
<span
···
153
153
:alt="npmUser"
154
154
width="32"
155
155
height="32"
156
-
class="w-8 h-8 rounded-full"
156
+
class="w-8 h-8 rounded-full object-cover"
157
157
/>
158
158
<span
159
159
v-else
···
196
196
:alt="atprotoUser.handle"
197
197
width="32"
198
198
height="32"
199
-
class="w-8 h-8 rounded-full"
199
+
class="w-8 h-8 rounded-full object-cover"
200
200
/>
201
201
<span
202
202
v-else
+13
-2
app/components/Header/MobileMenu.client.vue
+13
-2
app/components/Header/MobileMenu.client.vue
···
252
252
:alt="npmUser"
253
253
width="20"
254
254
height="20"
255
-
class="w-5 h-5 rounded-full"
255
+
class="w-5 h-5 rounded-full object-cover"
256
256
/>
257
257
<span
258
258
v-else
···
271
271
class="w-full flex items-center gap-3 px-3 py-3 rounded-md font-mono text-sm text-fg hover:bg-bg-subtle transition-colors duration-200 text-start"
272
272
@click="handleShowAuth"
273
273
>
274
-
<span class="w-5 h-5 rounded-full bg-bg-muted flex items-center justify-center">
274
+
<img
275
+
v-if="atprotoUser.avatar"
276
+
:src="atprotoUser.avatar"
277
+
:alt="atprotoUser.handle"
278
+
width="20"
279
+
height="20"
280
+
class="w-5 h-5 rounded-full object-cover"
281
+
/>
282
+
<span
283
+
v-else
284
+
class="w-5 h-5 rounded-full bg-bg-muted flex items-center justify-center"
285
+
>
275
286
<span class="i-carbon-cloud w-3 h-3 text-fg-muted" aria-hidden="true" />
276
287
</span>
277
288
<span class="flex-1 truncate">@{{ atprotoUser.handle }}</span>