klevze/SkinbaseNova
1
0
Fork 0
Code Issues 2 Pull Requests Actions Packages Projects Releases Wiki Activity

Optimize academy

Browse Source
This commit is contained in:
Gregor Klevže
2026-06-09 13:16:01 +02:00
parent f89ee937c0
commit 5af95f6533
109 changed files with 6862 additions and 719 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
resources/views/academy.blade.php Normal file
View File

@@ -0,0 +1,20 @@
@extends('layouts.nova')
@push('head')
@if(request()->hasSession() && ! request()->attributes->get('skinbase.session_skipped'))
<meta name="csrf-token" content="{{ csrf_token() }}" />
@endif
@vite(['resources/js/academy.jsx'])
<style>
body.page-academy main { padding-top: 4rem; }
</style>
<script>
document.addEventListener('DOMContentLoaded', function () {
document.body.classList.add('page-academy')
})
</script>
@endpush
@section('content')
@inertia
@endsection

2
resources/views/components/dashboard/filter-select.blade.php
View File

@@ -21,7 +21,7 @@
this.open = false
},
}"
class="relative"
class="dashboard-filter-select relative"
@click.outside="open = false"
@keydown.escape.window="open = false"
>

2
resources/views/components/story-card.blade.php
View File

@@ -1,7 +1,7 @@
@props(['story'])
<a href="{{ route('stories.show', $story->slug) }}"
class="group block overflow-hidden rounded-xl border border-gray-700 bg-gray-800/70 shadow-lg transition-transform duration-200 hover:scale-[1.02] hover:border-sky-500/40">
class="story-card group block overflow-hidden rounded-xl border border-gray-700 bg-gray-800/70 shadow-lg transition-transform duration-200 hover:scale-[1.02] hover:border-sky-500/40">
@if($story->cover_url)
<div class="aspect-video overflow-hidden bg-gray-900">
<img src="{{ $story->cover_url }}" alt="{{ $story->title }}" class="h-full w-full object-cover transition-transform duration-300 group-hover:scale-105" loading="lazy" />

14
resources/views/dashboard/following.blade.php
View File

@@ -33,7 +33,7 @@
</x-slot>
</x-nova-page-header>
<section class="px-6 pb-16 pt-8 md:px-10">
<section class="following-dashboard-page px-6 pb-16 pt-8 md:px-10">
@php
$firstFollow = $following->getCollection()->first();
$latestFollowedAt = $firstFollow && !empty($firstFollow->followed_at)
@@ -43,29 +43,29 @@
@endphp
<div class="mb-6 grid gap-4 sm:grid-cols-2 xl:grid-cols-4">
<div class="rounded-2xl border border-white/[0.08] bg-white/[0.03] p-5 shadow-[0_16px_60px_rgba(0,0,0,0.16)]">
<div class="following-dashboard-card rounded-2xl border border-white/[0.08] bg-white/[0.03] p-5 shadow-[0_16px_60px_rgba(0,0,0,0.16)]">
<p class="text-xs uppercase tracking-widest text-white/35">Following</p>
<p class="mt-2 text-3xl font-semibold text-white">{{ number_format($summary['total_following']) }}</p>
<p class="mt-2 text-xs text-white/40">People you currently follow</p>
</div>
<div class="rounded-2xl border border-white/[0.08] bg-white/[0.03] p-5 shadow-[0_16px_60px_rgba(0,0,0,0.16)]">
<div class="following-dashboard-card rounded-2xl border border-white/[0.08] bg-white/[0.03] p-5 shadow-[0_16px_60px_rgba(0,0,0,0.16)]">
<p class="text-xs uppercase tracking-widest text-white/35">Mutual follows</p>
<p class="mt-2 text-3xl font-semibold text-white">{{ number_format($summary['mutual']) }}</p>
<p class="mt-2 text-xs text-white/40">People who follow you back</p>
</div>
<div class="rounded-2xl border border-white/[0.08] bg-white/[0.03] p-5 shadow-[0_16px_60px_rgba(0,0,0,0.16)]">
<div class="following-dashboard-card rounded-2xl border border-white/[0.08] bg-white/[0.03] p-5 shadow-[0_16px_60px_rgba(0,0,0,0.16)]">
<p class="text-xs uppercase tracking-widest text-white/35">One-way follows</p>
<p class="mt-2 text-3xl font-semibold text-white">{{ number_format($summary['one_way']) }}</p>
<p class="mt-2 text-xs text-white/40">People you follow who do not follow back</p>
</div>
<div class="rounded-2xl border border-sky-400/20 bg-[linear-gradient(135deg,rgba(56,189,248,0.12),rgba(255,255,255,0.03))] p-5 shadow-[0_16px_60px_rgba(14,165,233,0.08)]">
<div class="following-dashboard-card rounded-2xl border border-sky-400/20 bg-[linear-gradient(135deg,rgba(56,189,248,0.12),rgba(255,255,255,0.03))] p-5 shadow-[0_16px_60px_rgba(14,165,233,0.08)]">
<p class="text-xs uppercase tracking-widest text-sky-100/60">Latest followed</p>
<p class="mt-2 truncate text-xl font-semibold text-white">{{ $latestFollowedName ?? '—' }}</p>
<p class="mt-2 text-xs text-sky-50/60">{{ $latestFollowedAt ?? 'No recent follow activity' }}</p>
</div>
</div>
<div class="mb-6 rounded-2xl border border-white/[0.06] bg-white/[0.03] p-4 shadow-[0_16px_60px_rgba(0,0,0,0.12)]">
<div class="following-dashboard-panel mb-6 rounded-2xl border border-white/[0.06] bg-white/[0.03] p-4 shadow-[0_16px_60px_rgba(0,0,0,0.12)]">
@php
$sortOptions = [
['value' => 'recent', 'label' => 'Most recent'],
@@ -196,7 +196,7 @@
}
}"
:class="following ? 'opacity-100' : 'opacity-50'"
class="group overflow-hidden rounded-2xl border border-white/[0.06] bg-[linear-gradient(180deg,rgba(255,255,255,0.035),rgba(255,255,255,0.02))] shadow-[0_18px_70px_rgba(0,0,0,0.14)] transition-all hover:-translate-y-0.5 hover:border-white/[0.10] hover:shadow-[0_24px_90px_rgba(0,0,0,0.20)]">
class="following-dashboard-panel group overflow-hidden rounded-2xl border border-white/[0.06] bg-[linear-gradient(180deg,rgba(255,255,255,0.035),rgba(255,255,255,0.02))] shadow-[0_18px_70px_rgba(0,0,0,0.14)] transition-all hover:-translate-y-0.5 hover:border-white/[0.10] hover:shadow-[0_24px_90px_rgba(0,0,0,0.20)]">
<div class="flex items-start justify-between gap-4 border-b border-white/[0.05] px-5 py-5">
<a href="{{ $f->profile_url }}" class="min-w-0 flex-1">
<div class="flex items-center gap-4 min-w-0">

21
resources/views/emails/academy_access_issue.blade.php Normal file
View File

@@ -0,0 +1,21 @@
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Academy access activation request</title>
</head>
<body>
<h2>Academy support request</h2>
<p><strong>User:</strong> {{ $user->id }} — {{ $user->email }}</p>
<p><strong>Issue type:</strong> {{ $issueType ?? 'n/a' }}</p>
<p><strong>Reply-to email:</strong> {{ $contactEmail ?? $user->email }}</p>
<p><strong>Checkout session id:</strong> {{ $sessionId ?? 'n/a' }}</p>
<h3>Message</h3>
<p>{!! nl2br(e($message ?? 'No message provided.')) !!}</p>
<hr>
<p>Sent from Skinbase application.</p>
</body>
</html>

5
resources/views/emails/staff_application_received.blade.php
View File

@@ -41,6 +41,11 @@
<div><strong>Email:</strong> <a href="mailto:{{ $application->email }}">{{ $application->email }}</a></div>
@if($application->role)<div><strong>Role:</strong> {{ $application->role }}</div>@endif
@if($application->portfolio)<div><strong>Portfolio:</strong> <a href="{{ $application->portfolio }}">{{ $application->portfolio }}</a></div>@endif
@if($application->payload['data']['source'] ?? false)<div><strong>Source:</strong> {{ $application->payload['data']['source'] }}</div>@endif
@if($application->payload['data']['issue_type'] ?? false)<div><strong>Issue type:</strong> {{ $application->payload['data']['issue_type'] }}</div>@endif
@if($application->payload['data']['session_id'] ?? false)<div><strong>Session ID:</strong> {{ $application->payload['data']['session_id'] }}</div>@endif
@if($application->payload['data']['account_email'] ?? false)<div><strong>Account email:</strong> <a href="mailto:{{ $application->payload['data']['account_email'] }}">{{ $application->payload['data']['account_email'] }}</a></div>@endif
@if($application->payload['data']['user_id'] ?? false)<div><strong>User ID:</strong> {{ $application->payload['data']['user_id'] }}</div>@endif
</div>
</div>

2
resources/views/gallery/index.blade.php
View File

@@ -49,7 +49,7 @@
@endphp
@section('content')
<div class="container-fluid legacy-page">
<div class="gallery-page container-fluid legacy-page">
@php Banner::ShowResponsiveAd(); @endphp
@php

36
resources/views/layouts/nova.blade.php
View File

@@ -2,9 +2,9 @@
$gridVersion = request()->query('grid') === 'v2' ? 'v2' : 'v1';
$skinbaseSessionSkipped = request()->attributes->get('skinbase.session_skipped') === true;
$skinbaseCanUseSession = request()->hasSession() && ! $skinbaseSessionSkipped;
$deferToolbarSearch = request()->routeIs('index');
$deferToolbarSearch = request()->routeIs('index', 'academy.*');
$deferFontAwesome = request()->routeIs('index');
$deferWebManifest = request()->routeIs('index');
$deferWebManifest = request()->routeIs('index', 'academy.*');
$isInertiaPage = isset($page) && is_array($page);
$isAuthSeoRoute = request()->routeIs([
'login',
@@ -35,13 +35,27 @@
}
@endphp
<!DOCTYPE html>
<html lang="{{ app()->getLocale() }}" data-grid-version="{{ $gridVersion }}">
<html lang="{{ app()->getLocale() }}" data-grid-version="{{ $gridVersion }}" data-skinbase-theme="default">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
@if($skinbaseCanUseSession)
<meta name="csrf-token" content="{{ csrf_token() }}">
@endif
<script>
(() => {
const storageKey = 'skinbase.theme';
const allowedThemes = new Set(['default', 'light']);
try {
const savedTheme = localStorage.getItem(storageKey);
const theme = allowedThemes.has(savedTheme) ? savedTheme : 'default';
document.documentElement.dataset.skinbaseTheme = theme;
} catch (_error) {
document.documentElement.dataset.skinbaseTheme = 'default';
}
})();
</script>
<meta name="msvalidate.01" content="E81C84AA9CE4A9CDF1B0039010228C41">
<meta name="verify-v1" content="HNZJnSy5ZbqcrmXUXUwUMtPZzXsKQ+esjxPgXIXDQdk=">
<meta name="google-site-verification" content="D5L-4F-ZP1HFLzLsau6ge7LNGEGb9Sfio4RINkleQto">
@@ -76,6 +90,11 @@
color-scheme: dark;
}
html[data-skinbase-theme="light"] {
background-color: rgb(244, 247, 251);
color-scheme: light;
}
body {
margin: 0;
min-height: 100vh;
@@ -84,6 +103,11 @@
background-color: rgb(14, 18, 27);
color: #fff;
}
html[data-skinbase-theme="light"] body {
background-color: rgb(244, 247, 251);
color: #172033;
}
</style>
@foreach($novaCssEntries as $novaCssEntry)
@php
@@ -100,6 +124,12 @@
}),
});
</script>
<script>
window.SKINBASE_THEME = {
storageKey: 'skinbase.theme',
themes: @json(array_values(array_filter(['default', config('theme.enabled') ? 'light' : null]))),
};
</script>
@stack('head')
@if($deferToolbarSearch)

4
resources/views/layouts/nova/explore-layout.blade.php
View File

@@ -33,7 +33,7 @@
@endphp
@section('content')
<div class="container-fluid legacy-page">
<div class="explore-page container-fluid legacy-page">
@php Banner::ShowResponsiveAd(); @endphp
<div class="pt-0">
@@ -100,7 +100,7 @@
$activeTab = $current_sort ?? 'trending';
@endphp
<div class="sticky top-0 z-30 border-b border-white/10 bg-nova-900/90 backdrop-blur-md" id="gallery-ranking-tabs">
<div class="explore-page__tabs sticky top-0 z-30 border-b border-white/10 bg-nova-900/90 backdrop-blur-md" id="gallery-ranking-tabs">
<div class="px-6 md:px-10">
<div class="flex items-center justify-between gap-4">
<nav class="flex items-center gap-0 -mb-px nb-scrollbar-none overflow-x-auto" role="tablist">

19
resources/views/layouts/nova/toolbar.blade.php
View File

@@ -261,6 +261,25 @@
</div>
</div>
@if(config('theme.show_toolbar_switch'))
<button
type="button"
class="theme-toggle shrink-0"
data-theme-toggle
aria-label="Switch to default theme"
aria-pressed="true"
title="Switch to default theme"
>
<span class="theme-toggle__track" aria-hidden="true">
<span class="theme-toggle__thumb">
<i class="theme-toggle__icon theme-toggle__icon--moon fa-solid fa-moon"></i>
<i class="theme-toggle__icon theme-toggle__icon--sun fa-solid fa-sun"></i>
</span>
</span>
<span class="hidden xl:inline text-xs font-semibold uppercase tracking-[0.14em]" data-theme-toggle-label>Light</span>
</button>
@endif
@if($skinbaseToolbarCanAuth)
<!-- Notification icons -->
<div class="hidden md:flex items-center gap-0.5 lg:gap-1 text-soft shrink-0">

2
resources/views/news/_article_card.blade.php
View File

@@ -1,4 +1,4 @@
<article class="group overflow-hidden rounded-[28px] border border-white/[0.06] bg-[linear-gradient(180deg,rgba(11,16,26,0.94),rgba(7,11,19,0.92))] shadow-[0_18px_45px_rgba(0,0,0,0.22)] transition hover:-translate-y-0.5 hover:border-white/[0.12]">
<article class="skinbase-dark-surface group overflow-hidden rounded-[28px] border border-white/[0.06] bg-[linear-gradient(180deg,rgba(11,16,26,0.94),rgba(7,11,19,0.92))] shadow-[0_18px_45px_rgba(0,0,0,0.22)] transition hover:-translate-y-0.5 hover:border-white/[0.12]">
<a href="{{ route('news.show', $article->slug) }}" class="block">
<div class="relative aspect-[16/9] overflow-hidden bg-black/20">
@if($article->cover_url)

6
resources/views/news/_comments.blade.php
View File

@@ -7,14 +7,14 @@
@if($isPreview)
@if($article->commentsAreEnabled())
<section id="comments" class="mt-8 rounded-[32px] border border-white/[0.06] bg-[linear-gradient(180deg,rgba(11,16,26,0.94),rgba(7,11,19,0.92))] p-6 shadow-[0_18px_45px_rgba(0,0,0,0.2)] sm:p-8">
<section id="comments" class="news-reading-panel mt-8 rounded-[32px] border border-white/[0.06] bg-[linear-gradient(180deg,rgba(11,16,26,0.94),rgba(7,11,19,0.92))] p-6 shadow-[0_18px_45px_rgba(0,0,0,0.2)] sm:p-8">
<div class="rounded-2xl border border-indigo-300/20 bg-indigo-400/10 px-5 py-4 text-sm text-indigo-100">
Comments are enabled for this article, but posting is disabled in preview mode.
</div>
</section>
@endif
@elseif($article->commentsAreEnabled())
<section id="comments" class="mt-8 rounded-[32px] border border-white/[0.06] bg-[linear-gradient(180deg,rgba(11,16,26,0.94),rgba(7,11,19,0.92))] p-6 shadow-[0_18px_45px_rgba(0,0,0,0.2)] sm:p-8">
<section id="comments" class="news-reading-panel mt-8 rounded-[32px] border border-white/[0.06] bg-[linear-gradient(180deg,rgba(11,16,26,0.94),rgba(7,11,19,0.92))] p-6 shadow-[0_18px_45px_rgba(0,0,0,0.2)] sm:p-8">
<div class="flex flex-col gap-3 border-b border-white/[0.06] pb-6 sm:flex-row sm:items-end sm:justify-between">
<div>
<p class="text-[11px] font-semibold uppercase tracking-[0.22em] text-sky-200/70">Conversation</p>
@@ -118,4 +118,4 @@
</div>
@endif
</section>
@endif
@endif

8
resources/views/news/_sidebar.blade.php
View File

@@ -1,5 +1,5 @@
@if(!empty($categories) && $categories->isNotEmpty())
<section class="rounded-[24px] border border-white/[0.06] bg-white/[0.025] p-5">
<section class="news-sidebar-panel rounded-[24px] border border-white/[0.06] bg-white/[0.025] p-5">
<div class="mb-4 flex items-center justify-between gap-3">
<h2 class="text-sm font-semibold uppercase tracking-[0.18em] text-white/45">Categories</h2>
<span class="text-xs text-white/30">{{ $categories->count() }}</span>
@@ -16,7 +16,7 @@
@endif
@if(!empty($trending) && $trending->isNotEmpty())
<section class="rounded-[24px] border border-white/[0.06] bg-white/[0.025] p-5">
<section class="news-sidebar-panel rounded-[24px] border border-white/[0.06] bg-white/[0.025] p-5">
<div class="mb-4 flex items-center gap-2 text-sm font-semibold uppercase tracking-[0.18em] text-white/45">
<i class="fa-solid fa-fire text-[11px] text-rose-300"></i>
Trending
@@ -36,7 +36,7 @@
@endif
@if(!empty($tags) && $tags->isNotEmpty())
<section class="rounded-[24px] border border-white/[0.06] bg-white/[0.025] p-5">
<section class="news-sidebar-panel rounded-[24px] border border-white/[0.06] bg-white/[0.025] p-5">
<div class="mb-4 flex items-center justify-between gap-3">
<div class="flex items-center gap-2 text-sm font-semibold uppercase tracking-[0.18em] text-white/45">
<i class="fa-solid fa-tags text-[11px] text-sky-300"></i>
@@ -54,7 +54,7 @@
</section>
@endif
<section class="rounded-[24px] border border-amber-400/20 bg-amber-500/10 p-5 text-center">
<section class="news-sidebar-panel news-rss-panel rounded-[24px] border border-amber-400/20 bg-amber-500/10 p-5 text-center">
<p class="text-xs font-semibold uppercase tracking-[0.18em] text-amber-100/70">Stay updated</p>
<a href="{{ route('news.rss') }}" class="mt-3 inline-flex items-center gap-2 rounded-full border border-amber-300/25 bg-amber-500/10 px-4 py-2 text-sm font-medium text-amber-100 transition hover:bg-amber-500/20" target="_blank" rel="noopener noreferrer">
<i class="fa-solid fa-rss text-xs"></i>

2
resources/views/news/show.blade.php
View File

@@ -194,7 +194,7 @@
</div>
@endif
<div class="mt-6 rounded-[32px] border border-white/[0.06] bg-[linear-gradient(180deg,rgba(11,16,26,0.94),rgba(7,11,19,0.92))] p-6 shadow-[0_18px_45px_rgba(0,0,0,0.2)] sm:p-8">
<div class="news-reading-panel mt-6 rounded-[32px] border border-white/[0.06] bg-[linear-gradient(180deg,rgba(11,16,26,0.94),rgba(7,11,19,0.92))] p-6 shadow-[0_18px_45px_rgba(0,0,0,0.2)] sm:p-8">
<div class="flex flex-wrap items-center gap-x-4 gap-y-2 text-sm text-white/45">
<span>
@if($article->author?->username)

29
resources/views/web-stories/show.blade.php
View File

@@ -97,6 +97,35 @@
width: 100%;
height: 100%;
}
@media (prefers-color-scheme: light) {
body {
background: #ffffff;
}
.story-text {
color: #0f172a;
text-shadow: none;
}
.story-kicker {
color: rgba(15,23,42,0.65);
opacity: .95;
}
.story-title {
color: #0f172a;
}
.story-body {
color: #0f172a;
}
.story-cta {
background: rgba(17,24,39,0.92);
color: #ffffff;
}
.overlay {
background: linear-gradient(to top, rgba(255,255,255,0.9), rgba(255,255,255,0.6), rgba(255,255,255,0.3));
}
.gradient-fill {
background: linear-gradient(180deg, rgba(255,255,255,0.95) 0%, rgba(14,165,233,0.08) 100%);
}
}
</style>
</head>
<body>

2
resources/views/web/explore/index.blade.php
View File

@@ -16,7 +16,7 @@
<div class="flex gap-4 overflow-x-auto nb-scrollbar-none pb-2">
@foreach($spotlight as $item)
<a href="{{ !empty($item->id) ? route('art.show', ['id' => $item->id, 'slug' => $item->slug ?? null]) : '#' }}"
class="group relative flex-none w-44 md:w-52 rounded-xl overflow-hidden
class="explore-spotlight-card group relative flex-none w-44 md:w-52 rounded-xl overflow-hidden
bg-neutral-800 border border-white/10 hover:border-amber-400/40
hover:shadow-lg hover:shadow-amber-500/10 transition-all duration-200"
title="{{ $item->name ?? '' }}">

6
resources/views/web/home/hero.blade.php
View File

@@ -5,7 +5,7 @@
@endphp
@if (!$heroArtwork)
<section class="relative flex min-h-[62vh] max-h-[420px] w-full items-end overflow-hidden bg-nova-900 md:min-h-[38vh] md:max-h-[460px]">
<section class="skinbase-dark-surface relative flex min-h-[62vh] max-h-[420px] w-full items-end overflow-hidden bg-nova-900 md:min-h-[38vh] md:max-h-[460px]">
<div class="pointer-events-none absolute inset-0 bg-gradient-to-t from-nova-900 via-nova-900/60 to-transparent"></div>
<div class="relative z-10 w-full px-6 pb-7 sm:px-10 lg:px-16">
<p class="mb-1.5 text-xs font-semibold uppercase tracking-widest text-accent">
@@ -23,7 +23,7 @@
</div>
</section>
@else
<section class="group relative flex min-h-[62vh] max-h-[420px] w-full items-end overflow-hidden bg-nova-900 md:min-h-[38vh] md:max-h-[460px]">
<section class="skinbase-dark-surface group relative flex min-h-[62vh] max-h-[420px] w-full items-end overflow-hidden bg-nova-900 md:min-h-[38vh] md:max-h-[460px]">
<x-artwork.featured-picture
:image="$heroFeaturedImage ?? [
'alt' => $heroArtwork['title'] ?? 'Featured artwork',
@@ -72,4 +72,4 @@
</div>
</div>
</section>
@endif
@endif

2
resources/views/web/home/sections/collections.blade.php
View File

@@ -40,7 +40,7 @@
@endif
</div>
@if (!empty(data_get($collection, 'owner.username')))
<span class="shrink-0 text-xs font-semibold uppercase tracking-[0.14em] text-sky-100/80">@{{ data_get($collection, 'owner.username') }}</span>
<span class="shrink-0 text-xs font-semibold uppercase tracking-[0.14em] text-sky-100/80">{{ '@'.data_get($collection, 'owner.username') }}</span>
@endif
</div>

4
resources/views/web/home/sections/creators.blade.php
View File

@@ -15,7 +15,7 @@
<a
href="{{ $creator['url'] ?? '#' }}"
aria-label="View {{ $creator['name'] ?? 'Creator' }} profile"
class="group relative flex min-h-[16rem] flex-col items-center overflow-hidden rounded-xl bg-panel p-5 text-center shadow-sm transition hover:ring-1 hover:ring-nova-500"
class="{{ !empty($creator['bg_thumb']) ? 'skinbase-dark-surface ' : '' }}group relative flex min-h-[16rem] flex-col items-center overflow-hidden rounded-xl bg-panel p-5 text-center shadow-sm transition hover:ring-1 hover:ring-nova-500"
@if (!empty($creator['bg_thumb']))
style="background-image: linear-gradient(to top, rgba(13, 19, 28, 0.96), rgba(13, 19, 28, 0.7)), url('{{ $creator['bg_thumb'] }}'); background-size: cover; background-position: center;"
@endif
@@ -39,4 +39,4 @@
@endforeach
</div>
</section>
@endif
@endif

4
resources/views/web/home/sections/groups.blade.php
View File

@@ -25,7 +25,7 @@
['key' => 'followers', 'label' => 'followers', 'value' => (int) data_get($group, 'counts.followers', 0)],
])->filter(fn ($item) => $item['value'] > 0)->values();
@endphp
<article class="group relative flex flex-col overflow-hidden rounded-xl bg-panel p-5 shadow-sm transition hover:ring-1 hover:ring-nova-500">
<article class="{{ !empty($group['banner_url']) ? 'skinbase-dark-surface ' : '' }}group relative flex flex-col overflow-hidden rounded-xl bg-panel p-5 shadow-sm transition hover:ring-1 hover:ring-nova-500">
@if (!empty($group['banner_url']))
<img src="{{ $group['banner_url'] }}" alt="" aria-hidden="true" class="pointer-events-none absolute inset-0 h-full w-full object-cover opacity-40 transition duration-500 group-hover:scale-105 group-hover:opacity-20" loading="lazy" decoding="async">
<div class="pointer-events-none absolute inset-0 bg-gradient-to-t from-panel via-panel/85 to-panel/70"></div>
@@ -71,4 +71,4 @@
@endforeach
</div>
</section>
@endif
@endif

4
resources/views/web/home/sections/news.blade.php
View File

@@ -18,7 +18,7 @@
<div id="{{ $carouselId }}" class="news-carousel overflow-x-auto snap-x snap-proximity -mx-4 px-4 py-2">
<div class="flex gap-4">
@foreach ($newsItems as $item)
<article class="snap-start flex-shrink-0 w-[260px] group overflow-hidden rounded-[20px] border border-white/[0.06] bg-[linear-gradient(180deg,rgba(11,16,26,0.94),rgba(7,11,19,0.92))] shadow-[0_12px_30px_rgba(0,0,0,0.18)] transition hover:-translate-y-0.5 hover:border-white/[0.12]">
<article class="skinbase-dark-surface snap-start flex-shrink-0 w-[260px] group overflow-hidden rounded-[20px] border border-white/[0.06] bg-[linear-gradient(180deg,rgba(11,16,26,0.94),rgba(7,11,19,0.92))] shadow-[0_12px_30px_rgba(0,0,0,0.18)] transition hover:-translate-y-0.5 hover:border-white/[0.12]">
<a href="{{ $item['url'] ?? '#' }}" class="block">
<div class="relative aspect-[4/3] overflow-hidden bg-black/20">
@if (!empty($item['cover_url']))
@@ -131,4 +131,4 @@
display: none;
}
</style>
@endpush
@endpush

4
resources/views/web/home/sections/suggested-creators.blade.php
View File

@@ -22,7 +22,7 @@
<div class="mt-3 w-full text-center">
<a href="{{ $creator['url'] ?? '#' }}" class="block truncate text-sm font-semibold text-white transition hover:text-accent">{{ $creator['name'] ?? 'Creator' }}</a>
@if (!empty($creator['username']))
<p class="truncate text-xs text-nova-400">@{{ $creator['username'] }}</p>
<p class="truncate text-xs text-nova-400">{{ '@' . $creator['username'] }}</p>
@endif
<div class="mt-2 flex items-center justify-center gap-3 text-xs text-nova-500">
@if ((int) ($creator['followers_count'] ?? 0) > 0)
@@ -40,4 +40,4 @@
@endforeach
</div>
</section>
@endif
@endif

8
resources/views/web/stories/index.blade.php
View File

@@ -43,7 +43,8 @@
</x-slot>
</x-nova-page-header>
<div class="border-b border-white/10 bg-nova-900/90 backdrop-blur-md">
<div class="stories-index-page">
<div class="stories-index-page__tabs border-b border-white/10 bg-nova-900/90 backdrop-blur-md">
<div class="px-6 md:px-10">
<nav data-stories-tabs class="flex items-center gap-0 -mb-px nb-scrollbar-none overflow-x-auto" role="tablist" aria-label="Stories sections">
@foreach($storyTabs as $index => $tab)
@@ -61,7 +62,7 @@
</div>
</div>
<div class="border-b border-white/10 bg-nova-900/70">
<div class="stories-index-page__categories border-b border-white/10 bg-nova-900/70">
<div class="px-6 md:px-10 py-6">
<div class="flex gap-3 overflow-x-auto nb-scrollbar-none pb-1">
<a href="{{ route('stories.index') }}" class="whitespace-nowrap rounded-full px-3 py-1.5 text-sm font-semibold transition-colors {{ $currentCategory === '' ? 'bg-orange-500 text-white' : 'border border-white/10 bg-white/[0.05] text-white/70 hover:bg-white/[0.1] hover:text-white' }}">All</a>
@@ -77,7 +78,7 @@
<div class="px-6 pb-16 md:px-10">
<div class="space-y-10">
@if($featured)
<section id="featured" class="overflow-hidden rounded-xl border border-gray-700 bg-gray-800/70 shadow-lg">
<section id="featured" class="stories-index-page__featured overflow-hidden rounded-xl border border-gray-700 bg-gray-800/70 shadow-lg">
<a href="{{ route('stories.show', $featured->slug) }}" class="grid gap-0 lg:grid-cols-2">
<div class="aspect-video overflow-hidden bg-gray-900">
@if($featured->cover_url)
@@ -129,6 +130,7 @@
</section>
</div>
</div>
</div>
@endsection
@push('scripts')

19
resources/views/web/stories/show.blade.php
View File

@@ -44,7 +44,24 @@
@endsection
@section('page-content')
<div class="mx-auto grid max-w-7xl gap-8 lg:grid-cols-12">
<div id="story-page" class="mx-auto grid max-w-7xl gap-8 lg:grid-cols-12">
<style>
@media (prefers-color-scheme: light) {
#story-page { color-scheme: light; }
#story-page .rounded-xl.border { background: #ffffff !important; border-color: #e6e6ef !important; }
#story-page img { background: transparent; }
#story-page h1.text-white { color: #0f172a !important; }
#story-page .text-white { color: #0f172a !important; }
#story-page .text-gray-300 { color: #6b7280 !important; }
#story-page .text-gray-400 { color: #9ca3af !important; }
#story-page .prose, #story-page .story-prose, #story-page .prose * { color: #0f172a !important; }
#story-page .prose a, #story-page a { color: #0f6fbf !important; }
#story-page .rounded-xl.border .p-6 { background: transparent !important; }
#story-page .rounded-xl.border.bg-gray-900\/50, #story-page .bg-gray-900\/50 { background: rgba(17,24,39,0.05) !important; }
#story-page textarea, #story-page button { color: inherit !important; }
#story-page button, #story-page .w-full.rounded-lg { background: #fef2f2 !important; color: #9f1239 !important; border-color: #fbcfe8 !important; }
}
</style>
<article class="lg:col-span-8">
<div class="overflow-hidden rounded-xl border border-gray-700 bg-gray-800/70">
@if($story->cover_url)