refactor: separate landing hero section from fixed header

This commit is contained in:
Ruslan Bakiev
2026-03-12 17:19:22 +07:00
parent b5a292093b
commit 5a8ef3bea9
4 changed files with 30 additions and 37 deletions

View File

@@ -1,7 +1,23 @@
<template>
<div class="pb-0 -mx-3 lg:-mx-6">
<!-- Hero -->
<section class="relative mb-16 min-h-[calc(100vh-100px)] overflow-hidden">
<HeroBackground fill />
<div class="relative z-10 flex min-h-[calc(100vh-100px)] items-center justify-center px-4 pt-16 pb-28">
<div class="mx-auto max-w-4xl text-center text-white">
<h1 class="text-4xl font-black leading-tight md:text-6xl">
{{ $t('hero.tagline', 'Торговля — это просто') }}
</h1>
<p class="mx-auto mt-4 max-w-3xl text-base text-white/80 md:text-lg">
{{ $t('hero.subtitle', 'Сравнивайте предложения, находите поставщиков и управляйте закупками в одном интерфейсе.') }}
</p>
</div>
</div>
</section>
<!-- Section: How it works -->
<section class="container mx-auto px-4 mb-20 mt-12">
<section class="container mx-auto px-4 mb-20 mt-0">
<!-- Section header with line -->
<div class="flex items-center gap-6 mb-10">
<div class="h-px flex-1 bg-gradient-to-r from-transparent via-base-content/20 to-transparent" />