danil_belikov/dressed_for_succes_store
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Refactor header and homepage layout, extract footer component

Browse Source
This commit is contained in:
belikovme 2025-02-26 19:25:45 +07:00
parent 01e10367ba
commit 1e9a516f9f
3 changed files with 44 additions and 42 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

37
components/Footer.tsx Normal file
View File

@ -0,0 +1,37 @@
export default function Footer() {
return (
<footer className="bg-primary text-white py-12">
<div className="container mx-auto px-6">
<div className="grid grid-cols-1 md:grid-cols-3 gap-8">
<div>
<h4 className="text-xl mb-4">О нас</h4>
<p className="text-gray-400">
Мы создаем элегантную одежду для тех, кто ценит качество и стиль.
</p>
</div>
<div>
<h4 className="text-xl mb-4">Контакты</h4>
<p className="text-gray-400">
Email: info@brandstore.com<br />
Телефон: +7 (999) 123-45-67
</p>
</div>
<div>
<h4 className="text-xl mb-4">Подписаться</h4>
<div className="flex">
<input
type="email"
placeholder="Ваш email"
className="bg-white/10 px-4 py-2 rounded-l-full focus:outline-none"
/>
<button className="bg-accent px-6 rounded-r-full hover:bg-accent/90 transition-colors">
→
</button>
</div>
</div>
</div>
</div>
</footer>
);
}

9
components/Header.tsx
View File

@ -38,14 +38,9 @@ export default function Header() {
Магазины
</Link>
</div>
<Link href="/" className="text-2xl font-bold">
<Link href="/" className="text-sm font-medium italic">
<div className="relative h-10 w-32">
<Image
src="/logo.png"
alt="Brand Logo"
layout="fill"
objectFit="contain"
/>
Dressed for Success
</div>
</Link>
<div className="flex items-center space-x-5">

40
pages/index.tsx
View File

@ -8,6 +8,7 @@ import CookieNotification from '../components/CookieNotification';
import fs from 'fs';
import path from 'path';
import { Heart } from 'lucide-react';
import Footer from '../components/Footer';
// Типы для свойств компонента
interface HomeProps {
@ -83,10 +84,10 @@ export default function Home({ heroImages, products }: HomeProps) {
transition={{ delay: 0.2 }}
className="text-3xl text-center font-medium mb-12"
>
Новинки
Коллекция
</motion.h2>
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-x-6 gap-y-12">
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-x-6 gap-y-12">
{products.map((product, index) => (
<motion.div
key={product.id}
@ -141,38 +142,7 @@ export default function Home({ heroImages, products }: HomeProps) {
</section>
</main>
<footer className="bg-primary text-white py-12">
<div className="container mx-auto px-6">
<div className="grid grid-cols-1 md:grid-cols-3 gap-8">
<div>
<h4 className="text-xl mb-4">О нас</h4>
<p className="text-gray-400">
Мы создаем элегантную одежду для тех, кто ценит качество и стиль.
</p>
</div>
<div>
<h4 className="text-xl mb-4">Контакты</h4>
<p className="text-gray-400">
Email: info@brandstore.com<br />
Телефон: +7 (999) 123-45-67
</p>
</div>
<div>
<h4 className="text-xl mb-4">Подписаться</h4>
<div className="flex">
<input
type="email"
placeholder="Ваш email"
className="bg-white/10 px-4 py-2 rounded-l-full focus:outline-none"
/>
<button className="bg-accent px-6 rounded-r-full hover:bg-accent/90 transition-colors">
→
</button>
</div>
</div>
</div>
</div>
</footer>
<Footer />
<CookieNotification />
</div>
@ -195,7 +165,7 @@ export async function getStaticProps() {
id: 2,
name: 'Костюм хлопок',
price: 12800,
images: ['/wear/pidzak1.jpg', '/wear/pidzak2.jpg'],
images: ['/wear/pidzak2.jpg', '/wear/pidzak1.jpg'],
description: 'Стильный костюм для особых случаев',
isNew: true
},