admin/soorya-carpet
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: New design and optimization

Browse Source
This commit is contained in:
admin
2025-10-27 13:23:05 +05:45
parent 63777cb3c1
commit db9315ad22
44 changed files with 2877 additions and 336 deletions
Download Patch File Download Diff File Expand all files Collapse all files

98
resources/js/components/layout/Navbar.tsx
View File

@@ -1,6 +1,14 @@
// import { dashboard, login, register } from '@/routes';
// import { SharedData } from '@/types';
// import { Link, usePage } from '@inertiajs/react';
import {
Select,
SelectContent,
SelectGroup,
SelectItem,
SelectTrigger,
SelectValue,
} from '@/components/ui/select';
import {
Sheet,
SheetContent,
@@ -8,18 +16,55 @@ import {
SheetTitle,
SheetTrigger,
} from '@/components/ui/sheet';
import { about, artOfWeaving, contact, faq, home, product } from '@/routes';
import { about, artOfWeaving, bespoke, contact, faq, home } from '@/routes';
import index from '@/routes/index/index';
import { useLocale, useTranslations } from '@/utils/i18n';
import logo from '@asset/img/logo/soorya.png';
import { Link } from '@inertiajs/react';
import { Link, router } from '@inertiajs/react';
import { Mail, MapPin, Menu, Phone } from 'lucide-react';
export default function Navbar() {
// const [lang, setLang] = useState('en');
// const { translations } = usePage().props;
// const { post } = useForm({
// locale: lang,
// });
// console.log('lang', lang);
// const changeLanguage = (e) => {
// console.log(e);
// setLang(e);
// post(locale.change().url);
// };
// const { auth } = usePage<SharedData>().props;
const { t } = useTranslations();
const locale = useLocale();
// const { locale, translations } = usePage().props;
const changeLanguage = (newLocale: string) => {
router.post(
'/locale',
{ locale: newLocale },
{
preserveScroll: true,
preserveState: true,
onSuccess: () => {
// The page will automatically update because Inertia
// will make a new request and get the updated translations
console.log('Language changed to:', newLocale);
},
},
);
};
return (
<>
<header className="mx-auto w-full text-sm not-has-[nav]:hidden">
<div className="bg-primary py-1.5 text-white/60 max-md:hidden">
<div className="mx-auto max-w-screen-2xl px-12 max-md:px-2">
<div className="mx-auto flex max-w-screen-2xl items-center justify-between px-12 max-md:px-2">
<ul className="flex items-center gap-4">
<li>
<a
@@ -49,6 +94,19 @@ export default function Navbar() {
</a>
</li>
</ul>
<Select value={locale} onValueChange={changeLanguage}>
<SelectTrigger className="h-0 w-32 border-0 focus-visible:ring-0">
<SelectValue />
</SelectTrigger>
<SelectContent>
<SelectGroup>
{/* <SelectLabel>Fruits</SelectLabel> */}
<SelectItem value="en">English</SelectItem>
<SelectItem value="cn">中国人</SelectItem>
</SelectGroup>
</SelectContent>
</Select>
</div>
</div>
<div className="mx-auto w-full max-w-screen-2xl px-12 py-2 text-base not-has-[nav]:hidden max-md:px-4">
@@ -62,24 +120,26 @@ export default function Navbar() {
</Link>
<ul className="flex items-center gap-6 max-md:hidden">
<li>
<Link href={about()}>About Us</Link>
<Link href={about()}>{t('nav.about-us')}</Link>
</li>
<li>
<Link href={artOfWeaving()}>
Art of Weaving
{t('nav.art')}
</Link>
</li>
<li>
<Link href={product()}>Our Products</Link>
<Link href={index.product()}>
{t('nav.products')}
</Link>
</li>
<li>
<Link href={about()}>Bespoke Design</Link>
<Link href={bespoke()}>{t('nav.bespoke')}</Link>
</li>
<li>
<Link href={faq()}>FAQs</Link>
<Link href={faq()}>{t('nav.faq')}</Link>
</li>
<li>
<Link href={contact()}>Contact Us</Link>
<Link href={contact()}>{t('nav.contact')}</Link>
</li>
</ul>
@@ -94,28 +154,32 @@ export default function Navbar() {
</SheetDescription>
<ul className="mt-20 flex flex-col items-center justify-center gap-6">
<li>
<Link href={about()}>About Us</Link>
<Link href={about()}>
{t('nav.about-us')}
</Link>
</li>
<li>
<Link href={artOfWeaving()}>
Art of Weaving
{t('nav.art')}
</Link>
</li>
<li>
<Link href={product()}>
Our Products
<Link href={index.product()}>
{t('nav.products')}
</Link>
</li>
<li>
<Link href={about()}>
Bespoke Design
<Link href={bespoke()}>
{t('nav.bespoke')}
</Link>
</li>
<li>
<Link href={faq()}>FAQs</Link>
<Link href={faq()}>{t('nav.faq')}</Link>
</li>
<li>
<Link href={contact()}>Contact Us</Link>
<Link href={contact()}>
{t('nav.contact')}
</Link>
</li>
</ul>
</SheetContent>