ajuste page principal
This commit is contained in:
NANDO9322
parent
2c7249b404
commit
baf4f68ed0
5 changed files with 176 additions and 243 deletions
|
|
@ -16,6 +16,7 @@ const nextConfig: NextConfig = {
|
|||
hostname: "**",
|
||||
},
|
||||
],
|
||||
qualities: [25, 50, 75, 80, 90, 100],
|
||||
},
|
||||
};
|
||||
|
||||
|
|
|
|||
BIN
frontend/public/muie.jpeg
Normal file
BIN
frontend/public/muie.jpeg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 304 KiB |
|
|
@ -4,7 +4,7 @@
|
|||
body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
background-color: #1F2F40;
|
||||
background-color: #f8f8f8;
|
||||
}
|
||||
|
||||
@custom-variant dark (&:is(.dark *));
|
||||
|
|
|
|||
|
|
@ -160,49 +160,27 @@ export default function HomePage() {
|
|||
</section>
|
||||
|
||||
{/* Search Bar Section */}
|
||||
<section className="bg-white py-16">
|
||||
<section className="py-16">
|
||||
<div className="container mx-auto px-4 sm:px-6 lg:px-8 max-w-8xl">
|
||||
<div className="mb-8">
|
||||
<div className="flex flex-col sm:flex-row items-stretch sm:items-center gap-0 mb-6">
|
||||
<div className="flex-1 relative">
|
||||
<div className="mb-6 relative">
|
||||
<svg className="absolute left-4 top-1/2 -translate-y-1/2 w-5 h-5 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z" />
|
||||
</svg>
|
||||
<input
|
||||
type="text"
|
||||
placeholder={t('home.search.placeholder')}
|
||||
className="w-full h-14 pl-12 pr-4 border border-gray-300 rounded-l-lg rounded-r-none focus:outline-none focus:ring-2 focus:ring-primary focus:border-transparent text-base bg-white shadow-sm"
|
||||
className="w-full h-14 pl-12 pr-4 border border-gray-200 rounded-lg focus:outline-none focus:ring-2 focus:ring-primary focus:border-transparent text-base bg-white shadow-sm"
|
||||
/>
|
||||
</div>
|
||||
<Button className="bg-primary hover:bg-primary/90 text-white h-14 px-16 rounded-r-lg rounded-l-none font-semibold flex items-center justify-center gap-3 shadow-md hover:shadow-lg transition-all -ml-px min-w-[220px] text-2xl">
|
||||
<FilterIcon />
|
||||
{t('home.search.filter')}
|
||||
</Button>
|
||||
</div>
|
||||
|
||||
<div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-4 items-start">
|
||||
<div className="bg-white border-2 border-gray-200 rounded-xl shadow-sm hover:border-primary/30 transition-colors relative">
|
||||
<button
|
||||
onClick={() => toggleFilter('contractType')}
|
||||
className="flex items-center justify-between w-full p-5"
|
||||
>
|
||||
<div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-5 gap-4 items-stretch">
|
||||
{/* Contract Type - Static Expanded */}
|
||||
<div className="bg-white border-2 border-gray-200 rounded-xl shadow-sm hover:border-primary/30 transition-colors relative h-full flex flex-col">
|
||||
<div className="flex items-center justify-between w-full p-5 pb-2">
|
||||
<span className="text-base font-bold text-gray-900">{t('home.search.contractType')}</span>
|
||||
<svg
|
||||
className={`w-5 h-5 text-gray-600 transition-transform ${openFilters.contractType ? 'rotate-180' : ''}`}
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M19 9l-7 7-7-7" />
|
||||
</svg>
|
||||
</button>
|
||||
{openFilters.contractType && (
|
||||
<motion.div
|
||||
initial={{ opacity: 0, y: -10 }}
|
||||
animate={{ opacity: 1, y: 0 }}
|
||||
transition={{ duration: 0.2 }}
|
||||
className="absolute top-full left-0 right-0 mt-2 bg-white border-2 border-gray-200 rounded-xl shadow-lg z-50 space-y-3 px-5 py-5"
|
||||
>
|
||||
</div>
|
||||
<div className="space-y-3 px-5 pb-5 pt-2 flex-1">
|
||||
<label className="flex items-center text-sm text-gray-700 cursor-pointer hover:text-gray-900 transition-colors">
|
||||
<input type="checkbox" className="w-4 h-4 text-primary border-gray-300 rounded focus:ring-primary mr-3" />
|
||||
<span>{t('home.search.pj')}</span>
|
||||
|
|
@ -215,32 +193,15 @@ export default function HomePage() {
|
|||
<input type="checkbox" className="w-4 h-4 text-primary border-gray-300 rounded focus:ring-primary mr-3" />
|
||||
<span>{t('home.search.freelancer')}</span>
|
||||
</label>
|
||||
</motion.div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="bg-white border-2 border-gray-200 rounded-xl shadow-sm hover:border-primary/30 transition-colors relative">
|
||||
<button
|
||||
onClick={() => toggleFilter('workMode')}
|
||||
className="flex items-center justify-between w-full p-5"
|
||||
>
|
||||
{/* Work Mode - Static Expanded */}
|
||||
<div className="bg-white border-2 border-gray-200 rounded-xl shadow-sm hover:border-primary/30 transition-colors relative h-full flex flex-col">
|
||||
<div className="flex items-center justify-between w-full p-5 pb-2">
|
||||
<span className="text-base font-bold text-gray-900">{t('home.search.workMode')}</span>
|
||||
<svg
|
||||
className={`w-5 h-5 text-gray-600 transition-transform ${openFilters.workMode ? 'rotate-180' : ''}`}
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M19 9l-7 7-7-7" />
|
||||
</svg>
|
||||
</button>
|
||||
{openFilters.workMode && (
|
||||
<motion.div
|
||||
initial={{ opacity: 0, y: -10 }}
|
||||
animate={{ opacity: 1, y: 0 }}
|
||||
transition={{ duration: 0.2 }}
|
||||
className="absolute top-full left-0 right-0 mt-2 bg-white border-2 border-gray-200 rounded-xl shadow-lg z-50 space-y-3 px-5 py-5"
|
||||
>
|
||||
</div>
|
||||
<div className="space-y-3 px-5 pb-5 pt-2 flex-1">
|
||||
<label className="flex items-center text-sm text-gray-700 cursor-pointer hover:text-gray-900 transition-colors">
|
||||
<input type="checkbox" className="w-4 h-4 text-primary border-gray-300 rounded focus:ring-primary mr-3" />
|
||||
<span>{t('home.search.homeOffice')}</span>
|
||||
|
|
@ -253,92 +214,51 @@ export default function HomePage() {
|
|||
<input type="checkbox" className="w-4 h-4 text-primary border-gray-300 rounded focus:ring-primary mr-3" />
|
||||
<span>{t('home.search.hybrid')}</span>
|
||||
</label>
|
||||
</motion.div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="bg-white border-2 border-gray-200 rounded-xl shadow-sm hover:border-primary/30 transition-colors relative">
|
||||
<button
|
||||
onClick={() => toggleFilter('location')}
|
||||
className="flex items-center justify-between w-full p-5"
|
||||
>
|
||||
{/* Location - Static Expanded */}
|
||||
<div className="bg-white border-2 border-gray-200 rounded-xl shadow-sm hover:border-primary/30 transition-colors relative h-full flex flex-col">
|
||||
<div className="flex items-center justify-between w-full p-5 pb-2">
|
||||
<span className="text-base font-bold text-gray-900">{t('home.search.location')}</span>
|
||||
<svg
|
||||
className={`w-5 h-5 text-gray-600 transition-transform ${openFilters.location ? 'rotate-180' : ''}`}
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M19 9l-7 7-7-7" />
|
||||
</svg>
|
||||
</button>
|
||||
{openFilters.location && (
|
||||
<motion.div
|
||||
initial={{ opacity: 0, y: -10 }}
|
||||
animate={{ opacity: 1, y: 0 }}
|
||||
transition={{ duration: 0.2 }}
|
||||
className="absolute top-full left-0 right-0 mt-2 bg-white border-2 border-gray-200 rounded-xl shadow-lg z-50 px-5 py-5"
|
||||
>
|
||||
<div className="flex items-stretch w-full">
|
||||
</div>
|
||||
<div className="px-5 pb-5 pt-2 flex-1 flex items-center">
|
||||
<input
|
||||
type="text"
|
||||
placeholder="Digite a cidade e estado"
|
||||
className="flex-1 border border-gray-300 rounded-l-lg rounded-r-none px-4 py-2 focus:outline-none focus:ring-2 focus:ring-primary h-12"
|
||||
placeholder="Cidade e estado"
|
||||
className="w-full border border-gray-300 rounded-lg px-4 py-2 focus:outline-none focus:ring-2 focus:ring-primary h-12"
|
||||
/>
|
||||
<button type="button" className="bg-orange-500 hover:bg-orange-600 rounded-r-lg rounded-l-none flex items-center justify-center px-4 h-12" title="Enviar" style={{marginLeft: 0}}>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" strokeWidth={2} stroke="white" className="w-5 h-5">
|
||||
<path strokeLinecap="round" strokeLinejoin="round" d="M5 12h14M12 5l7 7-7 7" />
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
</motion.div>
|
||||
)}
|
||||
</div>
|
||||
|
||||
<div className="bg-white border-2 border-gray-200 rounded-xl shadow-sm hover:border-primary/30 transition-colors relative">
|
||||
<button
|
||||
onClick={() => toggleFilter('salary')}
|
||||
className="flex items-center justify-between w-full p-5"
|
||||
>
|
||||
{/* Salary - Static Expanded */}
|
||||
<div className="bg-white border-2 border-gray-200 rounded-xl shadow-sm hover:border-primary/30 transition-colors relative h-full flex flex-col">
|
||||
<div className="flex items-center justify-between w-full p-5 pb-2">
|
||||
<span className="text-base font-bold text-gray-900">{t('home.search.salary')}</span>
|
||||
<svg
|
||||
className={`w-5 h-5 text-gray-600 transition-transform ${openFilters.salary ? 'rotate-180' : ''}`}
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M19 9l-7 7-7-7" />
|
||||
</svg>
|
||||
</button>
|
||||
{openFilters.salary && (
|
||||
<motion.div
|
||||
initial={{ opacity: 0, y: -10 }}
|
||||
animate={{ opacity: 1, y: 0 }}
|
||||
transition={{ duration: 0.2 }}
|
||||
className="absolute top-full left-0 right-0 mt-2 bg-white border-2 border-gray-200 rounded-xl shadow-lg z-50 px-5 py-5"
|
||||
>
|
||||
<div className="flex items-stretch w-full">
|
||||
</div>
|
||||
<div className="px-5 pb-5 pt-2 flex-1 flex items-center">
|
||||
<input
|
||||
type="text"
|
||||
placeholder="Digite a pretensão salarial"
|
||||
className="flex-1 border border-gray-300 rounded-l-lg rounded-r-none px-4 py-2 focus:outline-none focus:ring-2 focus:ring-primary h-12"
|
||||
placeholder="R$ 0,00"
|
||||
className="w-full border border-gray-300 rounded-lg px-4 py-2 focus:outline-none focus:ring-2 focus:ring-primary h-12"
|
||||
/>
|
||||
<button type="button" className="bg-orange-500 hover:bg-orange-600 rounded-r-lg rounded-l-none flex items-center justify-center px-4 h-12" title="Enviar" style={{marginLeft: 0}}>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" strokeWidth={2} stroke="white" className="w-5 h-5">
|
||||
<path strokeLinecap="round" strokeLinejoin="round" d="M5 12h14M12 5l7 7-7 7" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Filter Button - Unified */}
|
||||
<Button className="bg-primary hover:bg-primary/90 text-white h-full min-h-[200px] lg:min-h-0 rounded-xl font-bold text-3xl shadow-md hover:shadow-lg transition-all flex flex-col gap-3 items-center justify-center">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" strokeWidth={3} stroke="currentColor" className="size-12">
|
||||
<path strokeLinecap="round" strokeLinejoin="round" d="M21 21l-5.197-5.197m0 0A7.5 7.5 0 105.196 5.196a7.5 7.5 0 0010.607 10.607z" />
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
</motion.div>
|
||||
)}
|
||||
</div>
|
||||
{t('home.search.filter')}
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{/* Featured Jobs */}
|
||||
<section className="bg-white py-12">
|
||||
<section className="py-12">
|
||||
<div className="container mx-auto px-4 sm:px-6 lg:px-8 max-w-8xl">
|
||||
<div className="flex justify-between items-center mb-8">
|
||||
<h2 className="text-3xl font-bold text-gray-900">{t('home.featuredJobs.title')}</h2>
|
||||
|
|
@ -360,59 +280,60 @@ export default function HomePage() {
|
|||
animate={{ opacity: 1, y: 0 }}
|
||||
transition={{ duration: 0.3 }}
|
||||
>
|
||||
<Card className="hover:shadow-lg transition-all border border-gray-200 rounded-2xl overflow-hidden bg-white h-full flex flex-col">
|
||||
{/* Header com logo, nome da empresa, seta e badge */}
|
||||
<div className="flex items-center justify-between p-4 border-b border-gray-100">
|
||||
<Card className="hover:shadow-lg transition-all border border-gray-200 rounded-2xl overflow-hidden bg-white h-full group cursor-pointer flex flex-col">
|
||||
<div className="p-5 flex flex-col flex-1">
|
||||
{/* Header */}
|
||||
<div className="flex items-center justify-between mb-4">
|
||||
<div className="flex items-center gap-3">
|
||||
<div className="w-10 h-10 bg-gray-100 rounded-lg flex items-center justify-center flex-shrink-0">
|
||||
<div className="w-10 h-10 bg-gray-50 rounded-lg flex items-center justify-center border border-gray-100">
|
||||
<Building2 className="w-5 h-5 text-gray-700" />
|
||||
</div>
|
||||
<span className="text-sm font-medium text-gray-900 truncate">{job.company}</span>
|
||||
<svg className="w-4 h-4 text-gray-400 flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M9 5l7 7-7 7" />
|
||||
</svg>
|
||||
<span className="text-sm font-bold text-gray-900 line-clamp-1">{job.company}</span>
|
||||
</div>
|
||||
<span className="text-xs px-3 py-1 bg-gray-900 text-white rounded-full font-medium flex-shrink-0">
|
||||
<span className="text-[10px] px-2.5 py-1 bg-gray-900 text-white rounded-md font-bold uppercase tracking-wide">
|
||||
{statusLabel}
|
||||
</span>
|
||||
</div>
|
||||
|
||||
{/* Background Image */}
|
||||
<div className="relative h-32 bg-gradient-to-br from-blue-50 to-purple-50 flex items-center justify-center overflow-hidden">
|
||||
{/* Content */}
|
||||
<div className="flex-1">
|
||||
<h3 className="font-bold text-lg text-gray-900 mb-3 leading-tight line-clamp-2 pb-3 border-b border-gray-100">{job.title}</h3>
|
||||
<div className="relative w-full h-32 mb-4 flex items-center justify-center bg-gray-50/50 rounded-lg border border-gray-50">
|
||||
<Image
|
||||
src="/111.png"
|
||||
alt="Background"
|
||||
alt="Job Illustration"
|
||||
fill
|
||||
className="object-cover"
|
||||
className="object-contain p-2"
|
||||
quality={100}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<CardContent className="p-5 flex flex-col flex-1">
|
||||
{/* Título da vaga */}
|
||||
<h3 className="font-bold text-lg text-gray-900 mb-2 line-clamp-2">{job.title}</h3>
|
||||
|
||||
{/* Info do nível */}
|
||||
<div className="mb-4 pb-4 border-b border-gray-200">
|
||||
<p className="text-sm text-gray-500">{level} · {job.location}</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Botões */}
|
||||
<div className="mt-auto flex gap-2">
|
||||
{/* Footer Section with Separator */}
|
||||
<div className="px-5 pb-5 pt-0 mt-auto">
|
||||
<div className="border-t border-gray-200 pt-4 mb-4">
|
||||
<p className="text-sm text-gray-500 font-medium flex items-center gap-2">
|
||||
<span className="text-gray-900 font-bold">{level}</span>
|
||||
<span className="w-1 h-1 rounded-full bg-gray-300"></span>
|
||||
{job.location}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="flex gap-3">
|
||||
<Button
|
||||
variant="outline"
|
||||
className="flex-1 border-gray-300 text-gray-700 hover:bg-gray-50 rounded-lg font-medium h-9 text-sm flex items-center justify-center gap-2"
|
||||
className="flex-1 border-gray-200 text-gray-700 hover:bg-gray-50 hover:text-gray-900 rounded-lg font-bold h-10 text-xs uppercase tracking-wide"
|
||||
>
|
||||
<Eye className="w-4 h-4" />
|
||||
{t('home.featuredJobs.viewJob')}
|
||||
</Button>
|
||||
<Link href={`/jobs/${job.id}`} className="flex-1">
|
||||
<Button className="w-full bg-gray-900 hover:bg-gray-800 text-white rounded-lg font-medium h-9 text-sm">
|
||||
<Button className="w-full bg-gray-900 hover:bg-gray-800 text-white rounded-lg font-bold h-10 text-xs uppercase tracking-wide">
|
||||
{t('home.featuredJobs.apply')}
|
||||
</Button>
|
||||
</Link>
|
||||
</div>
|
||||
</CardContent>
|
||||
</div>
|
||||
</Card>
|
||||
</motion.div>
|
||||
)
|
||||
|
|
@ -422,7 +343,7 @@ export default function HomePage() {
|
|||
</section>
|
||||
|
||||
{/* More Jobs Section */}
|
||||
<section className="bg-white py-12">
|
||||
<section className="py-12">
|
||||
<div className="container mx-auto px-4 sm:px-6 lg:px-8 max-w-8xl">
|
||||
<div className="flex justify-between items-center mb-8">
|
||||
<h2 className="text-3xl font-bold text-gray-900">{t('home.moreJobs.title')}</h2>
|
||||
|
|
@ -468,19 +389,21 @@ export default function HomePage() {
|
|||
</div>
|
||||
|
||||
{/* Rodapé com botões */}
|
||||
<div className="flex items-center gap-2 pt-3 border-t border-gray-100">
|
||||
<button className="flex-1 flex items-center justify-center gap-2 border border-gray-300 rounded-md hover:bg-gray-50 transition-colors h-9 px-3">
|
||||
<svg className="w-4 h-4 text-gray-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M5 5a2 2 0 012-2h10a2 2 0 012 2v16l-7-3.5L5 21V5z" />
|
||||
</svg>
|
||||
<span className="text-xs font-medium text-gray-700">{t('home.featuredJobs.favorite')}</span>
|
||||
</button>
|
||||
<div className="pt-4 mt-4 border-t border-gray-200">
|
||||
<div className="flex gap-3">
|
||||
<Button
|
||||
variant="outline"
|
||||
className="flex-1 border-gray-200 text-gray-700 hover:bg-gray-50 hover:text-gray-900 rounded-lg font-bold h-9 text-xs uppercase tracking-wide"
|
||||
>
|
||||
{t('home.featuredJobs.viewJob')}
|
||||
</Button>
|
||||
<Link href={`/jobs/${job.id}`} className="flex-1">
|
||||
<Button size="sm" className="w-full bg-primary hover:bg-primary/90 text-white rounded-md font-medium text-xs h-9">
|
||||
<Button className="w-full bg-gray-900 hover:bg-gray-800 text-white rounded-lg font-bold h-9 text-xs uppercase tracking-wide">
|
||||
{t('home.featuredJobs.apply')}
|
||||
</Button>
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
</CardContent>
|
||||
</Card>
|
||||
</motion.div>
|
||||
|
|
@ -491,29 +414,32 @@ export default function HomePage() {
|
|||
</section>
|
||||
|
||||
{/* CTA Section */}
|
||||
<section className="py-12 bg-white">
|
||||
<section className="py-12">
|
||||
<div className="container mx-auto px-4 sm:px-6 lg:px-8 max-w-8xl">
|
||||
<div className="bg-primary rounded-2xl overflow-hidden shadow-lg relative">
|
||||
<div className="absolute inset-0 z-0">
|
||||
<div className="bg-gray-900 rounded-2xl overflow-hidden shadow-lg relative min-h-[500px] flex items-center">
|
||||
{/* Image Layer: Single Image with Seamless Gradient Overlay */}
|
||||
<div className="absolute inset-y-0 right-0 w-full md:w-3/4 z-0">
|
||||
<Image
|
||||
src="/18.png"
|
||||
alt="Background"
|
||||
src="/muie.jpeg"
|
||||
alt="Woman with Notebook"
|
||||
fill
|
||||
className="object-cover object-right"
|
||||
className="object-contain object-right"
|
||||
quality={100}
|
||||
priority
|
||||
/>
|
||||
{/*
|
||||
Seamless Blend Gradient:
|
||||
Starts solid gray-900 (matching, container) on left.
|
||||
Fades gradually to transparent on right.
|
||||
This "dyes" the dark background of the photo to match the container.
|
||||
*/}
|
||||
<div className="absolute inset-0 bg-gradient-to-r from-gray-900 from-20% via-gray-900/80 via-50% to-transparent to-100%" />
|
||||
</div>
|
||||
|
||||
<div className="grid lg:grid-cols-2 gap-8 items-center p-8 lg:p-12 relative z-10">
|
||||
{/* Text Content */}
|
||||
<div className="text-white">
|
||||
<div className="flex items-center gap-2 mb-6">
|
||||
<div className="w-8 h-8 bg-white/20 rounded-full flex items-center justify-center">
|
||||
<span className="text-white font-bold text-lg">$</span>
|
||||
</div>
|
||||
<span className="font-medium text-base">{t('home.cta.badge')}</span>
|
||||
</div>
|
||||
<h2 className="text-3xl lg:text-4xl font-bold mb-4 leading-tight whitespace-nowrap">
|
||||
<div className="text-white max-w-lg">
|
||||
<h2 className="text-3xl lg:text-4xl font-bold mb-4 leading-tight">
|
||||
{t('home.cta.title')}
|
||||
</h2>
|
||||
<p className="mb-6 text-white/90 text-lg">
|
||||
|
|
|
|||
|
|
@ -28,7 +28,7 @@ export function Navbar() {
|
|||
]
|
||||
|
||||
return (
|
||||
<nav className="bg-[#1F2F40] sticky top-0 z-50 shadow-sm">
|
||||
<nav className="bg-[#1F2F40] sticky top-0 z-50 shadow-sm border-b border-white/20">
|
||||
<div className="container mx-auto px-4 sm:px-6 lg:px-8">
|
||||
<div className="flex h-16 items-center justify-between">
|
||||
{/* Logo */}
|
||||
|
|
@ -53,26 +53,26 @@ export function Navbar() {
|
|||
))}
|
||||
</div>
|
||||
|
||||
{/* Desktop Auth Buttons + Language Switcher */}
|
||||
{/* Desktop Auth Buttons */}
|
||||
<div className="hidden md:flex items-center gap-3">
|
||||
<LanguageSwitcher />
|
||||
{/* LanguageSwitcher removed to match design */ }
|
||||
{user ? (
|
||||
<Link href="/dashboard">
|
||||
<Button variant="ghost" className="gap-2">
|
||||
<Button variant="ghost" className="gap-2 text-white hover:text-primary transition-colors">
|
||||
<User className="w-4 h-4" />
|
||||
Dashboard
|
||||
</Button>
|
||||
</Link>
|
||||
) : (
|
||||
<div className="flex items-center gap-0 border-2 border-primary rounded-lg overflow-hidden">
|
||||
<div className="flex items-center gap-0 border border-primary rounded-md overflow-hidden bg-transparent">
|
||||
<Link href="/login">
|
||||
<Button variant="ghost" className="gap-2 text-primary hover:bg-primary/10 rounded-none border-r border-primary px-6">
|
||||
<Button variant="ghost" className="gap-2 text-primary hover:bg-primary/10 rounded-none border-r border-primary px-6 h-9 font-normal">
|
||||
{t('footer.login')}
|
||||
</Button>
|
||||
</Link>
|
||||
<DropdownMenu>
|
||||
<DropdownMenuTrigger asChild>
|
||||
<Button variant="ghost" size="icon" className="text-primary hover:bg-primary/10 rounded-none px-3">
|
||||
<Button variant="ghost" size="icon" className="text-primary hover:bg-primary/10 rounded-none px-3 h-9 w-9">
|
||||
<Menu className="w-5 h-5" />
|
||||
</Button>
|
||||
</DropdownMenuTrigger>
|
||||
|
|
@ -89,6 +89,12 @@ export function Navbar() {
|
|||
<span>Cadastrar Empresa</span>
|
||||
</Link>
|
||||
</DropdownMenuItem>
|
||||
<DropdownMenuItem asChild>
|
||||
<Link href="/auth/login" className="flex items-center gap-2 cursor-pointer">
|
||||
<LogIn className="w-4 h-4" />
|
||||
<span>Login</span>
|
||||
</Link>
|
||||
</DropdownMenuItem>
|
||||
</DropdownMenuContent>
|
||||
</DropdownMenu>
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Reference in a new issue