Added fadein animation to text and avatar

Added 'fadein' class to avatar image, littlelink_name and littlelink_description text. This class adds the fade-in animation from 'animate.css' found in /littlelink/css/.
This commit is contained in:
JulianPrieber 2022-02-22 12:48:43 +01:00 committed by GitHub
parent 4f49204b57
commit 2968da4a80
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 5 additions and 5 deletions

View File

@ -97,19 +97,19 @@
<div class="column" style="margin-top: 5%"> <div class="column" style="margin-top: 5%">
<!-- Your Image Here --> <!-- Your Image Here -->
@if(file_exists(base_path("img/$littlelink_name" . ".png" ))) @if(file_exists(base_path("img/$littlelink_name" . ".png" )))
<img class="rounded-avatar" src="{{ asset("img/$littlelink_name" . ".png") }}" width="100px" height="100px"> <img class="rounded-avatar fadein" src="{{ asset("img/$littlelink_name" . ".png") }}" width="100px" height="100px">
@elseif(file_exists(base_path("littlelink/images/avatar.png" ))) @elseif(file_exists(base_path("littlelink/images/avatar.png" )))
<img class="rounded-avatar" src="{{ asset('littlelink/images/avatar.png') }}" srcset="{{ asset('littlelink/images/avatar@2x.png 2x') }}" width="100px" height="100px"> <img class="rounded-avatar fadein" src="{{ asset('littlelink/images/avatar.png') }}" srcset="{{ asset('littlelink/images/avatar@2x.png 2x') }}" width="100px" height="100px">
@else @else
<img class="rounded-avatar" src="{{ asset('littlelink/images/logo.svg') }}" srcset="{{ asset('littlelink/images/avatar@2x.png 2x') }}" width="100px" height="100px"> <img class="rounded-avatar fadein" src="{{ asset('littlelink/images/logo.svg') }}" srcset="{{ asset('littlelink/images/avatar@2x.png 2x') }}" width="100px" height="100px">
@endif @endif
@foreach($information as $info) @foreach($information as $info)
<!-- Your Name --> <!-- Your Name -->
<h1>{{ $info->littlelink_name }}</h1> <h1 class="fadein">{{ $info->littlelink_name }}</h1>
<!-- Short Bio --> <!-- Short Bio -->
<p>{{ $info->littlelink_description }}</p> <p class="fadein">{{ $info->littlelink_description }}</p>
@endforeach @endforeach