sysadminix/tripwithbonus
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

create ui components

Browse Source
This commit is contained in:
Timofey
2025-05-13 17:49:51 +03:00
parent 837c0f1fb6
commit e766284333
13 changed files with 202 additions and 44 deletions
Download Patch File Download Diff File Expand all files Collapse all files

47
frontend/components/Footer.tsx
View File

@@ -1,7 +1,6 @@
import React from 'react'
import Image from 'next/image'
import Link from 'next/link'
import TextInput from './ui/TextInput'
import {
FaInstagram,
FaTelegram,
@@ -10,6 +9,7 @@ import {
FaYoutube,
FaTiktok,
} from 'react-icons/fa'
import EmailHandler from './EmailHandler'
const Footer = () => {
return (
@@ -17,7 +17,7 @@ const Footer = () => {
<div className="bg-[#272424]">
<div className="flex flex-col md:flex-row px-6 py-8 w-[93%] mx-auto gap-8 md:gap-16">
{/* левый таб */}
<div className="flex flex-col space-y-5 w-full md:w-1/4">
<div className="flex flex-col space-y-5 w-full md:w-1/4 items-center md:items-start text-center md:text-left">
<Image
src="/images/footerLogo.png"
alt="logo"
@@ -28,23 +28,8 @@ const Footer = () => {
Подпишись и будь в курсе всех событий, а также получай подарки и
бонусы от Trip With Bonus
</span>
<div className="relative">
<TextInput
value=""
name="email"
placeholder="Введите ваш e-mail"
className="w-full pr-12 rounded bg-transparent border-white/20 focus:border-orange transition-colors"
/>
<button className="absolute right-0 top-1/2 -translate-y-1/2 px-6 flex items-center justify-center cursor-pointer">
<Image
src="/images/subscribe.png"
alt="submit"
width={56}
height={56}
/>
</button>
</div>
<div className="flex gap-4">
<EmailHandler />
<div className="flex gap-4 justify-center md:justify-start">
<a
href="https://instagram.com"
target="_blank"
@@ -109,9 +94,9 @@ const Footer = () => {
</div>
{/* ссылки */}
<div className="flex flex-col md:flex-row justify-between w-full md:w-2/4 space-y-8 md:space-y-0">
<div className="flex flex-col md:flex-row justify-between w-full md:w-2/4 space-y-8 md:space-y-0 items-center md:items-start text-center md:text-left">
{/* информация */}
<div className="flex flex-col space-y-4">
<div className="flex flex-col space-y-4 items-center md:items-start">
<div className="text-white text-xl font-medium md:pb-5">
Информация
</div>
@@ -144,7 +129,7 @@ const Footer = () => {
</div>
{/* О Trip With Bonus */}
<div className="flex flex-col space-y-4">
<div className="flex flex-col space-y-4 items-center md:items-start">
<div className="text-white text-xl font-medium md:pb-5">
О Trip With Bonus
</div>
@@ -169,7 +154,7 @@ const Footer = () => {
</Link>
</div>
</div>
<div className="flex flex-col space-y-4">
<div className="flex flex-col space-y-4 items-center md:items-start">
<div className="text-white text-xl font-medium md:pb-5">
Кооперация
</div>
@@ -196,7 +181,7 @@ const Footer = () => {
</div>
</div>
<div className="flex flex-col space-y-4 w-full md:w-1/4">
<div className="flex flex-col space-y-4 w-full md:w-1/4 items-center md:items-start text-center md:text-left">
<div className="text-white text-xl font-medium md:pb-5">
Свяжитесь с нами:
</div>
@@ -227,10 +212,10 @@ const Footer = () => {
support@tripwb.com
</a>
</div>
<div className="flex gap-2 mt-7">
<div className="flex flex-col md:flex-row gap-2 mt-7 justify-center md:justify-start">
<Link
href="/register"
className="bg-orange text-white px-4 py-2 rounded-2xl text-base font-medium"
className="bg-orange hover:bg-orange/80 text-white px-4 py-2 rounded-2xl text-base font-medium"
>
Регистрация
</Link>
@@ -248,16 +233,16 @@ const Footer = () => {
{/* Нижняя часть футера */}
<div>
<div className="flex flex-col justify-between md:flex-row px-6 py-4 md:py-8 w-[95%] mx-auto">
<div className="flex flex-col justify-between md:flex-row px-6 py-4 md:py-8 w-[95%] mx-auto text-center md:text-left">
<div>Copyright © {new Date().getFullYear()}. Все права защищены.</div>
<div className="flex flex-col md:flex-row py-4 md:py-0 md:space-x-5">
<Link href="/" className="hover:underline">
<div className="flex flex-col md:flex-row py-4 md:py-0 md:space-x-5 items-center md:items-start">
<Link href="/" className="hover:text-orange">
Публичная оферта
</Link>
<Link href="/" className="hover:underline">
<Link href="/" className="hover:text-orange">
Политика конфиденциальности
</Link>
<Link href="/" className="hover:underline">
<Link href="/" className="hover:text-orange">
Правила пользования сервисом
</Link>
</div>