feat: enhance layout and styling of content rows and header

- Updated content card width from 140/180px to 200/280px for improved visibility
- Changed image class to use 'object-contain' and added background color for better aesthetics
- Introduced a gradient background for the header with dynamic styles based on scroll position
- Added new CSS classes for header gradient effects and improved backdrop filter for a modern look

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
Dorian
2026-02-02 22:46:45 +00:00
parent b5c6901372
commit ea03167da8
2 changed files with 37 additions and 7 deletions

View File

@@ -25,13 +25,13 @@
<div
v-for="content in contents"
:key="content.id"
class="content-card flex-shrink-0 w-[140px] md:w-[180px]"
class="content-card flex-shrink-0 w-[200px] md:w-[280px]"
@click="$emit('content-click', content)"
>
<img
:src="content.thumbnail"
:alt="content.title"
class="w-full aspect-[2/3] object-cover rounded-lg"
class="w-full aspect-[2/3] object-contain rounded-lg bg-neutral-900"
loading="lazy"
/>
<div class="mt-2">