update
This commit is contained in:
parent
3f6e848b97
commit
27e04f61f6
|
|
@ -44,7 +44,7 @@ export default function Agent() {
|
|||
Temui anggota tim kami yang luar biasa
|
||||
</motion.p>
|
||||
|
||||
<div className=" flex flex-row items-center justify-center gap-2">
|
||||
<div className="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 gap-6 place-items-center">
|
||||
{agents.map((agent, index) => (
|
||||
<motion.div
|
||||
key={index}
|
||||
|
|
|
|||
|
|
@ -23,17 +23,18 @@ const agents = [
|
|||
|
||||
export default function BestAgent() {
|
||||
return (
|
||||
<section className="py-16 px-6 md:px-12 bg-[#f9f9f9] text-center mt-0">
|
||||
<section className="py-16 px-4 sm:px-6 md:px-12 bg-[#f9f9f9] text-center mt-0">
|
||||
<motion.h2
|
||||
initial={{ opacity: 0, y: 30 }}
|
||||
whileInView={{ opacity: 1, y: 0 }}
|
||||
transition={{ duration: 0.6 }}
|
||||
viewport={{ once: true }}
|
||||
className="text-3xl md:text-4xl font-semibold text-gray-900 mb-10"
|
||||
className="text-2xl sm:text-3xl md:text-4xl font-semibold text-gray-900 mb-10"
|
||||
>
|
||||
Our Teams
|
||||
</motion.h2>
|
||||
<div className=" flex flex-row items-center justify-center gap-2">
|
||||
|
||||
<div className="flex flex-col md:flex-row flex-wrap items-center justify-center gap-6">
|
||||
{agents.map((agent, index) => (
|
||||
<motion.div
|
||||
key={index}
|
||||
|
|
@ -45,7 +46,7 @@ export default function BestAgent() {
|
|||
ease: "easeOut",
|
||||
}}
|
||||
viewport={{ once: true, amount: 0.3 }}
|
||||
className="bg-white shadow-md px-2 py-4 gap-4 flex flex-col items-center h-[300px] w-[224px]"
|
||||
className="bg-white shadow-md p-4 flex flex-col items-center w-full max-w-[224px] h-[340px] sm:h-[300px]"
|
||||
>
|
||||
<div className="relative w-28 h-36 mb-3">
|
||||
<Image
|
||||
|
|
|
|||
|
|
@ -142,22 +142,24 @@ export default function HeaderProductJ7Awd() {
|
|||
initial={{ opacity: 0 }}
|
||||
animate={{ opacity: 1 }}
|
||||
transition={{ delay: 0.5, duration: 0.8 }}
|
||||
className="relative w-full h-[300px] sm:h-[400px] md:h-[740px] overflow-hidden"
|
||||
className="relative w-full h-[200px] sm:h-[400px] md:h-[740px] overflow-hidden"
|
||||
>
|
||||
<div className="relative w-full h-[200px] sm:h-[300px] md:h-[740px] lg:h-[740px]">
|
||||
<Image
|
||||
src={images[selectedColorIndex]}
|
||||
alt="about-header"
|
||||
fill
|
||||
className="object-cover"
|
||||
sizes="(max-width: 768px) 100vw, 640px"
|
||||
sizes="(max-width: 640px) 100vw, (max-width: 1024px) 100vw, 1400px"
|
||||
priority
|
||||
/>
|
||||
</div>
|
||||
|
||||
<motion.div
|
||||
initial={{ opacity: 0, x: -40 }}
|
||||
animate={{ opacity: 1, x: 0 }}
|
||||
transition={{ delay: 0.8, duration: 0.6 }}
|
||||
className="absolute top-1/2 left-5 md:left-56 transform -translate-y-1/2 flex flex-col gap-4 z-10"
|
||||
className="absolute top-32 md:top-1/2 left-14 md:left-56 transform -translate-y-1/2 flex flex-col gap-4 z-10"
|
||||
>
|
||||
{gradients.map((bg, index) => (
|
||||
<motion.button
|
||||
|
|
@ -165,7 +167,7 @@ export default function HeaderProductJ7Awd() {
|
|||
onClick={() => setSelectedColorIndex(index)}
|
||||
whileHover={{ scale: 1.1 }}
|
||||
whileTap={{ scale: 0.95 }}
|
||||
className={`w-6 h-6 rounded-full border-2 ${
|
||||
className={`w-4 h-4 md:w-6 md:h-6 rounded-full border-2 ${
|
||||
selectedColorIndex === index ? "border-black" : "border-white"
|
||||
} shadow-md hover:cursor-pointer`}
|
||||
style={{ background: bg }}
|
||||
|
|
|
|||
|
|
@ -142,22 +142,24 @@ export default function HeaderProductJ7Shs() {
|
|||
initial={{ opacity: 0 }}
|
||||
animate={{ opacity: 1 }}
|
||||
transition={{ delay: 0.5, duration: 0.8 }}
|
||||
className="relative w-full h-[300px] sm:h-[400px] md:h-[740px] overflow-hidden"
|
||||
className="relative w-full h-[200px] sm:h-[400px] md:h-[740px] overflow-hidden"
|
||||
>
|
||||
<div className="relative w-full h-[200px] sm:h-[300px] md:h-[740px] lg:h-[740px]">
|
||||
<Image
|
||||
src={images[selectedColorIndex]}
|
||||
alt="about-header"
|
||||
fill
|
||||
className="object-cover"
|
||||
sizes="(max-width: 768px) 100vw, 640px"
|
||||
sizes="(max-width: 640px) 100vw, (max-width: 1024px) 100vw, 1400px"
|
||||
priority
|
||||
/>
|
||||
</div>
|
||||
|
||||
<motion.div
|
||||
initial={{ opacity: 0, x: -40 }}
|
||||
animate={{ opacity: 1, x: 0 }}
|
||||
transition={{ delay: 0.8, duration: 0.6 }}
|
||||
className="absolute top-1/2 left-5 md:left-56 transform -translate-y-1/2 flex flex-col gap-4 z-10"
|
||||
className="absolute top-32 md:top-1/2 left-14 md:left-56 transform -translate-y-1/2 flex flex-col gap-4 z-10"
|
||||
>
|
||||
{gradients.map((bg, index) => (
|
||||
<motion.button
|
||||
|
|
@ -165,7 +167,7 @@ export default function HeaderProductJ7Shs() {
|
|||
onClick={() => setSelectedColorIndex(index)}
|
||||
whileHover={{ scale: 1.1 }}
|
||||
whileTap={{ scale: 0.95 }}
|
||||
className={`w-6 h-6 rounded-full border-2 ${
|
||||
className={`w-4 h-4 md:w-6 md:h-6 rounded-full border-2 ${
|
||||
selectedColorIndex === index ? "border-black" : "border-white"
|
||||
} shadow-md hover:cursor-pointer`}
|
||||
style={{ background: bg }}
|
||||
|
|
|
|||
|
|
@ -46,13 +46,13 @@ export default function HeaderProductJ8Awd() {
|
|||
transition={{ duration: 0.8 }}
|
||||
className="flex flex-col items-center gap-6"
|
||||
>
|
||||
<div className="relative w-full h-[300px] sm:h-[400px] md:h-[700px] overflow-hidden">
|
||||
<div className="relative w-full h-[200px] sm:h-[300px] md:h-[500px] lg:h-[700px] overflow-hidden">
|
||||
<Image
|
||||
src="/awd-8.png"
|
||||
alt="about-header"
|
||||
fill
|
||||
className="object-cover"
|
||||
sizes="(max-width: 768px) 100vw, 640px"
|
||||
className="object-cover object-center"
|
||||
sizes="(max-width: 640px) 100vw, (max-width: 1024px) 100vw, 1400px"
|
||||
priority
|
||||
/>
|
||||
|
||||
|
|
@ -142,22 +142,24 @@ export default function HeaderProductJ8Awd() {
|
|||
initial={{ opacity: 0 }}
|
||||
animate={{ opacity: 1 }}
|
||||
transition={{ delay: 0.5, duration: 0.8 }}
|
||||
className="relative w-full h-[300px] sm:h-[400px] md:h-[740px] overflow-hidden"
|
||||
className="relative w-full h-[200px] sm:h-[400px] md:h-[740px] overflow-hidden"
|
||||
>
|
||||
<div className="relative w-full h-[200px] sm:h-[300px] md:h-[740px] lg:h-[740px]">
|
||||
<Image
|
||||
src={images[selectedColorIndex]}
|
||||
alt="about-header"
|
||||
fill
|
||||
className="object-cover"
|
||||
sizes="(max-width: 768px) 100vw, 640px"
|
||||
sizes="(max-width: 640px) 100vw, (max-width: 1024px) 100vw, 1400px"
|
||||
priority
|
||||
/>
|
||||
</div>
|
||||
|
||||
<motion.div
|
||||
initial={{ opacity: 0, x: -40 }}
|
||||
animate={{ opacity: 1, x: 0 }}
|
||||
transition={{ delay: 0.8, duration: 0.6 }}
|
||||
className="absolute top-1/2 left-5 md:left-56 transform -translate-y-1/2 flex flex-col gap-4 z-10"
|
||||
className="absolute top-32 md:top-1/2 left-14 md:left-56 transform -translate-y-1/2 flex flex-col gap-4 z-10"
|
||||
>
|
||||
{gradients.map((bg, index) => (
|
||||
<motion.button
|
||||
|
|
@ -165,7 +167,7 @@ export default function HeaderProductJ8Awd() {
|
|||
onClick={() => setSelectedColorIndex(index)}
|
||||
whileHover={{ scale: 1.1 }}
|
||||
whileTap={{ scale: 0.95 }}
|
||||
className={`w-6 h-6 rounded-full border-2 ${
|
||||
className={`w-4 h-4 md:w-6 md:h-6 rounded-full border-2 ${
|
||||
selectedColorIndex === index ? "border-black" : "border-white"
|
||||
} shadow-md hover:cursor-pointer`}
|
||||
style={{ background: bg }}
|
||||
|
|
|
|||
|
|
@ -41,7 +41,7 @@ export default function Header() {
|
|||
<CarouselContent>
|
||||
{heroImages.map((img, index) => (
|
||||
<CarouselItem key={index}>
|
||||
<div className="relative w-full h-[810px]">
|
||||
<div className="relative w-full h-[400px] sm:h-[500px] md:h-[810px]">
|
||||
<Image
|
||||
src={img}
|
||||
alt={`JAECOO Image ${index + 1}`}
|
||||
|
|
@ -51,12 +51,12 @@ export default function Header() {
|
|||
/>
|
||||
|
||||
{index === 0 && (
|
||||
<div className="absolute inset-0 flex flex-col justify-center items-start px-6 md:px-28 z-10">
|
||||
<div className="absolute inset-0 flex flex-col justify-center items-start px-4 sm:px-8 md:px-28 z-10">
|
||||
<motion.h1
|
||||
initial={{ opacity: 0, y: 40 }}
|
||||
animate={{ opacity: 1, y: 0 }}
|
||||
transition={{ duration: 0.8, ease: "easeOut" }}
|
||||
className="text-3xl sm:text-4xl md:text-5xl font-bold text-black mb-4"
|
||||
className="text-2xl sm:text-3xl md:text-5xl font-bold text-black mb-4"
|
||||
>
|
||||
JAECOO J7 AWD
|
||||
</motion.h1>
|
||||
|
|
@ -69,16 +69,26 @@ export default function Header() {
|
|||
ease: "easeOut",
|
||||
delay: 0.2,
|
||||
}}
|
||||
className="text-lg text-black mb-6"
|
||||
className="text-sm sm:text-base md:text-lg text-black mb-6"
|
||||
>
|
||||
DELICATE OFF-ROAD SUV
|
||||
</motion.p>
|
||||
|
||||
<motion.div
|
||||
className="flex items-center gap-4"
|
||||
className="flex flex-col sm:flex-row items-start sm:items-center gap-3 sm:gap-4"
|
||||
initial={{ opacity: 0, y: 40 }}
|
||||
animate={{ opacity: 1, y: 0 }}
|
||||
transition={{ duration: 1, ease: "easeOut", delay: 0.4 }}
|
||||
>
|
||||
<motion.div
|
||||
className="flex items-center gap-4"
|
||||
initial={{ opacity: 0, y: 40 }}
|
||||
animate={{ opacity: 1, y: 0 }}
|
||||
transition={{
|
||||
duration: 1,
|
||||
ease: "easeOut",
|
||||
delay: 0.4,
|
||||
}}
|
||||
>
|
||||
<Dialog open={open} onOpenChange={setOpen}>
|
||||
<DialogTrigger asChild>
|
||||
|
|
@ -132,11 +142,9 @@ export default function Header() {
|
|||
</Button>
|
||||
</Link>
|
||||
</motion.div>
|
||||
</motion.div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* <CarouselPrevious className="absolute left-6 top-1/2 -translate-y-1/2 z-20 border border-[#155B6E] text-[#155B6E] bg-white" />
|
||||
<CarouselNext className="absolute right-6 top-1/2 -translate-y-1/2 z-20 border border-[#155B6E] text-[#155B6E] bg-white" /> */}
|
||||
</div>
|
||||
</CarouselItem>
|
||||
))}
|
||||
|
|
|
|||
|
|
@ -26,6 +26,13 @@ export default function Navbar() {
|
|||
const [showConsumerMenu, setShowConsumerMenu] = useState(false);
|
||||
const [isMobileMenuOpen, setIsMobileMenuOpen] = useState(false);
|
||||
|
||||
const [showProdukMenuMobile, setShowProdukMenuMobile] = useState(false); // fix here
|
||||
const [openMobile, setOpenMobile] = useState(false);
|
||||
const [showPriceMenuMobile, setShowPriceMenuMobile] = useState(false);
|
||||
const [showServiceMenuMobile, setShowServiceMenuMobile] = useState(false);
|
||||
const [showAboutMenuMobile, setShowAboutMenuMobile] = useState(false);
|
||||
const [showConsumerMenuMobile, setShowConsumerMenuMobile] = useState(false);
|
||||
|
||||
const isActive = (path: string) =>
|
||||
pathname === path || pathname.startsWith(path + "/");
|
||||
|
||||
|
|
@ -449,7 +456,7 @@ export default function Navbar() {
|
|||
</div>
|
||||
|
||||
{isMobileMenuOpen && (
|
||||
<div className="absolute top-full left-0 right-0 bg-white px-6 py-4 shadow-md flex flex-col gap-4 text-sm font-medium sm:hidden z-40">
|
||||
<div className="absolute top-full left-0 right-0 bg-white px-6 py-4 shadow-md flex flex-col gap-4 text-sm font-bold sm:hidden z-40">
|
||||
<Link href="/" onClick={() => setIsMobileMenuOpen(false)}>
|
||||
<Button
|
||||
variant="ghost"
|
||||
|
|
@ -457,76 +464,245 @@ export default function Navbar() {
|
|||
isActive("/") ? "bg-[#C2D8E2] text-[#1F3D4A]" : ""
|
||||
}`}
|
||||
>
|
||||
BERANDA
|
||||
HOMEPAGE
|
||||
</Button>
|
||||
</Link>
|
||||
<Link href="/product" onClick={() => setIsMobileMenuOpen(false)}>
|
||||
<div className="block lg:hidden w-full">
|
||||
<Button
|
||||
variant="ghost"
|
||||
className={`flex items-center gap-1 font-bold text-sm focus:outline-none rounded-full px-5 py-2 ${
|
||||
onClick={() => setShowProdukMenuMobile((prev) => !prev)} // ← FIX
|
||||
className={`w-full text-left flex items-center justify-start gap-1 font-bold text-sm focus:outline-none rounded-full px-5 py-2 ${
|
||||
isActive("/product") || isActive("/produk")
|
||||
? "bg-[#C2D8E2] text-[#1F3D4A]"
|
||||
: ""
|
||||
}`}
|
||||
>
|
||||
PRODUK
|
||||
PRODUCTS <ChevronDown className="w-4 h-4" />
|
||||
</Button>
|
||||
|
||||
{showProdukMenuMobile && (
|
||||
<div className="w-full mt-2 bg-white shadow px-4 py-4 rounded-xl">
|
||||
<div className="flex flex-col gap-6">
|
||||
{produkList.map((car, i) => (
|
||||
<div
|
||||
key={i}
|
||||
className="flex flex-col items-center text-center"
|
||||
>
|
||||
<Image
|
||||
src={car.img}
|
||||
alt={car.name}
|
||||
width={250}
|
||||
height={150}
|
||||
className="object-contain"
|
||||
/>
|
||||
<p className="font-bold mt-4">{car.name}</p>
|
||||
|
||||
<div className="flex flex-col gap-2 mt-2 w-full items-center">
|
||||
<Dialog open={openMobile} onOpenChange={setOpenMobile}>
|
||||
<DialogTrigger asChild>
|
||||
<Button className="bg-[#1F6779] text-white h-[40px] w-full rounded-full hover:cursor-pointer">
|
||||
TEST DRIVE
|
||||
</Button>
|
||||
</DialogTrigger>
|
||||
<DialogContent className="sm:max-w-[1400px] h-[600px]">
|
||||
<div className="flex items-center gap-4">
|
||||
<Image
|
||||
src="/masjaecoonav.png"
|
||||
alt="MAS JAECOO Logo"
|
||||
width={300}
|
||||
height={30}
|
||||
className=" object-fill"
|
||||
/>
|
||||
</div>
|
||||
<DialogHeader>
|
||||
<DialogTitle className="text-2xl text-center mb-4 font-bold">
|
||||
FORM TEST DRIVE
|
||||
</DialogTitle>
|
||||
</DialogHeader>
|
||||
|
||||
<div className="grid grid-cols-1 sm:grid-cols-2 gap-4 ">
|
||||
<Input placeholder="Nama" />
|
||||
<Input placeholder="Email" />
|
||||
<Input placeholder="Mobile Number" />
|
||||
<Input placeholder="Location" />
|
||||
</div>
|
||||
|
||||
<div className="mt-3 ">
|
||||
<Textarea placeholder="Full Message" rows={4} />
|
||||
</div>
|
||||
|
||||
<div className="mt-6 text-left">
|
||||
<Button
|
||||
onClick={() => setOpen(false)}
|
||||
className="bg-[#1F6779] text-white rounded-full"
|
||||
>
|
||||
SEND INQUIRY
|
||||
</Button>
|
||||
</div>
|
||||
</DialogContent>
|
||||
</Dialog>
|
||||
|
||||
<Link href={car.link} className="w-full">
|
||||
<Button
|
||||
variant="outline"
|
||||
className="rounded-full px-4 w-full hover:cursor-pointer hover:bg-amber-50"
|
||||
>
|
||||
EXPLORE
|
||||
</Button>
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
<div className="block lg:hidden w-full">
|
||||
<Button
|
||||
variant="ghost"
|
||||
onClick={() => setShowPriceMenuMobile((prev) => !prev)}
|
||||
className={`w-full text-left flex items-center justify-start gap-1 font-bold text-sm focus:outline-none rounded-full px-5 py-2 ${
|
||||
isActive("/price") ? "bg-[#C2D8E2] text-[#1F3D4A]" : ""
|
||||
}`}
|
||||
>
|
||||
HARGA <ChevronDown className="w-4 h-4" />
|
||||
</Button>
|
||||
|
||||
{showPriceMenuMobile && (
|
||||
<div className="w-full mt-2 bg-white shadow px-4 py-4 rounded-xl">
|
||||
<div className="flex flex-col gap-4">
|
||||
{priceList.map((item, i) => (
|
||||
<Link
|
||||
href="/price/price-information"
|
||||
onClick={() => setIsMobileMenuOpen(false)}
|
||||
key={i}
|
||||
href={item.link}
|
||||
onClick={() => {
|
||||
setIsMobileMenuOpen(false);
|
||||
setShowPriceMenuMobile(false);
|
||||
}}
|
||||
className="block w-full"
|
||||
>
|
||||
<Button
|
||||
variant="ghost"
|
||||
className={`w-full justify-start ${
|
||||
isActive("/price/information")
|
||||
className="w-full justify-start text-left text-sm font-medium hover:bg-gray-100 hover:text-[#1F6779]"
|
||||
>
|
||||
{item.name}
|
||||
</Button>
|
||||
</Link>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
<div className="block lg:hidden w-full">
|
||||
<Button
|
||||
variant="ghost"
|
||||
onClick={() => setShowServiceMenuMobile((prev) => !prev)}
|
||||
className={`w-full text-left flex items-center justify-start gap-1 font-bold text-sm focus:outline-none rounded-full px-5 py-2 ${
|
||||
isActive("/service") ? "bg-[#C2D8E2] text-[#1F3D4A]" : ""
|
||||
}`}
|
||||
>
|
||||
SERVICES <ChevronDown className="w-4 h-4" />
|
||||
</Button>
|
||||
|
||||
{showServiceMenuMobile && (
|
||||
<div className="w-full mt-2 bg-white shadow px-4 py-4 rounded-xl">
|
||||
<div className="flex flex-col gap-4">
|
||||
{serviceList.map((item, i) => (
|
||||
<Link
|
||||
key={i}
|
||||
href={item.link}
|
||||
onClick={() => {
|
||||
setIsMobileMenuOpen(false);
|
||||
setShowServiceMenuMobile(false);
|
||||
}}
|
||||
className="block w-full"
|
||||
>
|
||||
<Button
|
||||
variant="ghost"
|
||||
className="w-full justify-start text-left text-sm font-medium hover:bg-gray-100 hover:text-[#1F6779]"
|
||||
>
|
||||
{item.name}
|
||||
</Button>
|
||||
</Link>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
<div className="block lg:hidden w-full">
|
||||
<Button
|
||||
variant="ghost"
|
||||
onClick={() => setShowAboutMenuMobile((prev) => !prev)}
|
||||
className={`w-full text-left flex items-center justify-start gap-1 font-bold text-sm focus:outline-none rounded-full px-5 py-2 ${
|
||||
isActive("/about") ? "bg-[#C2D8E2] text-[#1F3D4A]" : ""
|
||||
}`}
|
||||
>
|
||||
TENTANG DEALER JAECOO <ChevronDown className="w-4 h-4" />
|
||||
</Button>
|
||||
|
||||
{showAboutMenuMobile && (
|
||||
<div className="w-full mt-2 bg-white shadow px-4 py-4 rounded-xl">
|
||||
<div className="flex flex-col gap-4">
|
||||
{aboutList.map((item, i) => (
|
||||
<Link
|
||||
key={i}
|
||||
href={item.link}
|
||||
onClick={() => {
|
||||
setIsMobileMenuOpen(false);
|
||||
setShowAboutMenuMobile(false);
|
||||
}}
|
||||
className="block w-full"
|
||||
>
|
||||
<Button
|
||||
variant="ghost"
|
||||
className="w-full justify-start text-left text-sm font-medium hover:bg-gray-100 hover:text-[#1F6779]"
|
||||
>
|
||||
{item.name}
|
||||
</Button>
|
||||
</Link>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
<div className="block lg:hidden w-full">
|
||||
<Button
|
||||
variant="ghost"
|
||||
onClick={() => setShowConsumerMenuMobile((prev) => !prev)}
|
||||
className={`w-full text-left flex items-center justify-start gap-1 font-bold text-sm focus:outline-none rounded-full px-5 py-2 ${
|
||||
isActive("/customer-service")
|
||||
? "bg-[#C2D8E2] text-[#1F3D4A]"
|
||||
: ""
|
||||
}`}
|
||||
>
|
||||
HARGA
|
||||
LAYANAN KONSUMEN <ChevronDown className="w-4 h-4" />
|
||||
</Button>
|
||||
</Link>
|
||||
|
||||
{showConsumerMenuMobile && (
|
||||
<div className="w-full mt-2 bg-white shadow px-4 py-4 rounded-xl">
|
||||
<div className="flex flex-col gap-4">
|
||||
{consumerList.map((item, i) => (
|
||||
<Link
|
||||
href="/service/program-service"
|
||||
onClick={() => setIsMobileMenuOpen(false)}
|
||||
key={i}
|
||||
href={item.link}
|
||||
onClick={() => {
|
||||
setIsMobileMenuOpen(false);
|
||||
setShowConsumerMenuMobile(false);
|
||||
}}
|
||||
className="block w-full"
|
||||
>
|
||||
<Button
|
||||
variant="ghost"
|
||||
className={`w-full justify-start ${
|
||||
isActive("/service/program-service")
|
||||
? "bg-[#C2D8E2] text-[#1F3D4A]"
|
||||
: ""
|
||||
}`}
|
||||
className="w-full justify-start text-left text-sm font-medium hover:bg-gray-100 hover:text-[#1F6779]"
|
||||
>
|
||||
SERVICES
|
||||
</Button>
|
||||
</Link>
|
||||
<Link href="/about/galery" onClick={() => setIsMobileMenuOpen(false)}>
|
||||
<Button
|
||||
variant="ghost"
|
||||
className={`w-full justify-start ${
|
||||
isActive("/about/galery") ? "bg-[#C2D8E2] text-[#1F3D4A]" : ""
|
||||
}`}
|
||||
>
|
||||
TENTANG DEALER JAECOO
|
||||
</Button>
|
||||
</Link>
|
||||
<Link
|
||||
href="/customer-service/after-sales"
|
||||
onClick={() => setIsMobileMenuOpen(false)}
|
||||
>
|
||||
<Button
|
||||
variant="ghost"
|
||||
className={`w-full justify-start ${
|
||||
isActive("/customer-service/after-sales")
|
||||
? "bg-[#C2D8E2] text-[#1F3D4A]"
|
||||
: ""
|
||||
}`}
|
||||
>
|
||||
LAYANAN KONSUMEN
|
||||
{item.name}
|
||||
</Button>
|
||||
</Link>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
<Link href="/auth" onClick={() => setIsMobileMenuOpen(false)}>
|
||||
<Button className="bg-[#1F6779] w-full justify-start">
|
||||
<Lock className="w-3 h-3 mr-1" />
|
||||
|
|
|
|||
|
|
@ -5,8 +5,14 @@ import Image from "next/image";
|
|||
export default function Video() {
|
||||
return (
|
||||
<section className="pt-10 bg-white">
|
||||
<div className="relative mb-10 w-full h-[600px]">
|
||||
<Image src={"/maintenance.png"} alt="maintenance" fill />
|
||||
<div className="relative mb-10 w-full h-[250px] sm:h-[400px] md:h-[600px]">
|
||||
<Image
|
||||
src={"/maintenance.png"}
|
||||
alt="maintenance"
|
||||
fill
|
||||
className="object-cover"
|
||||
priority
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="relative w-full h-[500px] overflow-hidden">
|
||||
|
|
|
|||
Loading…
Reference in New Issue