mpn
/
LLC
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

minimum

main
Amir Hossein Moghiseh 2025-02-19 15:04:53 +03:30
parent b9ade153d4
commit 3b5b7678f3
13 changed files with 230 additions and 62 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
package.json
View File

@ -9,6 +9,7 @@
"lint": "next lint"
},
"dependencies": {
"embla-carousel-react": "^8.5.2",
"framer-motion": "^12.4.2",
"lucide-react": "^0.475.0",
"next": "15.1.6",

25
pnpm-lock.yaml
View File

@ -5,6 +5,9 @@ settings:
excludeLinksFromLockfile: false
dependencies:
embla-carousel-react:
specifier: ^8.5.2
version: 8.5.2(react@19.0.0)
framer-motion:
specifier: ^12.4.2
version: 12.4.3(react-dom@19.0.0)(react@19.0.0)
@ -1102,6 +1105,28 @@ packages:
resolution: {integrity: sha512-I88TYZWc9XiYHRQ4/3c5rjjfgkjhLyW2luGIheGERbNQ6OY7yTybanSpDXZa8y7VUP9YmDcYa+eyq4ca7iLqWA==}
dev: true
/embla-carousel-react@8.5.2(react@19.0.0):
resolution: {integrity: sha512-Tmx+uY3MqseIGdwp0ScyUuxpBgx5jX1f7od4Cm5mDwg/dptEiTKf9xp6tw0lZN2VA9JbnVMl/aikmbc53c6QFA==}
peerDependencies:
react: ^16.8.0 || ^17.0.1 || ^18.0.0 || ^19.0.0 || ^19.0.0-rc
dependencies:
embla-carousel: 8.5.2
embla-carousel-reactive-utils: 8.5.2(embla-carousel@8.5.2)
react: 19.0.0
dev: false
/embla-carousel-reactive-utils@8.5.2(embla-carousel@8.5.2):
resolution: {integrity: sha512-QC8/hYSK/pEmqEdU1IO5O+XNc/Ptmmq7uCB44vKplgLKhB/l0+yvYx0+Cv0sF6Ena8Srld5vUErZkT+yTahtDg==}
peerDependencies:
embla-carousel: 8.5.2
dependencies:
embla-carousel: 8.5.2
dev: false
/embla-carousel@8.5.2:
resolution: {integrity: sha512-xQ9oVLrun/eCG/7ru3R+I5bJ7shsD8fFwLEY7yPe27/+fDHCNj0OT5EoG5ZbFyOxOcG6yTwW8oTz/dWyFnyGpg==}
dev: false
/emoji-regex@8.0.0:
resolution: {integrity: sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==}
dev: true

BIN
public/images/logo-ar.png 100644
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 185 KiB

BIN
public/images/logo-en.png 100644
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 321 KiB

2
src/components/Cards/CardNormal/page.jsx
View File

@ -14,7 +14,7 @@ const CardNormal = ({ data, priority }) => {
<div className="group">
{" "}
<>
<Link href={`/products/${data.id}`} >
<Link href={`/products/${data.id}`} onClick={(e)=>e.preventDefault()} >
<div
className={` tr03 py-2 overflow-hidden xs:h-[270px] lg:h-[270px] border border-gray-200 ${1 == 1 ? "bg-white rounded-xl rounded-tl-[40px]" : " opacity-70"
}`}

57
src/components/Carousel/ProductCarousel.jsx 100644
View File

@ -0,0 +1,57 @@
"use client"
import { useCallback } from "react"
import useEmblaCarousel from "embla-carousel-react"
import { ChevronLeft, ChevronRight } from "lucide-react"
import CardNormal from "../Cards/CardNormal/page"
export function ProductCarouselSection({products}) {
const [emblaRef, emblaApi] = useEmblaCarousel({ loop: false, align: "start" })
const scrollPrev = useCallback(() => {
if (emblaApi) emblaApi.scrollPrev()
}, [emblaApi])
const scrollNext = useCallback(() => {
if (emblaApi) emblaApi.scrollNext()
}, [emblaApi])
return (
<section className="py-12 px-4 md:px-6 lg:px-8">
<div className="max-w-7xl mx-auto">
<h2 className="text-3xl font-bold text-center mb-2">Our Featured Products</h2>
<p className="text-xl text-center text-gray-600 mb-8">Discover our handpicked selection of top-quality items</p>
<div className="relative">
<div className="overflow-hidden" ref={emblaRef}>
<div className="flex">
{products.map((product) => (
<div
key={product.id}
className="flex-[0_0_100%] min-w-0 sm:flex-[0_0_50%] md:flex-[0_0_33.33%] lg:flex-[0_0_25%] pl-4"
>
<CardNormal {...product} />
</div>
))}
</div>
</div>
<button
variant="outline"
size="icon"
className="absolute top-1/2 left-4 transform -translate-y-1/2"
onClick={scrollPrev}
>
<ChevronLeft className="h-4 w-4" />
</button>
<button
variant="outline"
size="icon"
className="absolute top-1/2 right-4 transform -translate-y-1/2"
onClick={scrollNext}
>
<ChevronRight className="h-4 w-4" />
</button>
</div>
</div>
</section>
)
}

59
src/components/NavBar/index.jsx
View File

@ -24,20 +24,26 @@ const Navbar = ({ theme }) => {
},
{
id: 2,
name: "Categories",
href: "/categories",
children: [{ name: "Category1", href: "/categories/category1" }, { name: "Category2", href: "/categories/category2" }, { name: "Category3", href: "/categories/category3" }],
name: "FMCG - (Comming Soon!)",
href: "/",
children: [],
},
{
id: 3,
name: "Brands",
href: "/brands",
children: [{ name: "brand1", href: "/categories/brand1" }, { name: "brand2", href: "/categories/brand2" }, { name: "brand3", href: "/categories/brand3" }],
name: "Constructions - (Comming Soon!)",
href: "/",
children: [],
},
{
id: 4,
name: "About Us",
href: "about-us",
name: "Feed - (Comming Soon!)",
href: "/",
children: [],
},
{
id: 4,
name: "About Us - (Comming Soon!)",
href: "/",
children: [],
},
];
@ -102,23 +108,7 @@ const Navbar = ({ theme }) => {
>
<div className="w-full rtl p-4 mr-2">
<div className="flex">
<div className="mr-2 w-fit px-3 p-2 text-sm bg-white flex rounded-xl ">
<p className="mb-0">Export </p>
</div>
<div className="mr-2 w-fit px-3 p-2 text-sm bg-white flex rounded-xl ">
<p className="mb-0">Industrial </p>
</div>
<div className="mr-2 w-fit px-3 p-2 text-sm bg-white flex rounded-xl ">
<p className="mb-0">en</p>
</div>
</div>
</div>
<div className="w-full flex ltr ">
<div className="size-[50px] relative bg-white rounded-lg p-2 flex flex-col items-center rounded-tl-2xl justify-center my-auto">
<div className="size-[50px] relative bg-white rounded-lg flex flex-col items-center rounded-tl-2xl justify-center my-auto">
<Image
src={logo}
fill
@ -127,6 +117,23 @@ const Navbar = ({ theme }) => {
/>
</div>
{/* <div className="mr-2 w-fit px-3 p-2 text-sm bg-white flex rounded-xl ">
<p className="mb-0">&nbsp; </p>
</div> */}
{/* <div className="mr-2 w-fit px-3 p-2 text-sm bg-white flex rounded-xl ">
<p className="mb-0">Industrial </p>
</div>
<div className="mr-2 w-fit px-3 p-2 text-sm bg-white flex rounded-xl ">
<p className="mb-0">en</p>
</div> */}
</div>
</div>
<div className="w-full flex ltr ">
{NavBarData.map((e, index) => (
<>
@ -148,7 +155,7 @@ const Navbar = ({ theme }) => {
>
<Link
href={`${e.href}`}
className={` ${isScrolled ? "text-black" : "text-white"} ${theme == 1 ? "text-sm !text-black" : " "
className={` whitespace-nowrap ${isScrolled ? "text-black" : "text-white"} ${theme == 1 ? "text-sm !text-black" : " "
}`}
>
{e.name}

42
src/view/Landing/components/AboutUs.jsx
View File

@ -1,40 +1,42 @@
import Image from "next/image";
import React from "react";
import logo from "../../../assets/images/logo.png";
const AboutUs = () => {
return (
<div className=" min-h-[calc(100vh-108px)] flex flex-col items-center justify-center">
<div className=" min-h-[calc(100vh-108px)] flex flex-col items-center justify-center relative">
<svg width="100%" height="100%" xmlns="http://www.w3.org/2000/svg" className="absolute left-0 top-0 bottom-0 -z-10 right-0">
<pattern id="diagonalLines" width="10" height="10" patternTransform="rotate(45)" patternUnits="userSpaceOnUse">
<line x1="0" y1="0" x2="0" y2="10" stroke="#e2e8f0" stroke-width="1" />
</pattern>
<rect width="100%" height="100%" fill="url(#diagonalLines)" />
</svg>
<div className="xs:px-3 md:px-10 md:container md:mx-auto ">
<div className="grid xs:grid-cols-1 lg:grid-cols-3 gap-5 rtl ">
<div className="grid xs:grid-cols-1 lg:grid-cols-3 gap-5 rtl items-center ">
<div className="mx-auto">
<Image src={logo} className="xs:w-[200px] lg:w-auto" />
<Image src={"/images/logo-en.png?v=1"} width={350} height={350} className="xs:w-[200px] lg:w-auto" />
</div>
<div className="text-left relative mb-10 col-span-2">
<h2 className="text-4xl font-bold relative z-10 xs:text-center lg:text-left">
ADVANCED HORIZON SERVICES LLC Products{" "}
</h2>
<p className="mb-0 text-sm text-gray-400 xs:text-center lg:text-left">
Lorem ipsum dolor sit amet
</p>
<p className="mb-0 text-base mt-5 text-center lg:text-left">
Lorem ipsum dolor sit amet consectetur, adipisicing elit.
Voluptates quas, exercitationem expedita libero hic necessitatibus
et sed aliquam consequatur repellendus dolore, molestiae earum
culpa fuga nobis odit, eligendi eius dolorem!
<p className="mb-0 text-base mt-5 text-center lg:text-left ltr leading-7">
<span className="text-primary-800 font-semibold text-lg">
Your Trusted Partner in Wholesale Supply Chain Solutions
</span>
<br />
<br />
Lorem ipsum dolor sit amet consectetur, adipisicing elit.
Voluptates quas, exercitationem expedita libero hic necessitatibus
et sed aliquam consequatur repellendus dolore, molestiae earum
culpa fuga nobis odit, eligendi eius dolorem! Lorem ipsum dolor
sit amet consectetur, adipisicing elit. Voluptates quas,
exercitationem expedita libero hic necessitatibus et sed aliquam
consequatur repellendus dolore, molestiae earum culpa fuga nobis
odit, eligendi eius dolorem!
</p>
Advanced Horizon Services is a leading trade company specializing in wholesale supply chain solutions for a diverse range of products, including high-quality detergents and food items. With years of experience and extensive relations in the industry, we pride ourselves on our commitment to excellence, reliability, and customer satisfaction.
<br />
<br />
At AHS, we understand the complexities of the supply chain and strive to simplify the process for our partners. Our extensive network of suppliers and manufacturers allows us to source top-notch products at competitive prices, ensuring that you receive the best value for your investment.
</p>
{/*
<div className="flex gap-2 mx-auto mt-5 w-full justify-center lg:justify-end">
<button className="btn btn-primary text-base py-3 px-10 ">
{" "}
@ -44,7 +46,7 @@ const AboutUs = () => {
{" "}
Industrial
</button>
</div>
</div> */}
</div>
</div>
</div>

35
src/view/Landing/components/Footer.jsx
View File

@ -2,6 +2,9 @@ import Image from "next/image";
import Link from "next/link";
import React from "react";
import logo from "../../../assets/images/logo.png";
import { MapPinHouse } from "lucide-react";
import { Mail } from "lucide-react";
import { PhoneCall } from "lucide-react";
const Footer = () => {
return (
@ -23,16 +26,42 @@ const Footer = () => {
</div>
</div>
</div>
<div className="flex justify-center">
<div className="flex flex-col gap-4 items-center text-sm text-gray-200 justify-center pb-20">
<div className="flex gap-2">
<MapPinHouse size={20} />
<p>
Unit No. 53, Building No 203, Complex No.308 , Mawaleh North ,Road No. 108 Al Mouj Street , Muscat
Uman.F.o.0ox.our.F.C.ll Muscat Airport
</p>
</div>
<Link href={"mailto:info@adhorizonintl.com"} target="_blank" className="flex gap-2">
<Mail size={20} />
<p>
info@adhorizonintl.com
</p>
</Link>
<Link href={"tel:+96824289888"} target="_blank" className="flex gap-2">
<PhoneCall size={20} />
<p>
+968 24 28 98 88
</p>
</Link>
</div>
<div className="flex justify-center pb-20 ">
<div>
<div className="w-full mb-5">
<Image src={logo} className="w-[90px] mx-auto" />
</div>
<p className="mb-0 text-sm text-gray-200 w-full text-center opacity-30 pb-20 ">
<p className="mb-0 text-sm text-gray-200 w-full text-center opacity-30 ">
© 2025. All rights reserved. <br />
am - Om
</p>
{/* <div className="flex justify-center w-full my-5 ">
<Link href={`/products`}>
<p className="mb-0 text-gray-400 mx-4 text-sm">products</p>

6
src/view/Landing/components/Products.jsx
View File

@ -210,7 +210,7 @@ const Products = () => {
ADVANCED HORIZON SERVICES LLC Products{" "}
</h2>
<p className="mb-0 text-sm text-gray-400 xs:text-center lg:text-left">
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Corporis,{" "}
</p>
</div>
@ -222,14 +222,14 @@ const Products = () => {
))}
</div>
<div className="flex justify-center">
{/* <div className="flex justify-center">
<Link href={"categories/Product-20Listing-Page"}>
<button className="btn btn-primary px-10 text-sm ">
{" "}
See All Products
</button>
</Link>
</div>
</div> */}
</div>
</div>
);

49
src/view/Landing/components/Sides.jsx 100644
View File

@ -0,0 +1,49 @@
import React from 'react';
import { ShoppingCart, Building2 } from 'lucide-react'; // Assuming you're using lucide-react for icons
const Sides = () => {
return (
<section className="w-full py-12 md:py-24 lg:py-32 bg-background text-sm bg-primary-800/40 ">
<div className="container px-4 md:px-6 mx-auto">
<h2 className="text-3xl font-bold tracking-tighter sm:text-4xl md:text-5xl text-center mb-12">
Discover Our Expertise
</h2>
<div className="grid gap-6 lg:grid-cols-2">
{/* First Card */}
<div className="flex flex-col items-center text-center bg-white shadow-lg rounded-lg p-6">
<div className="flex flex-col items-center">
<ShoppingCart className="w-12 h-12 mb-4 text-primary" />
<h3 className="text-2xl font-bold">FMCG</h3>
<p className="text-muted-foreground">Fast-Moving Consumer Goods</p>
</div>
<div className="mt-4">
<p className="text-muted-foreground text-base">
Our FMCG division specializes in the distribution and marketing of everyday consumer products. We ensure
rapid turnover, efficient supply chains, and innovative marketing strategies to meet the ever-changing
demands of consumers.
</p>
</div>
</div>
{/* Second Card */}
<div className="flex flex-col items-center text-center bg-white shadow-lg rounded-lg p-6">
<div className="flex flex-col items-center">
<Building2 className="w-12 h-12 mb-4 text-primary" />
<h3 className="text-2xl font-bold">Construction</h3>
<p className="text-muted-foreground">Building the Future</p>
</div>
<div className="mt-4">
<p className="text-muted-foreground text-base">
Our Construction arm is dedicated to creating lasting infrastructure and innovative building solutions.
From residential projects to commercial complexes, we bring expertise, quality, and sustainability to
every construction endeavor.
</p>
</div>
</div>
</div>
</div>
</section>
);
};
export default Sides;

0
src/view/Landing/components/ui/card.jsx 100644
View File

16
src/view/Landing/index.jsx
View File

@ -1,11 +1,8 @@
import React from "react";
import HeroSection from "./components/HeroSection";
import AboutUs from "./components/AboutUs";
import CounterDetail from "./components/CounterDetail";
import Products from "./components/Products";
import Footer from "./components/Footer";
import Navbar from "src/components/NavBar";
import WhyHorizon from "./components/Why";
import AboutUs from "./components/AboutUs";
import Footer from "./components/Footer";
import Products from "./components/Products";
import Sides from "./components/Sides";
const Landing = () => {
return (
@ -14,9 +11,10 @@ const Landing = () => {
<Navbar theme={1} />
{/* <HeroSection /> */}
<AboutUs />
<CounterDetail />
<Sides/>
{/* <CounterDetail /> */}
<Products />
<WhyHorizon/>
{/* <WhyHorizon/> */}
<Footer />
</div>
);