ui changes
This commit is contained in:
@@ -32,7 +32,7 @@ export default function Contact() {
|
||||
};
|
||||
|
||||
return (
|
||||
<section className="py-20 md:py-32 px-4 sm:px-6 lg:px-8">
|
||||
<section id="contact" className="py-20 md:py-32 px-4 sm:px-6 lg:px-8">
|
||||
<div className="max-w-3xl mx-auto">
|
||||
<div className="text-center mb-12">
|
||||
<h2 className="text-3xl md:text-4xl font-bold text-foreground mb-4">
|
||||
@@ -110,9 +110,9 @@ export default function Contact() {
|
||||
</p>
|
||||
<Button
|
||||
variant="outline"
|
||||
className="w-full border-primary text-primary hover:bg-primary/5 bg-transparent"
|
||||
className="w-full border-primary text-primary hover:bg-primary/90 bg-transparent"
|
||||
>
|
||||
Open WhatsApp
|
||||
{t.contact.open}
|
||||
</Button>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -1,20 +1,26 @@
|
||||
"use client"
|
||||
"use client";
|
||||
|
||||
import { useState } from "react"
|
||||
import { Menu, X, Globe, Phone } from "lucide-react"
|
||||
import { Button } from "@/components/ui/button"
|
||||
import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger } from "@/components/ui/dropdown-menu"
|
||||
import { useLanguage } from "@/contexts/language-context"
|
||||
import { useState } from "react";
|
||||
import { Menu, X, Globe, Phone } from "lucide-react";
|
||||
import { Button } from "@/components/ui/button";
|
||||
import {
|
||||
DropdownMenu,
|
||||
DropdownMenuContent,
|
||||
DropdownMenuItem,
|
||||
DropdownMenuTrigger,
|
||||
} from "@/components/ui/dropdown-menu";
|
||||
import { useLanguage } from "@/contexts/language-context";
|
||||
import Link from "next/link";
|
||||
|
||||
export default function Header() {
|
||||
const [mobileMenuOpen, setMobileMenuOpen] = useState(false)
|
||||
const { language, setLanguage, t } = useLanguage()
|
||||
const [mobileMenuOpen, setMobileMenuOpen] = useState(false);
|
||||
const { language, setLanguage, t } = useLanguage();
|
||||
|
||||
const languages = [
|
||||
{ code: "en" as const, name: "English" },
|
||||
{ code: "uz" as const, name: "O'zbekcha" },
|
||||
{ code: "ru" as const, name: "Русский" },
|
||||
]
|
||||
];
|
||||
|
||||
return (
|
||||
<header className="sticky top-0 z-50 bg-background border-b border-border">
|
||||
@@ -31,7 +37,10 @@ export default function Header() {
|
||||
{language.toUpperCase()}
|
||||
</button>
|
||||
</DropdownMenuTrigger>
|
||||
<DropdownMenuContent align="end" className="bg-slate-800 border-slate-700">
|
||||
<DropdownMenuContent
|
||||
align="end"
|
||||
className="bg-slate-800 border-slate-700"
|
||||
>
|
||||
{languages.map((lang) => (
|
||||
<DropdownMenuItem
|
||||
key={lang.code}
|
||||
@@ -55,25 +64,43 @@ export default function Header() {
|
||||
</div>
|
||||
|
||||
<div className="hidden md:flex items-center gap-8">
|
||||
<a href="#features" className="text-foreground hover:text-primary transition-colors">
|
||||
<a
|
||||
href="#features"
|
||||
className="text-foreground hover:text-primary transition-colors"
|
||||
>
|
||||
{t.nav.features}
|
||||
</a>
|
||||
<a href="#pricing" className="text-foreground hover:text-primary transition-colors">
|
||||
<a
|
||||
href="#pricing"
|
||||
className="text-foreground hover:text-primary transition-colors"
|
||||
>
|
||||
{t.nav.pricing}
|
||||
</a>
|
||||
<a href="#faq" className="text-foreground hover:text-primary transition-colors">
|
||||
<a
|
||||
href="#faq"
|
||||
className="text-foreground hover:text-primary transition-colors"
|
||||
>
|
||||
{t.nav.faq}
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div className="hidden md:flex items-center gap-4">
|
||||
<Link href="https://demo.dwatt.uz/">
|
||||
<Button variant="outline" className="border-border bg-transparent">
|
||||
{t.nav.login}
|
||||
</Button>
|
||||
<Button className="bg-primary hover:bg-primary/90">{t.nav.signup}</Button>
|
||||
</Link>
|
||||
<a href="#contact">
|
||||
<Button className="bg-primary hover:bg-primary/90">
|
||||
{t.nav.signup}
|
||||
</Button>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<button onClick={() => setMobileMenuOpen(!mobileMenuOpen)} className="md:hidden">
|
||||
<button
|
||||
onClick={() => setMobileMenuOpen(!mobileMenuOpen)}
|
||||
className="md:hidden"
|
||||
>
|
||||
{mobileMenuOpen ? <X size={24} /> : <Menu size={24} />}
|
||||
</button>
|
||||
</nav>
|
||||
@@ -81,10 +108,16 @@ export default function Header() {
|
||||
{mobileMenuOpen && (
|
||||
<div className="md:hidden border-t border-border bg-background">
|
||||
<div className="px-4 py-4 space-y-4">
|
||||
<a href="#features" className="block text-foreground hover:text-primary">
|
||||
<a
|
||||
href="#features"
|
||||
className="block text-foreground hover:text-primary"
|
||||
>
|
||||
{t.nav.features}
|
||||
</a>
|
||||
<a href="#pricing" className="block text-foreground hover:text-primary">
|
||||
<a
|
||||
href="#pricing"
|
||||
className="block text-foreground hover:text-primary"
|
||||
>
|
||||
{t.nav.pricing}
|
||||
</a>
|
||||
<a href="#faq" className="block text-foreground hover:text-primary">
|
||||
@@ -94,11 +127,13 @@ export default function Header() {
|
||||
<Button variant="outline" className="flex-1 bg-transparent">
|
||||
{t.nav.login}
|
||||
</Button>
|
||||
<Button className="flex-1 bg-primary hover:bg-primary/90">{t.nav.signup}</Button>
|
||||
<Button className="flex-1 bg-primary hover:bg-primary/90">
|
||||
{t.nav.signup}
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</header>
|
||||
)
|
||||
);
|
||||
}
|
||||
|
||||
@@ -2,6 +2,7 @@
|
||||
|
||||
import { Button } from "@/components/ui/button"
|
||||
import { useLanguage } from "@/contexts/language-context"
|
||||
import Link from "next/link"
|
||||
|
||||
export default function Hero() {
|
||||
const { t } = useLanguage()
|
||||
@@ -14,9 +15,12 @@ export default function Hero() {
|
||||
<h1 className="text-4xl md:text-5xl lg:text-6xl font-bold text-foreground leading-tight">{t.hero.title}</h1>
|
||||
<p className="text-lg text-muted-foreground">{t.hero.description}</p>
|
||||
<div className="flex flex-col sm:flex-row gap-4">
|
||||
<Link href="https://demo.dwatt.uz/">
|
||||
<Button size="lg" className="bg-primary hover:bg-primary/90">
|
||||
{t.hero.demo}
|
||||
</Button>
|
||||
</Link>
|
||||
<a href="#contact">
|
||||
<Button
|
||||
size="lg"
|
||||
variant="outline"
|
||||
@@ -24,6 +28,7 @@ export default function Hero() {
|
||||
>
|
||||
{t.hero.contact}
|
||||
</Button>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -23,7 +23,7 @@ export default function Pricing() {
|
||||
price: t.pricingSection.plans.two.price,
|
||||
period: "/year",
|
||||
description: t.pricingSection.plans.two.desc,
|
||||
popular: true,
|
||||
|
||||
features: [
|
||||
t.pricingSection.plans.two.features[0],
|
||||
t.pricingSection.plans.two.features[1],
|
||||
@@ -37,6 +37,7 @@ export default function Pricing() {
|
||||
name: t.pricingSection.plans.three.title,
|
||||
price: t.pricingSection.plans.three.price,
|
||||
period: "per station/year",
|
||||
popular: true,
|
||||
description: t.pricingSection.plans.three.desc,
|
||||
features: [
|
||||
t.pricingSection.plans.three.features[0],
|
||||
@@ -110,7 +111,7 @@ export default function Pricing() {
|
||||
<div className="space-y-3">
|
||||
{tier.features.map((feature, featureIndex) => (
|
||||
<div key={featureIndex} className="flex items-center gap-3">
|
||||
<Check size={20} className="text-primary flex-shrink-0" />
|
||||
<Check size={20} className="text-primary shrink-0" />
|
||||
<span className="text-foreground text-sm">{feature}</span>
|
||||
</div>
|
||||
))}
|
||||
|
||||
@@ -65,7 +65,6 @@ export const translations = {
|
||||
},
|
||||
},
|
||||
},
|
||||
|
||||
pricingSection: {
|
||||
popular: "Most Popular",
|
||||
started: "Get Started",
|
||||
@@ -87,7 +86,7 @@ export const translations = {
|
||||
two: {
|
||||
title: "2 Stations",
|
||||
desc: "For growing networks",
|
||||
price: "$550/year",
|
||||
price: "$250/year",
|
||||
tag: "Most Popular",
|
||||
features: [
|
||||
"Real-time monitoring",
|
||||
@@ -114,12 +113,10 @@ export const translations = {
|
||||
},
|
||||
},
|
||||
},
|
||||
|
||||
action: {
|
||||
title: "See It In Action",
|
||||
subtitle: "Watch a quick demo of the Dwatt dashboard.",
|
||||
},
|
||||
|
||||
faq: {
|
||||
title: "Frequently Asked Questions",
|
||||
subtitle: "Can't find what you're looking for? Contact our support team.",
|
||||
@@ -150,10 +147,10 @@ export const translations = {
|
||||
},
|
||||
],
|
||||
},
|
||||
|
||||
contact: {
|
||||
title: "Get In Touch",
|
||||
subtitle: "Have questions? We're here to help.",
|
||||
open:"Open Telegram",
|
||||
fields: {
|
||||
name: "Name",
|
||||
email: "Email",
|
||||
@@ -161,19 +158,18 @@ export const translations = {
|
||||
send: "Send message",
|
||||
},
|
||||
whatsapp: {
|
||||
title: "WhatsApp Support",
|
||||
title: "Telegram Support",
|
||||
desc: "Chat with our team directly on WhatsApp for quick assistance.",
|
||||
},
|
||||
email: {
|
||||
title: "Email",
|
||||
address: "your@email.com",
|
||||
address: "info@startupinvest.uz",
|
||||
},
|
||||
response: {
|
||||
title: "Response Time",
|
||||
desc: "We typically respond within 24 hours.",
|
||||
},
|
||||
},
|
||||
|
||||
footer: {
|
||||
brand: "Dwatt",
|
||||
description: "Managing EV charging stations made simple.",
|
||||
@@ -256,7 +252,6 @@ export const translations = {
|
||||
},
|
||||
},
|
||||
},
|
||||
|
||||
pricingSection: {
|
||||
popular: "Eng Mashhur",
|
||||
started: "Boshlash",
|
||||
@@ -278,7 +273,7 @@ export const translations = {
|
||||
two: {
|
||||
title: "2 stansiya",
|
||||
desc: "O‘sib borayotgan tarmoqlar uchun",
|
||||
price: "$550/yil",
|
||||
price: "$250/yil",
|
||||
tag: "Ommabop",
|
||||
features: [
|
||||
"Real vaqtda monitoring",
|
||||
@@ -305,12 +300,10 @@ export const translations = {
|
||||
},
|
||||
},
|
||||
},
|
||||
|
||||
action: {
|
||||
title: "Amalda Ko‘ring",
|
||||
subtitle: "Dwatt panelining tezkor videosini tomosha qiling.",
|
||||
},
|
||||
|
||||
faq: {
|
||||
title: "Ko‘p So‘raladigan Savollar",
|
||||
subtitle: "Savolingiz topilmadimi? Biz bilan bog‘laning.",
|
||||
@@ -341,10 +334,10 @@ export const translations = {
|
||||
},
|
||||
],
|
||||
},
|
||||
|
||||
contact: {
|
||||
title: "Biz bilan bog‘laning",
|
||||
subtitle: "Savollaringiz bormi? Yordam berishga tayyormiz.",
|
||||
open:"Telegramni ochish",
|
||||
fields: {
|
||||
name: "Ism",
|
||||
email: "Email",
|
||||
@@ -352,19 +345,18 @@ export const translations = {
|
||||
send: "Xabar yuborish",
|
||||
},
|
||||
whatsapp: {
|
||||
title: "WhatsApp Yordam",
|
||||
title: "Telegram Yordam",
|
||||
desc: "Tezkor yordam uchun jamoamiz bilan bevosita bog‘laning.",
|
||||
},
|
||||
email: {
|
||||
title: "Email",
|
||||
address: "contact@dwatt.com",
|
||||
address: "info@startupinvest.uz",
|
||||
},
|
||||
response: {
|
||||
title: "Javob vaqti",
|
||||
desc: "Odatda 24 soat ichida javob beramiz.",
|
||||
},
|
||||
},
|
||||
|
||||
footer: {
|
||||
brand: "Dwatt",
|
||||
description: "EV zaryadlash stansiyalarini boshqarishni osonlashtiramiz.",
|
||||
@@ -447,7 +439,6 @@ export const translations = {
|
||||
},
|
||||
},
|
||||
},
|
||||
|
||||
pricingSection: {
|
||||
popular: "Самый популярный",
|
||||
started: "Начать",
|
||||
@@ -469,7 +460,7 @@ export const translations = {
|
||||
two: {
|
||||
title: "2 станции",
|
||||
desc: "Для растущих сетей",
|
||||
price: "$550/год",
|
||||
price: "$250/год",
|
||||
tag: "Самое популярное",
|
||||
features: [
|
||||
"Мониторинг в реальном времени",
|
||||
@@ -496,12 +487,10 @@ export const translations = {
|
||||
},
|
||||
},
|
||||
},
|
||||
|
||||
action: {
|
||||
title: "Посмотрите в действии",
|
||||
subtitle: "Смотрите короткую демонстрацию панели Dwatt.",
|
||||
},
|
||||
|
||||
faq: {
|
||||
title: "Часто задаваемые вопросы",
|
||||
subtitle: "Не нашли ответ? Свяжитесь с нашей службой поддержки.",
|
||||
@@ -532,30 +521,29 @@ export const translations = {
|
||||
},
|
||||
],
|
||||
},
|
||||
|
||||
contact: {
|
||||
title: "Свяжитесь с нами",
|
||||
subtitle: "Есть вопросы? Мы готовы помочь.",
|
||||
open:"Открыть Telegram",
|
||||
fields: {
|
||||
name: "Имя",
|
||||
email: "Email",
|
||||
email: "Telefon raqam/Email",
|
||||
message: "Сообщение",
|
||||
send: "Отправить сообщение",
|
||||
},
|
||||
whatsapp: {
|
||||
title: "Поддержка WhatsApp",
|
||||
title: "Поддержка Telegram",
|
||||
desc: "Свяжитесь напрямую с нашей командой для быстрой помощи.",
|
||||
},
|
||||
email: {
|
||||
title: "Email",
|
||||
address: "contact@dwatt.com",
|
||||
address: "info@startupinvest.uz",
|
||||
},
|
||||
response: {
|
||||
title: "Время ответа",
|
||||
desc: "Обычно отвечаем в течение 24 часов.",
|
||||
},
|
||||
},
|
||||
|
||||
footer: {
|
||||
brand: "Dwatt",
|
||||
description: "Управление зарядными станциями становится проще.",
|
||||
|
||||
Reference in New Issue
Block a user