Fix avatars

Author: driesvints

resources/views/components/avatar.blade.php

@@ -3,25 +3,25 @@
     'unlinked' => false,
 ])
 
+<?php
+$src = $user->githubUsername()
+    ? sprintf('https://unavatar.io/github/%s?%s', $user->githubUsername(), http_build_query([
+        'fallback' => asset('https://laravel.io/images/laravelio-icon-gray.svg'),
+    ]))
+    : asset('https://laravel.io/images/laravelio-icon-gray.svg');
+?>
+
 @unless ($unlinked)
     <a href="{{ route('profile', $user->username()) }}">
 @endunless
 
-@if ($user->githubUsername())
-    <flux:avatar
-        circle
-        src="{{ sprintf('https://unavatar.io/github/%s?%s', $user->githubUsername(), http_build_query([
-            'fallback' => asset('https://laravel.io/images/laravelio-icon-gray.svg'),
-        ])) }}"
-        {{ $attributes->merge(['class' => 'bg-gray-50']) }}
-    />
-@else
-    <img loading="lazy"
-        src="{{ asset('https://laravel.io/images/laravelio-icon-gray.svg') }}"
-        alt="{{ $user->name() }}"
-        {{ $attributes->merge(['class' => 'bg-gray-50 rounded-full']) }}
-    />
-@endif
+<flux:avatar
+    circle
+    loading="lazy"
+    src="{{ $src }}"
+    alt="{{ $user->name() }}"
+    {{ $attributes->merge(['class' => 'bg-gray-50']) }}
+/>
 
 @unless ($unlinked)
     </a>

resources/views/components/community-member.blade.php

@@ -1,4 +1,4 @@
-<div class="shrink-0 w-14 h-14 md:w-20 md:h-20 mr-8 my-2 cursor-pointer">
+<div class="shrink-0 mr-8 my-2 cursor-pointer">
     <x-stat-popout
         x-cloak
         x-show="active == '{{ $member->id }}'"
@@ -8,8 +8,9 @@ class="w-64 absolute -mt-40 -ml-20"
 
     <x-avatar
         :user="$member"
-        class="inset-0 w-14 h-14 md:w-20 md:h-20"
+        class="inset-0"
         x-on:mouseover="active = {{ $member->id }}"
         x-on:mouseout="active = false"
+        size="xl"
     />
 </div>

resources/views/layouts/_ads/_footer.blade.php

@@ -7,14 +7,14 @@
 ?>
 
 {{-- Show the banner on bigger displays. --}}
-<div class="hidden md:block w-full">
+<div class="hidden lg:block w-full">
     <a href="{{ $long['url'] }}" target="_blank" rel="noopener noreferrer" onclick="fathom.trackGoal('{{ $long['goal'] }}', 0);">
-        <img class="block mx-auto" style="max-width:1200px" src="{{ asset("/images/showcase/{$long['image']}-long.png") }}" alt="{{ $long['alt'] }}">
+        <img class="block mx-auto w-full" style="max-width:1200px" src="{{ asset("/images/showcase/{$long['image']}-long.png") }}" alt="{{ $long['alt'] }}">
     </a>
 </div>
 
 {{-- Show the square on mobile. --}}
-<div class="block md:hidden w-full">
+<div class="block lg:hidden w-full">
     <a href="{{ $small['url'] }}" target="_blank" rel="noopener noreferrer" onclick="fathom.trackGoal('{{ $small['goal'] }}', 0);">
         <img class="block mx-auto w-full" style="max-width:300px" src="{{ asset("/images/showcase/{$small['image']}-small.png") }}" alt="{{ $small['alt'] }}">
     </a>