Browse Source

Update PageHome3 component

* Add a glassmorphism effect
* Add a SectionHero3 component
* Add a SectionGridCategoryBox component
* Add a SectionGridAuthorBox component with a boxCard prop
* Add a SectionGridFeaturePlaces component
* Add a SectionSubscribe2 component
main
John Doe 1 year ago
parent
commit
7120d6d436
  1. 104
      src/app/(home)/home-3/page.tsx

104
src/app/(home)/home-3/page.tsx

@ -0,0 +1,104 @@
import React from "react";
import SectionSubscribe2 from "@/components/SectionSubscribe2";
import BackgroundSection from "@/components/BackgroundSection";
import BgGlassmorphism from "@/components/BgGlassmorphism";
import { TaxonomyType } from "@/data/types";
import SectionGridAuthorBox from "@/components/SectionGridAuthorBox";
import SectionGridCategoryBox from "@/components/SectionGridCategoryBox";
import SectionHero3 from "@/app/(server-components)/SectionHero3";
import CardCategory6 from "@/components/CardCategory6";
import SectionGridFeaturePlaces from "@/components/SectionGridFeaturePlaces";
const DEMO_CATS_2: TaxonomyType[] = [
{
id: "1",
href: "/listing-stay",
name: "Enjoy the great cold",
taxonomy: "category",
count: 188288,
thumbnail:
"https://images.pexels.com/photos/5764100/pexels-photo-5764100.jpeg?auto=compress&cs=tinysrgb&dpr=3&h=750&w=1260",
},
{
id: "222",
href: "/listing-stay",
name: "Sleep in a floating way",
taxonomy: "category",
count: 188288,
thumbnail:
"https://images.pexels.com/photos/2869499/pexels-photo-2869499.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=750&w=1260",
},
{
id: "3",
href: "/listing-stay",
name: "In the billionaire's house",
taxonomy: "category",
count: 188288,
thumbnail:
"https://images.pexels.com/photos/7031413/pexels-photo-7031413.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=750&w=1260",
},
{
id: "4",
href: "/listing-stay",
name: "Cool in the deep forest",
taxonomy: "category",
count: 188288,
thumbnail:
"https://images.pexels.com/photos/247532/pexels-photo-247532.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=750&w=1260",
},
{
id: "5",
href: "/listing-stay",
name: "In the billionaire's house",
taxonomy: "category",
count: 188288,
thumbnail:
"https://images.pexels.com/photos/7031413/pexels-photo-7031413.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=750&w=1260",
},
];
function PageHome3() {
return (
<main className="nc-PageHome3 relative overflow-hidden">
{/* GLASSMOPHIN */}
<BgGlassmorphism />
{/* SECTION HERO */}
<div className="container px-1 sm:px-4 mb-24 ">
<SectionHero3 className="" />
</div>
<div className="container relative space-y-24 mb-24 ">
{/* SECTION 1 */}
<div className="grid grid-cols-12 gap-6">
<div className="col-span-12 sm:col-span-6 lg:col-span-4 flex">
<CardCategory6 taxonomy={DEMO_CATS_2[0]} />
</div>
<div className="col-span-12 sm:col-span-6 lg:col-span-4 grid grid-rows-2 gap-6">
<CardCategory6 taxonomy={DEMO_CATS_2[3]} />
<CardCategory6 taxonomy={DEMO_CATS_2[1]} />
</div>
<div className="col-span-12 sm:col-span-6 lg:col-span-4 flex">
<CardCategory6 taxonomy={DEMO_CATS_2[4]} />
</div>
</div>
{/* SECTION */}
<SectionGridCategoryBox />
{/* SECTION */}
<div className="relative py-16">
<BackgroundSection />
<SectionGridAuthorBox boxCard="box2" />
</div>
<SectionGridFeaturePlaces />
{/* SECTION */}
<SectionSubscribe2 />
</div>
</main>
);
}
export default PageHome3;
Loading…
Cancel
Save