login update
This commit is contained in:
98
resources/views/web/stories/author.blade.php
Normal file
98
resources/views/web/stories/author.blade.php
Normal file
@@ -0,0 +1,98 @@
|
||||
{{--
|
||||
Author stories page — /stories/author/{username}
|
||||
Uses ContentLayout.
|
||||
--}}
|
||||
@extends('layouts.nova.content-layout')
|
||||
|
||||
@php
|
||||
$authorDisplayName = $author->user?->username ?? $author->name;
|
||||
$hero_title = 'Stories by ' . $authorDisplayName;
|
||||
$hero_description = 'All stories and interviews by ' . $authorDisplayName . ' on Skinbase.';
|
||||
@endphp
|
||||
|
||||
@section('page-content')
|
||||
|
||||
{{-- Author spotlight --}}
|
||||
<div class="flex items-center gap-5 rounded-xl border border-white/[0.06] bg-white/[0.02] p-6 mb-10">
|
||||
@if($author->avatar_url)
|
||||
<img src="{{ $author->avatar_url }}" alt="{{ $author->name }}"
|
||||
class="w-16 h-16 rounded-full object-cover border-2 border-white/10 flex-shrink-0" />
|
||||
@else
|
||||
<div class="w-16 h-16 rounded-full bg-nova-700 flex items-center justify-center flex-shrink-0">
|
||||
<i class="fa-solid fa-user text-xl text-white/30"></i>
|
||||
</div>
|
||||
@endif
|
||||
<div class="min-w-0">
|
||||
<h2 class="text-lg font-semibold text-white">{{ $author->name }}</h2>
|
||||
@if($author->bio)
|
||||
<p class="mt-1 text-sm text-white/50 line-clamp-2">{{ $author->bio }}</p>
|
||||
@endif
|
||||
@if($author->user)
|
||||
<a href="{{ $author->profile_url }}" class="mt-2 inline-flex items-center gap-1 text-xs text-sky-400 hover:text-sky-300 transition-colors">
|
||||
View profile <i class="fa-solid fa-arrow-right text-[10px]"></i>
|
||||
</a>
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{-- Stories grid --}}
|
||||
@if($stories->isNotEmpty())
|
||||
<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
|
||||
@foreach($stories as $story)
|
||||
<a href="{{ $story->url }}"
|
||||
class="group block rounded-xl border border-white/[0.06] bg-white/[0.02] overflow-hidden hover:bg-white/[0.05] transition-colors">
|
||||
@if($story->cover_url)
|
||||
<div class="aspect-video bg-nova-800 overflow-hidden">
|
||||
<img src="{{ $story->cover_url }}" alt="{{ $story->title }}"
|
||||
class="w-full h-full object-cover group-hover:scale-105 transition-transform duration-300"
|
||||
loading="lazy" />
|
||||
</div>
|
||||
@else
|
||||
<div class="aspect-video bg-gradient-to-br from-sky-900/20 to-indigo-900/20 flex items-center justify-center">
|
||||
<i class="fa-solid fa-feather-pointed text-3xl text-white/15"></i>
|
||||
</div>
|
||||
@endif
|
||||
<div class="p-5">
|
||||
@if($story->tags->isNotEmpty())
|
||||
<div class="flex flex-wrap gap-1.5 mb-3">
|
||||
@foreach($story->tags->take(3) as $tag)
|
||||
<span class="rounded-full px-2 py-0.5 text-[11px] font-medium bg-sky-500/10 text-sky-400 border border-sky-500/20">
|
||||
#{{ $tag->name }}
|
||||
</span>
|
||||
@endforeach
|
||||
</div>
|
||||
@endif
|
||||
<h2 class="text-base font-semibold text-white group-hover:text-sky-300 transition-colors line-clamp-2 leading-snug">
|
||||
{{ $story->title }}
|
||||
</h2>
|
||||
@if($story->excerpt)
|
||||
<p class="mt-2 text-sm text-white/45 line-clamp-2">{{ $story->excerpt }}</p>
|
||||
@endif
|
||||
<div class="mt-4 flex items-center gap-2 text-xs text-white/30">
|
||||
@if($story->published_at)
|
||||
<time datetime="{{ $story->published_at->toIso8601String() }}">
|
||||
{{ $story->published_at->format('M j, Y') }}
|
||||
</time>
|
||||
<span>·</span>
|
||||
@endif
|
||||
<span>{{ $story->reading_time }} min read</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
@endforeach
|
||||
</div>
|
||||
|
||||
<div class="mt-10 flex justify-center">
|
||||
{{ $stories->withQueryString()->links() }}
|
||||
</div>
|
||||
@else
|
||||
<div class="rounded-xl border border-white/[0.06] bg-white/[0.02] px-8 py-16 text-center">
|
||||
<i class="fa-solid fa-feather-pointed text-4xl text-white/20 mb-4 block"></i>
|
||||
<p class="text-white/40 text-sm">No published stories from this author yet.</p>
|
||||
<a href="/stories" class="mt-4 inline-block text-sm text-sky-400 hover:text-sky-300 transition-colors">
|
||||
Browse all stories →
|
||||
</a>
|
||||
</div>
|
||||
@endif
|
||||
|
||||
@endsection
|
||||
Reference in New Issue
Block a user