[READ-ONLY] a fast, modern browser for the npm registry

feat: update contributor avatars on about (#670)

authored by

Salma Alam-Naylor and committed by
GitHub
89c7e489 7c1d5cbc

+16 -9
+16 -9
app/pages/about.vue
··· 189 189 target="_blank" 190 190 rel="noopener noreferrer" 191 191 class="group relative" 192 - :title="$t('about.contributors.view_profile', { name: contributor.login })" 192 + :aria-label="$t('about.contributors.view_profile', { name: contributor.login })" 193 193 > 194 - <img 195 - :src="`${contributor.avatar_url}&s=64`" 196 - :alt="contributor.login" 197 - width="32" 198 - height="32" 199 - class="w-8 h-8 rounded-full ring-2 ring-transparent group-hover:ring-accent transition-all duration-200" 200 - loading="lazy" 201 - /> 194 + <div class="relative flex items-center"> 195 + <img 196 + :src="`${contributor.avatar_url}&s=64`" 197 + :alt="contributor.login" 198 + width="32" 199 + height="32" 200 + class="w-12 h-12 rounded-lg ring-2 ring-transparent group-hover:ring-accent transition-all duration-200 ease-out hover:scale-125 will-change-transform" 201 + loading="lazy" 202 + /> 203 + <span 204 + class="pointer-events-none absolute -top-9 inset-is-1/2 -translate-x-1/2 whitespace-nowrap rounded-md bg-gray-900 text-white dark:bg-gray-100 dark:text-gray-900 text-xs px-2 py-1 shadow-lg opacity-0 scale-95 transition-all duration-150 group-hover:opacity-100 group-hover:scale-100" 205 + > 206 + @{{ contributor.login }} 207 + </span> 208 + </div> 202 209 </a> 203 210 </div> 204 211 </div>