Compare commits
26 Commits
ee559da25c
...
ba1b67fd77
| Author | SHA1 | Date | |
|---|---|---|---|
| ba1b67fd77 | |||
|
faa28ce093 | ||
| 148344a4bb | |||
|
|
52c86805e2 | ||
|
|
46d3a8fe81 | ||
|
|
9b60339d3e | ||
|
|
57cfe31ca5 | ||
| 34aaf1ca63 | |||
| 239ec2b872 | |||
| 34e35edab0 | |||
|
|
2a15b0fb13 | ||
|
|
36de60897d | ||
| d1936a54d7 | |||
| c796939760 | |||
|
|
d047b66775 | ||
|
|
366cedd3b4 | ||
|
|
1ec65fef0d | ||
|
|
a5df77325a | ||
| 69117457f6 | |||
| 8b01b99156 | |||
|
|
65c01300f5 | ||
| 9cd5730810 | |||
|
|
9ef1156276 | ||
| 873ed28301 | |||
|
|
785545c7e1 | ||
|
|
d20f605996 |
@ -1,125 +1,10 @@
|
||||
'use client';
|
||||
import axios from 'axios';
|
||||
import Layout from "@/components/layout/Layout";
|
||||
import Link from "next/link";
|
||||
import { useState, useEffect } from 'react';
|
||||
|
||||
export default function Memories() {
|
||||
const [selectedYear, setSelectedYear] = useState('');
|
||||
const [events, setEvents] = useState([]);
|
||||
const [years, setYears] = useState([]);
|
||||
|
||||
useEffect(() => {
|
||||
getEvents();
|
||||
}, []);
|
||||
|
||||
const getEvents = async () => {
|
||||
try {
|
||||
const eventRes = await axios.get(
|
||||
'https://api.tamilculturewaterloo.org/api/events/'
|
||||
);
|
||||
|
||||
const eventsData = eventRes?.data?.data || [];
|
||||
setEvents(eventsData);
|
||||
|
||||
// Extract unique years & sort (latest first)
|
||||
const uniqueYears = [...new Set(eventsData.map(event => event.year))].sort((a, b) => b - a);
|
||||
setYears(uniqueYears);
|
||||
|
||||
// Default to latest year immediately
|
||||
if (uniqueYears.length > 0) {
|
||||
setSelectedYear(uniqueYears[0]);
|
||||
}
|
||||
} catch (error) {
|
||||
console.log("error fetching data", error);
|
||||
}
|
||||
export const metadata = {
|
||||
title: "Community Photo Gallery | View Our Memories",
|
||||
description: "Browse photos from Tamil cultural events and community programs in Waterloo Region.",
|
||||
};
|
||||
|
||||
// Filter events by selected year
|
||||
const filteredEvents = events.filter(event => event.year === selectedYear);
|
||||
import PhotoGallerySection from "@/components/events/PhotoGallerySection";
|
||||
|
||||
return (
|
||||
<Layout headerStyle={1} footerStyle={1}>
|
||||
<div>
|
||||
{/* Header Section */}
|
||||
<div
|
||||
className="inner-page-header"
|
||||
style={{ backgroundImage: 'url(/assets/img/event/gallery/gallery-banner.webp)' }}
|
||||
>
|
||||
<div className="container">
|
||||
<div className="row">
|
||||
<div className="col-lg-12 m-auto">
|
||||
<div className="heading1">
|
||||
<h1>Recent Memories</h1>
|
||||
<div className="space20" />
|
||||
<Link href="/">
|
||||
Home <i className="fa-solid fa-angle-right" /> <span>Recent Memories</span>
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Memory Section */}
|
||||
<div className="memory-inner-section-area blog-details-section sp4">
|
||||
<div className="container">
|
||||
<div className="row gx-5">
|
||||
{/* Left Column: Year Tabs */}
|
||||
<div className="col-lg-3 mb-4 mb-lg-0">
|
||||
<div className="blog-auhtor-details sticky-top" style={{ top: "120px" }}>
|
||||
<div className="blog-categories">
|
||||
<ul className="list-unstyled">
|
||||
{years.map((year) => (
|
||||
<li key={year}>
|
||||
<button
|
||||
onClick={() => setSelectedYear(year)}
|
||||
className={`btn w-100 mb-2 category-btn ${selectedYear === year ? 'active' : ''}`}
|
||||
>
|
||||
Year {year}
|
||||
</button>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Right Column: Gallery */}
|
||||
<div className="col-lg-9">
|
||||
<div className="row justify-content-start">
|
||||
{filteredEvents.map((event, idx) => (
|
||||
<div className="col-lg-4 col-md-6 mb-4" key={idx}>
|
||||
<div className="memory3-boxarea">
|
||||
<div className="img1">
|
||||
<img src={event.eventimageurl} alt={event.eventtitle} />
|
||||
</div>
|
||||
<div className="content-area">
|
||||
<p>{event.eventdate}</p>
|
||||
<div className="space12" />
|
||||
<Link href={`/photo-gallery/single-gallery?id=${event.id}`}>
|
||||
{event.eventtitle}
|
||||
</Link>
|
||||
<div className="plus">
|
||||
<Link href={`/photo-gallery/single-gallery?id=${event.id}`}>
|
||||
<i className="fa-solid fa-plus" />
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
{filteredEvents.length === 0 && (
|
||||
<div className="col-12 text-center">
|
||||
<p>No events found for {selectedYear}</p>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</Layout>
|
||||
);
|
||||
export default function Memories() {
|
||||
return <PhotoGallerySection />;
|
||||
}
|
||||
|
||||
@ -4,7 +4,7 @@ import Layout from '@/components/layout/Layout';
|
||||
import axios from 'axios';
|
||||
import Link from 'next/link';
|
||||
import { useSearchParams, useRouter } from 'next/navigation';
|
||||
import { useEffect, useState } from 'react';
|
||||
import { useEffect, useState, useCallback } from 'react';
|
||||
import Lightbox from "yet-another-react-lightbox";
|
||||
import "yet-another-react-lightbox/styles.css";
|
||||
|
||||
@ -24,13 +24,7 @@ export default function SingleGallery() {
|
||||
const [open, setOpen] = useState(false);
|
||||
const [currentIndex, setCurrentIndex] = useState(0);
|
||||
|
||||
useEffect(() => {
|
||||
if (eventId) {
|
||||
getEventGallery();
|
||||
}
|
||||
}, [eventId]);
|
||||
|
||||
const getEventGallery = async () => {
|
||||
const getEventGallery = useCallback(async () => {
|
||||
try {
|
||||
const res = await axios.get(
|
||||
`https://api.tamilculturewaterloo.org/api/event-images/event/${eventId}`
|
||||
@ -45,7 +39,13 @@ export default function SingleGallery() {
|
||||
} catch (error) {
|
||||
console.log("Error fetching event images", error);
|
||||
}
|
||||
};
|
||||
}, [eventId]);
|
||||
|
||||
useEffect(() => {
|
||||
if (eventId) {
|
||||
getEventGallery();
|
||||
}
|
||||
}, [eventId, getEventGallery]);
|
||||
|
||||
const handleImageClick = (index: number) => {
|
||||
setCurrentIndex(index);
|
||||
|
||||
31
app/(event)/upcoming-event/[slug]/page.jsx
Normal file
31
app/(event)/upcoming-event/[slug]/page.jsx
Normal file
@ -0,0 +1,31 @@
|
||||
import UpcomingEventSinglePage from "@/components/events/UpcomingEventSinglePage";
|
||||
import { events } from "@/utility/constant.utils";
|
||||
|
||||
const getEvent = (slug) => events.find((event) => event.slug === slug);
|
||||
|
||||
export function generateStaticParams() {
|
||||
return events
|
||||
.filter((event) => event.slug)
|
||||
.map((event) => ({
|
||||
slug: event.slug,
|
||||
}));
|
||||
}
|
||||
|
||||
export async function generateMetadata({ params }) {
|
||||
const event = getEvent(params.slug);
|
||||
|
||||
if (!event) {
|
||||
return {
|
||||
title: "Upcoming Event | Tamil Culture Waterloo",
|
||||
};
|
||||
}
|
||||
|
||||
return {
|
||||
title: `${event.title} | Tamil Culture Waterloo`,
|
||||
description: event.desc || `Details for ${event.title}.`,
|
||||
};
|
||||
}
|
||||
|
||||
export default function Page({ params }) {
|
||||
return <UpcomingEventSinglePage slug={params.slug} />;
|
||||
}
|
||||
@ -1,9 +1,10 @@
|
||||
'use client';
|
||||
import Countdown from '@/components/elements/Countdown';
|
||||
export const metadata = {
|
||||
title: "Upcoming Community Events | Join Us",
|
||||
description: "Stay updated on upcoming Tamil cultural events and community gatherings in Waterloo, Ontario.",
|
||||
};
|
||||
|
||||
import Layout from "@/components/layout/Layout";
|
||||
import { memoryData } from '@/utility/constant.utils';
|
||||
import Link from "next/link";
|
||||
import { useState } from 'react';
|
||||
import UpcomingEventData from '../../../components/events/UpcomingEventData';
|
||||
|
||||
export default function Memories() {
|
||||
|
||||
238
app/(event)/upcoming-event/tamil-cultural-nite-2025/page.jsx
Normal file
238
app/(event)/upcoming-event/tamil-cultural-nite-2025/page.jsx
Normal file
@ -0,0 +1,238 @@
|
||||
export const metadata = {
|
||||
title: "Tamil Cultural Nite 2025 | Book & Participate",
|
||||
description: "Join Tamil Cultural Nite 2025 in Waterloo for performances, music, and community celebration.",
|
||||
};
|
||||
|
||||
import Layout from "@/components/layout/Layout"
|
||||
import PageLoader from "@/components/common-component/PageLoader";
|
||||
import Link from "next/link"
|
||||
import { Suspense } from "react";
|
||||
|
||||
const Page = () => {
|
||||
return (
|
||||
<>
|
||||
<div>
|
||||
<div
|
||||
className="inner-page-header"
|
||||
style={{
|
||||
backgroundImage: `url('/assets/img/nite/tami-cultural-banner.webp')`,
|
||||
backgroundSize: "cover",
|
||||
backgroundPosition: "center",
|
||||
}}
|
||||
>
|
||||
<div className="container">
|
||||
<div className="row">
|
||||
<div className="col-lg-12 m-auto">
|
||||
<div className="heading1">
|
||||
<h1>Tamil Cultural Nite 2025</h1>
|
||||
<div className="space20" />
|
||||
<Link href="/">
|
||||
Home <i className="fa-solid fa-angle-right" />{" "}
|
||||
<span>Tamil Cultural Nite 2025</span>
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/*===== RECIPE DETAILS START =====*/}
|
||||
<div className="blog-details-section sp4 pb-4 mb-4">
|
||||
<div className="container">
|
||||
<div className="row">
|
||||
<div className="col-lg-12">
|
||||
<div className="blog-deatils-content heading2">
|
||||
|
||||
{/* Banner / Poster Image */}
|
||||
<div className="img1">
|
||||
<img
|
||||
src="/assets/img/nite/1526.webp"
|
||||
alt="Tamil Cultural Nite 2025 Banner"
|
||||
className="img-fluid rounded"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="space32" />
|
||||
<div className="about2-header heading4 text-center">
|
||||
<div>
|
||||
<span className="texture">20th Annual</span>
|
||||
</div>
|
||||
<h2 className="text-anime-style-3">Tamil Cultural Nite 2025</h2>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div className="about6-section-area sp4 pt-0">
|
||||
<div className="container">
|
||||
|
||||
<div className="row">
|
||||
|
||||
<div className="col-lg-6 order-2 order-lg-1">
|
||||
<div className="img">
|
||||
<img src="/assets/img/nite/tamil-cultural-night-1.webp" alt="" />
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</div >
|
||||
<div className="col-lg-6 order-1 order-lg-2 mb-5">
|
||||
|
||||
<div className="about2-header heading4 ">
|
||||
|
||||
<h3 className="text-anime-style-3">Tamil Cultural Association of Waterloo Region proudly presents</h3>
|
||||
|
||||
<div className="space16" />
|
||||
|
||||
<div className="about6-header heading9 mb-3">
|
||||
{/* <span className="texture">20th Annual</span> */}
|
||||
<p className="textured">Tamil Cultural Nite Performing Arts festival</p>
|
||||
<div className="space18" />
|
||||
</div>
|
||||
<div className="about6-header heading9 space-margin60 mb-4">
|
||||
<ul>
|
||||
<li>Date: Saturday, October 25, 2025</li>
|
||||
</ul>
|
||||
<div className="space18" />
|
||||
<ul>
|
||||
<li>Time: 6:00 pm to 10:00 p.m</li>
|
||||
</ul>
|
||||
<div className="space18" />
|
||||
<ul>
|
||||
<li>Venue: Humanities Theater, University of Waterloo
|
||||
200 University Avenue, Waterloo, ON.</li>
|
||||
</ul>
|
||||
<div className="space18" />
|
||||
<ul>
|
||||
<li>Tickets: $20, 15, 10</li>
|
||||
</ul>
|
||||
<div className="space18" />
|
||||
</div>
|
||||
<div className="btn-area1">
|
||||
<Link
|
||||
href="https://secure1.tixhub.com/waterloo/online/b_otix.asp?cboPerformances=877&cboEvent=422&width=1903"
|
||||
legacyBehavior
|
||||
>
|
||||
<a className="vl-btn2" target="_blank" rel="noopener noreferrer">
|
||||
<span className="demo">
|
||||
Book Now <i className="fa-solid fa-arrow-right" />
|
||||
</span>
|
||||
</a>
|
||||
</Link>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="pricing-lan-section-area sp4 pt-0">
|
||||
<div className="container">
|
||||
<div className="about6-section-area">
|
||||
<div className="container">
|
||||
<div className="row align-items-center">
|
||||
|
||||
<div className="col-lg-6 order-1 order-lg-2 mb-5">
|
||||
<div className="row">
|
||||
<div className="col-lg-12 m-auto">
|
||||
<div className="heading2 mb-4">
|
||||
<h3 >
|
||||
Humanities Theater Box office information:
|
||||
</h3>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="mission">
|
||||
{/* <div className="space16" /> */}
|
||||
<ul className="list-unstyled">
|
||||
<li className="d-flex mb-3">
|
||||
<img src="/assets/img/icons/check2.svg" alt="" className="me-2" />
|
||||
<span>
|
||||
Tickets can be purchased online, by phone (519-888-4908), or in person. There is an online convenience fee of $2.26/per ticket or a phone convenience fee of $1.13 per ticket (on top of the final price).
|
||||
</span>
|
||||
</li>
|
||||
<li className="d-flex mb-3">
|
||||
<img src="/assets/img/icons/check2.svg" alt="" className="me-2" />
|
||||
<span>
|
||||
The Box Office accepts Visa, MasterCard, American Express, Visa Debit, MasterCard Debit, and cash. The same methods of payment are accepted online except for cash.
|
||||
</span>
|
||||
</li>
|
||||
<li className="d-flex mb-3">
|
||||
<img src="/assets/img/icons/check2.svg" alt="" className="me-2" />
|
||||
<span>
|
||||
Babes in arms 18 months and under do not require a ticket. No strollers or infant car seat carriers allowed in the theatre. They can be stored in coat check room if needed.
|
||||
</span>
|
||||
</li>
|
||||
<li className="d-flex mb-3">
|
||||
<img src="/assets/img/icons/check2.svg" alt="" className="me-2" />
|
||||
<span>
|
||||
Box office is open Monday to Friday from 1pm until 5 pm.
|
||||
</span>
|
||||
</li>
|
||||
<li className="d-flex mb-3">
|
||||
<img src="/assets/img/icons/check2.svg" alt="" className="me-2" />
|
||||
<span>
|
||||
For accessible seating please contact the box office.
|
||||
</span>
|
||||
</li>
|
||||
</ul>
|
||||
{/* <div className="about6-header heading9 space-margin60 mb-4">
|
||||
<p className="texture">More info: </p>
|
||||
<ul>
|
||||
<li> Shyamala Ram: 519-897-6975</li>
|
||||
</ul>
|
||||
<div className="space16" />
|
||||
<ul>
|
||||
<li>Shanthi Durai: 519-589-9641
|
||||
</li>
|
||||
</ul>
|
||||
<div className="space18" />
|
||||
|
||||
</div> */}
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-6 order-2 order-lg-2">
|
||||
<div className="img">
|
||||
<img src="/assets/img/nite/tamil-cultural-night-2.webp" alt="" />
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div className="col-lg-12 text-center">
|
||||
<div className="img">
|
||||
<img src="/assets/img/nite/welcome.png" alt="" />
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</div >
|
||||
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
const RecipePage = () => {
|
||||
return (
|
||||
<Layout headerStyle={1} footerStyle={1}>
|
||||
<Suspense fallback={<PageLoader />}>
|
||||
<Page />
|
||||
</Suspense>
|
||||
</Layout>
|
||||
);
|
||||
};
|
||||
|
||||
export default RecipePage;
|
||||
@ -1,3 +1,9 @@
|
||||
import type { Metadata } from "next"
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Tamil Cultural Association | Get to Know Us",
|
||||
description: "Discover our association, leadership structure, and how we support Tamil culture and unity in Waterloo, Ontario.",
|
||||
};
|
||||
|
||||
import Countdown from '@/components/elements/Countdown'
|
||||
import Layout from "@/components/layout/Layout"
|
||||
|
||||
@ -1,4 +1,10 @@
|
||||
'use client'
|
||||
import type { Metadata } from "next"
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Meet Our Committee Members | Community Leaders",
|
||||
description: "Meet the dedicated committee members leading Tamil Culture Waterloo and organizing community initiatives.",
|
||||
};
|
||||
|
||||
import Layout from "@/components/layout/Layout";
|
||||
import Section1 from "@/components/about/committee/Section1"; // adjust path if needed
|
||||
|
||||
|
||||
@ -1,3 +1,9 @@
|
||||
import type { Metadata } from "next"
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Constitution & Governance | Read Our Principles",
|
||||
description: "Read the constitution outlining governance, values, and operational principles of our Tamil cultural association.",
|
||||
};
|
||||
|
||||
import Countdown from '@/components/elements/Countdown'
|
||||
import Layout from "@/components/layout/Layout"
|
||||
|
||||
@ -1,3 +1,9 @@
|
||||
import type { Metadata } from "next"
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Our Mission & Vision | Discover Our Purpose",
|
||||
description: "Explore our mission and vision to preserve Tamil culture and strengthen community connections in Waterloo Region.",
|
||||
};
|
||||
|
||||
import Countdown from '@/components/elements/Countdown'
|
||||
import Layout from "@/components/layout/Layout"
|
||||
|
||||
@ -1,4 +1,10 @@
|
||||
'use client'
|
||||
import type { Metadata } from "next"
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "About Tamil Culture Waterloo | Learn Our Story",
|
||||
description: "Learn about Tamil Culture Waterloo, our history, values, and role in serving the Tamil community in Waterloo Region.",
|
||||
};
|
||||
|
||||
import CountUp from 'react-countup'
|
||||
import Countdown from '@/components/elements/Countdown'
|
||||
import Layout from "@/components/layout/Layout"
|
||||
|
||||
120
app/community/badminton-club/BadmintonClubClient.tsx
Normal file
120
app/community/badminton-club/BadmintonClubClient.tsx
Normal file
@ -0,0 +1,120 @@
|
||||
'use client';
|
||||
|
||||
import Layout from '@/components/layout/Layout';
|
||||
import { communitySubmenuData } from '@/utility/constant.utils';
|
||||
import Link from 'next/link';
|
||||
import { useState } from 'react';
|
||||
import Lightbox from "yet-another-react-lightbox";
|
||||
import "yet-another-react-lightbox/styles.css";
|
||||
|
||||
export default function BadmintonClubClient() {
|
||||
|
||||
const galleryImages = communitySubmenuData.filter((img: any) => +img.id >= 9 && +img.id <= 12);
|
||||
|
||||
const [open, setOpen] = useState(false);
|
||||
const [index, setIndex] = useState(0);
|
||||
|
||||
return (
|
||||
<>
|
||||
<Layout headerStyle={1} footerStyle={1}>
|
||||
|
||||
<div
|
||||
className="inner-page-header"
|
||||
style={{
|
||||
backgroundImage: 'url(/assets/img/community/badminton/badminton-club-banner.webp)',
|
||||
}}
|
||||
>
|
||||
<div className="container">
|
||||
<div className="row">
|
||||
<div className="col-lg-12 m-auto">
|
||||
<div className="heading1">
|
||||
<h1>Badminton Club</h1>
|
||||
<div className="space20" />
|
||||
<Link href="/" className="text-white text-decoration-none">
|
||||
Home <i className="fa-solid fa-angle-right mx-2" />
|
||||
<span>Badminton Club</span>
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Description Section */}
|
||||
<div className="bloginner-section-area sp4">
|
||||
<div className="container">
|
||||
<div className="row">
|
||||
<div className="col-lg-12 m-auto">
|
||||
<div className="event2-header heading5 space-margin60">
|
||||
<h2 className="text-anime-style-3">
|
||||
Badminton Club Cambridge
|
||||
</h2>
|
||||
<div className="space24" />
|
||||
<p>
|
||||
Waterloo region's Tamil Badminton Club was started in 2019. It is held on Friday at 6:30 – 9:30pm, William G Davis Public School, 530 Langs Drive, Cambridge, Ontario. Membership is open to members of Tamil Cultural Association of Waterloo Region only.
|
||||
</p>
|
||||
<div className="space24" />
|
||||
<p className='mb-2'><strong>2022/23 Badminton Membership Fee:</strong></p>
|
||||
<p>Single $106.00</p>
|
||||
<p>Family $157.00</p>
|
||||
<div className="space24" />
|
||||
<p>
|
||||
A Badminton club member has to obtain TCA membership prior to joining the club. Membership includes Court fee and Insurance. Fall/Winter season only. (Sep.23/22 To May 26/23)
|
||||
</p>
|
||||
<p>
|
||||
The school is primarily supported by Tamil Cultural Association of Waterloo Region and Waterloo District School Board.
|
||||
More info: <a href="mailto:mail@tca.srika.in">mail@tca.srika.in</a>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="row gx-4 gy-4 mt-4">
|
||||
{galleryImages.length > 0 ? (
|
||||
galleryImages.map((img: any, i: number) => (
|
||||
<div
|
||||
className="col-xl-3 col-lg-4 col-md-6 col-sm-6 col-12"
|
||||
key={img.id}
|
||||
onClick={() => {
|
||||
setIndex(i);
|
||||
setOpen(true);
|
||||
}}
|
||||
style={{ cursor: 'pointer' }}
|
||||
>
|
||||
<div className="memory-boxarea rounded overflow-hidden h-100">
|
||||
<div
|
||||
className="image"
|
||||
data-aos="zoom-in"
|
||||
data-aos-duration={1000}
|
||||
style={{ borderRadius: 8 }}
|
||||
>
|
||||
<img
|
||||
src={img.src}
|
||||
alt={img.alt}
|
||||
className="img-fluid w-100"
|
||||
style={{ objectFit: 'cover', height: '100%', borderRadius: 8 }}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
))
|
||||
) : (
|
||||
<div className="col-12 text-center mt-5">
|
||||
<p className="text-muted">No images found for this event.</p>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Lightbox Viewer */}
|
||||
<Lightbox
|
||||
open={open}
|
||||
close={() => setOpen(false)}
|
||||
slides={galleryImages}
|
||||
index={index}
|
||||
/>
|
||||
</Layout>
|
||||
</>
|
||||
);
|
||||
}
|
||||
@ -1,123 +1,12 @@
|
||||
'use client';
|
||||
import type { Metadata } from "next"
|
||||
|
||||
import Layout from '@/components/layout/Layout';
|
||||
import { communitySubmenuData } from '@/utility/constant.utils';
|
||||
import Link from 'next/link';
|
||||
import { useState } from 'react';
|
||||
import Lightbox from "yet-another-react-lightbox";
|
||||
import "yet-another-react-lightbox/styles.css";
|
||||
export const metadata: Metadata = {
|
||||
title: "Tamil Badminton Club | Play With Us",
|
||||
description: "Play, train, and compete with the Tamil Badminton Club in Waterloo Region.",
|
||||
};
|
||||
|
||||
export default function CricketClub() {
|
||||
import BadmintonClubClient from "./BadmintonClubClient";
|
||||
|
||||
const galleryImages = communitySubmenuData.filter(img => +img.id >= 9 && +img.id <= 12);
|
||||
|
||||
const [open, setOpen] = useState(false);
|
||||
const [index, setIndex] = useState(0);
|
||||
|
||||
return (
|
||||
<>
|
||||
<Layout headerStyle={1} footerStyle={1}>
|
||||
|
||||
<div
|
||||
className="inner-page-header"
|
||||
style={{
|
||||
backgroundImage: 'url(/assets/img/community/badminton/badminton-club-banner.webp)',
|
||||
backgroundSize: 'cover',
|
||||
backgroundPosition: 'center',
|
||||
padding: '100px 0',
|
||||
}}
|
||||
>
|
||||
<div className="container">
|
||||
<div className="row">
|
||||
<div className="col-lg-12 m-auto">
|
||||
<div className="heading1">
|
||||
<h1>Badminton Club</h1>
|
||||
<div className="space20" />
|
||||
<Link href="/" className="text-white text-decoration-none">
|
||||
Home <i className="fa-solid fa-angle-right mx-2" />
|
||||
<span>Badminton Club</span>
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Description Section */}
|
||||
<div className="bloginner-section-area sp4">
|
||||
<div className="container">
|
||||
<div className="row">
|
||||
<div className="col-lg-12 m-auto">
|
||||
<div className="event2-header heading5 space-margin60">
|
||||
<h2 className="text-anime-style-3">
|
||||
Badminton Club Cambridge
|
||||
</h2>
|
||||
<div className="space24" />
|
||||
<p>
|
||||
Waterloo region’s Tamil Badminton Club was started in 2019. It is held on Friday at 6:30 – 9:30pm, William G Davis Public School, 530 Langs Drive, Cambridge, Ontario. Membership is open to members of Tamil Cultural Association of Waterloo Region only.
|
||||
</p>
|
||||
<div className="space24" />
|
||||
<p className='mb-2'><strong>2022/23 Badminton Membership Fee:</strong></p>
|
||||
<p>Single $106.00</p>
|
||||
<p>Family $157.00</p>
|
||||
<div className="space24" />
|
||||
<p>
|
||||
A Badminton club member has to obtain TCA membership prior to joining the club. Membership includes Court fee and Insurance. Fall/Winter season only. (Sep.23/22 To May 26/23)
|
||||
</p>
|
||||
<p>
|
||||
The school is primarily supported by Tamil Cultural Association of Waterloo Region and Waterloo District School Board.
|
||||
More info: <a href="mailto:mail@tca.srika.in">mail@tca.srika.in</a>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="row gx-4 gy-4 mt-4">
|
||||
{galleryImages.length > 0 ? (
|
||||
galleryImages.map((img, i) => (
|
||||
<div
|
||||
className="col-xl-3 col-lg-4 col-md-6 col-sm-6 col-12"
|
||||
key={img.id}
|
||||
onClick={() => {
|
||||
setIndex(i);
|
||||
setOpen(true);
|
||||
}}
|
||||
style={{ cursor: 'pointer' }}
|
||||
>
|
||||
<div className="memory-boxarea rounded overflow-hidden h-100">
|
||||
<div
|
||||
className="image"
|
||||
data-aos="zoom-in"
|
||||
data-aos-duration={1000}
|
||||
style={{ borderRadius: 8 }}
|
||||
>
|
||||
<img
|
||||
src={img.src}
|
||||
alt={img.alt}
|
||||
className="img-fluid w-100"
|
||||
style={{ objectFit: 'cover', height: '100%', borderRadius: 8 }}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
))
|
||||
) : (
|
||||
<div className="col-12 text-center mt-5">
|
||||
<p className="text-muted">No images found for this event.</p>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Lightbox Viewer */}
|
||||
<Lightbox
|
||||
open={open}
|
||||
close={() => setOpen(false)}
|
||||
slides={galleryImages}
|
||||
index={index}
|
||||
/>
|
||||
</Layout>
|
||||
</>
|
||||
);
|
||||
export default function BadmintonClubPage() {
|
||||
return <BadmintonClubClient />;
|
||||
}
|
||||
|
||||
@ -1,3 +1,9 @@
|
||||
import type { Metadata } from "next"
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Tamil Business Directory | Support Local Businesses",
|
||||
description: "Explore Tamil-owned businesses and support local entrepreneurs in Waterloo.",
|
||||
};
|
||||
|
||||
import Countdown from '@/components/elements/Countdown'
|
||||
import Layout from "@/components/layout/Layout"
|
||||
|
||||
107
app/community/cricket-club/CricketClubClient.tsx
Normal file
107
app/community/cricket-club/CricketClubClient.tsx
Normal file
@ -0,0 +1,107 @@
|
||||
'use client';
|
||||
|
||||
import Layout from '@/components/layout/Layout';
|
||||
import { communitySubmenuData } from '@/utility/constant.utils';
|
||||
import Link from 'next/link';
|
||||
import { useState } from 'react';
|
||||
import Lightbox from 'yet-another-react-lightbox';
|
||||
import 'yet-another-react-lightbox/styles.css';
|
||||
|
||||
export default function CricketClubClient() {
|
||||
|
||||
const galleryImages = communitySubmenuData.filter((img: any) => +img.id >= 5 && +img.id <= 8);
|
||||
|
||||
const [open, setOpen] = useState(false);
|
||||
const [index, setIndex] = useState(0);
|
||||
|
||||
return (
|
||||
<>
|
||||
<Layout headerStyle={1} footerStyle={1}>
|
||||
<div
|
||||
className="inner-page-header"
|
||||
style={{
|
||||
backgroundImage: 'url(/assets/img/community/cricket-club/cricket-club-banner.webp)',
|
||||
}}
|
||||
>
|
||||
<div className="container">
|
||||
<div className="row">
|
||||
<div className="col-lg-12 m-auto">
|
||||
<div className="heading1">
|
||||
<h1 className="mb-3">Cricket Club</h1>
|
||||
<Link href="/" className="text-decoration-none">
|
||||
Home <i className="fa-solid fa-angle-right mx-2" />
|
||||
<span>Community</span>
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="bloginner-section-area sp4">
|
||||
<div className="container">
|
||||
<div className="row">
|
||||
<div className="col-lg-12 m-auto">
|
||||
<div className="event2-header heading5 space-margin60">
|
||||
<h2 className="text-anime-style-3 fw-bold">Tamil Cricket Club Waterloo</h2>
|
||||
<div className="space24" />
|
||||
<p>
|
||||
Waterloo region's Tamil Cricket Club was started in 2018. Venue: Waterloo Park,
|
||||
Waterloo, Ontario Canada. Spring/Summer season only. Membership is for Tamil Cultural
|
||||
Association of Waterloo Region only.
|
||||
<br />
|
||||
<br />
|
||||
The club is primarily supported by Tamil Cultural Association of Waterloo Region.
|
||||
More info:{' '}
|
||||
<a href="mailto:mail@tca.srika.in" className="text-primary">
|
||||
mail@tca.srika.in
|
||||
</a>
|
||||
</p>
|
||||
<div className="space24" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="row gx-4 gy-4">
|
||||
{galleryImages.length > 0 ? (
|
||||
galleryImages.map((img: any, i: number) => (
|
||||
<div
|
||||
key={img.id}
|
||||
className="col-xl-3 col-lg-4 col-md-6 col-sm-6 col-12"
|
||||
onClick={() => {
|
||||
setIndex(i);
|
||||
setOpen(true);
|
||||
}}
|
||||
style={{ cursor: 'pointer' }}
|
||||
>
|
||||
<div className="memory-boxarea rounded overflow-hidden h-100">
|
||||
<div
|
||||
className="image"
|
||||
data-aos="zoom-in"
|
||||
data-aos-duration={1000}
|
||||
style={{ borderRadius: 8 }}
|
||||
>
|
||||
<img
|
||||
src={img.src}
|
||||
alt={img.alt}
|
||||
className="img-fluid w-100"
|
||||
style={{ objectFit: 'cover', height: '100%', borderRadius: 8 }}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
))
|
||||
) : (
|
||||
<div className="col-12 text-center mt-5">
|
||||
<p className="text-muted">No images found for this event.</p>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<Lightbox open={open} close={() => setOpen(false)} slides={galleryImages} index={index} />
|
||||
</Layout>
|
||||
</>
|
||||
);
|
||||
}
|
||||
@ -1,110 +1,12 @@
|
||||
'use client';
|
||||
import type { Metadata } from "next"
|
||||
|
||||
import Layout from '@/components/layout/Layout';
|
||||
import { communitySubmenuData } from '@/utility/constant.utils';
|
||||
import Link from 'next/link';
|
||||
import { useState } from 'react';
|
||||
import Lightbox from 'yet-another-react-lightbox';
|
||||
import 'yet-another-react-lightbox/styles.css';
|
||||
export const metadata: Metadata = {
|
||||
title: "Tamil Cricket Club | Join the Team",
|
||||
description: "Join the Tamil Cricket Club and enjoy sports and teamwork in Waterloo.",
|
||||
};
|
||||
|
||||
export default function CricketClub() {
|
||||
import CricketClubClient from "./CricketClubClient";
|
||||
|
||||
const galleryImages = communitySubmenuData.filter(img => +img.id >= 5 && +img.id <= 8);
|
||||
|
||||
const [open, setOpen] = useState(false);
|
||||
const [index, setIndex] = useState(0);
|
||||
|
||||
return (
|
||||
<>
|
||||
<Layout headerStyle={1} footerStyle={1}>
|
||||
<div
|
||||
className="inner-page-header"
|
||||
style={{
|
||||
backgroundImage: 'url(/assets/img/community/cricket-club/cricket-club-banner.webp)',
|
||||
backgroundSize: 'cover',
|
||||
backgroundPosition: 'center',
|
||||
padding: '100px 0',
|
||||
}}
|
||||
>
|
||||
<div className="container">
|
||||
<div className="row">
|
||||
<div className="col-lg-12 m-auto">
|
||||
<div className="heading1">
|
||||
<h1 className="mb-3">Cricket Club</h1>
|
||||
<Link href="/" className="text-decoration-none">
|
||||
Home <i className="fa-solid fa-angle-right mx-2" />
|
||||
<span>Community</span>
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="bloginner-section-area sp4">
|
||||
<div className="container">
|
||||
<div className="row">
|
||||
<div className="col-lg-12 m-auto">
|
||||
<div className="event2-header heading5 space-margin60">
|
||||
<h2 className="text-anime-style-3 fw-bold">Tamil Cricket Club Waterloo</h2>
|
||||
<div className="space24" />
|
||||
<p>
|
||||
Waterloo region’s Tamil Cricket Club was started in 2018. Venue: Waterloo Park,
|
||||
Waterloo, Ontario Canada. Spring/Summer season only. Membership is for Tamil Cultural
|
||||
Association of Waterloo Region only.
|
||||
<br />
|
||||
<br />
|
||||
The club is primarily supported by Tamil Cultural Association of Waterloo Region.
|
||||
More info:{' '}
|
||||
<a href="mailto:mail@tca.srika.in" className="text-primary">
|
||||
mail@tca.srika.in
|
||||
</a>
|
||||
</p>
|
||||
<div className="space24" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="row gx-4 gy-4">
|
||||
{galleryImages.length > 0 ? (
|
||||
galleryImages.map((img, i) => (
|
||||
<div
|
||||
key={img.id}
|
||||
className="col-xl-3 col-lg-4 col-md-6 col-sm-6 col-12"
|
||||
onClick={() => {
|
||||
setIndex(i);
|
||||
setOpen(true);
|
||||
}}
|
||||
style={{ cursor: 'pointer' }}
|
||||
>
|
||||
<div className="memory-boxarea rounded overflow-hidden h-100">
|
||||
<div
|
||||
className="image"
|
||||
data-aos="zoom-in"
|
||||
data-aos-duration={1000}
|
||||
style={{ borderRadius: 8 }}
|
||||
>
|
||||
<img
|
||||
src={img.src}
|
||||
alt={img.alt}
|
||||
className="img-fluid w-100"
|
||||
style={{ objectFit: 'cover', height: '100%', borderRadius: 8 }}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
))
|
||||
) : (
|
||||
<div className="col-12 text-center mt-5">
|
||||
<p className="text-muted">No images found for this event.</p>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<Lightbox open={open} close={() => setOpen(false)} slides={galleryImages} index={index} />
|
||||
</Layout>
|
||||
</>
|
||||
);
|
||||
export default function CricketClubPage() {
|
||||
return <CricketClubClient />;
|
||||
}
|
||||
|
||||
150
app/community/global-relief-fund/GlobalReliefFundClient.tsx
Normal file
150
app/community/global-relief-fund/GlobalReliefFundClient.tsx
Normal file
@ -0,0 +1,150 @@
|
||||
'use client';
|
||||
|
||||
import Layout from '@/components/layout/Layout';
|
||||
import { communitySubmenuData } from '@/utility/constant.utils';
|
||||
import Link from 'next/link';
|
||||
import { useState } from 'react';
|
||||
import Lightbox from "yet-another-react-lightbox";
|
||||
import "yet-another-react-lightbox/styles.css";
|
||||
|
||||
export default function GlobalReliefFundClient() {
|
||||
// Show only images with id 1 to 4
|
||||
const galleryImages = communitySubmenuData.filter((img: any) => +img.id >= 1 && +img.id <= 4);
|
||||
|
||||
const [open, setOpen] = useState(false);
|
||||
const [index, setIndex] = useState(0);
|
||||
|
||||
return (
|
||||
<>
|
||||
<Layout headerStyle={1} footerStyle={1}>
|
||||
|
||||
<div
|
||||
className="inner-page-header"
|
||||
style={{
|
||||
backgroundImage: 'url(/assets/img/community/fund/fund-banner.webp)',
|
||||
}}
|
||||
>
|
||||
<div className="container">
|
||||
<div className="row">
|
||||
<div className="col-lg-12 m-auto">
|
||||
<div className="heading1 text-white">
|
||||
<h1>TCA Global Relief Fund</h1>
|
||||
<div className="space20" />
|
||||
<Link href="/" className="text-white text-decoration-none">
|
||||
Home <i className="fa-solid fa-angle-right mx-2" />
|
||||
<span>Community</span>
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div className="bloginner-section-area sp4 bg-light">
|
||||
<div className="container">
|
||||
<div className="row">
|
||||
<div className="col-lg-12 m-auto">
|
||||
<div className="event2-header heading5 space-margin60">
|
||||
<h2 className="text-anime-style-3">TCA Global Relief Fund</h2>
|
||||
<div className="space20" />
|
||||
<div className="space20" />
|
||||
<div className='row'>
|
||||
<div className='col-lg-5 d-flex align-items-center'>
|
||||
<div className="about6-header heading9">
|
||||
|
||||
<img
|
||||
src="/assets/img/all-images/community/global-fund.jpg"
|
||||
alt=""
|
||||
// style={{ height: "550px", width: "650px"}}
|
||||
/>
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div className='col-lg-7'>
|
||||
<div className="space24" />
|
||||
<p>
|
||||
Tamil Cultural Association established a global relief fund in 2000 to support financially as well as in-kind support to under privileged communities or individuals in Canada, Sri Lanka and India.
|
||||
</p>
|
||||
<div className="space20" />
|
||||
<div className="ps-4">
|
||||
<p>1. A consignment of cloths were shipped through Trico freight to Nunavil Children's Orphanage in Jaffna, Sri Lanka. </p>
|
||||
<div className="space10" />
|
||||
<p>2. Indian Rupees of 25,000 donated to burnt victim in Trichy, South India.</p>
|
||||
<div className="space10" />
|
||||
|
||||
<p>3. Project Hope fundraising in 2008 for Ramakrishna Mission school library, Batticaloa, Sri Lanka. Raised $2032.00</p>
|
||||
<div className="space10" />
|
||||
|
||||
<p>4. Donated funds and food items to St. John's Soup Kitchen, Kitchener</p>
|
||||
<div className="space10" />
|
||||
|
||||
<p>5. Gifted educational materials to school children in Jaffna and Killinochchi, Sri Lanka in 2021. Facilitated by YMCA Jaffna.</p>
|
||||
<div className="space10" />
|
||||
|
||||
<p>6. Dry ration food kits were donated to Indian upcountry community in Nuwara Eliya and Kegalle district in 2021. Funds raised $3300</p>
|
||||
<div className="space10" />
|
||||
|
||||
<p>7. Toronto Tamil Chair campaign to establish a Tamil chair at University of Toronto. Raised funds amounting to $2400 in 2021</p>
|
||||
<div className="space10" />
|
||||
|
||||
<p>8. Raised funds and donated dry food to Waterloo Region Food bank in 2022. It was part of Tamil Heritage month.</p>
|
||||
<div className="space10" />
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="row gx-4 gy-4 mt-4">
|
||||
{galleryImages.length > 0 ? (
|
||||
galleryImages.map((img: any, i: number) => (
|
||||
<div
|
||||
key={img.id}
|
||||
className="col-xl-3 col-lg-4 col-md-6 col-sm-6 col-12"
|
||||
onClick={() => {
|
||||
setIndex(i);
|
||||
setOpen(true);
|
||||
}}
|
||||
style={{ cursor: 'pointer' }}
|
||||
>
|
||||
<div className="memory-boxarea shadow-sm rounded overflow-hidden h-100">
|
||||
<div
|
||||
className="image"
|
||||
data-aos="zoom-in"
|
||||
data-aos-duration={1000}
|
||||
style={{ borderRadius: 8 }}
|
||||
>
|
||||
<img
|
||||
src={img.src}
|
||||
alt={img.alt}
|
||||
className="img-fluid w-100"
|
||||
style={{ objectFit: 'cover', height: '100%', borderRadius: 8 }}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
))
|
||||
) : (
|
||||
<div className="col-12 text-center mt-5">
|
||||
<p className="text-muted">No images found for this event.</p>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<Lightbox
|
||||
open={open}
|
||||
close={() => setOpen(false)}
|
||||
slides={galleryImages}
|
||||
index={index}
|
||||
/>
|
||||
</Layout>
|
||||
</>
|
||||
);
|
||||
}
|
||||
@ -1,153 +1,12 @@
|
||||
'use client';
|
||||
import type { Metadata } from "next"
|
||||
|
||||
import Layout from '@/components/layout/Layout';
|
||||
import { communitySubmenuData } from '@/utility/constant.utils';
|
||||
import Link from 'next/link';
|
||||
import { useState } from 'react';
|
||||
import Lightbox from "yet-another-react-lightbox";
|
||||
import "yet-another-react-lightbox/styles.css";
|
||||
export const metadata: Metadata = {
|
||||
title: "Global Relief Fund | Support Humanitarian Causes",
|
||||
description: "Support global relief efforts and humanitarian causes led by the Tamil community.",
|
||||
};
|
||||
|
||||
export default function GlobalReliefFund() {
|
||||
// Show only images with id 1 to 4
|
||||
const galleryImages = communitySubmenuData.filter(img => +img.id >= 1 && +img.id <= 4);
|
||||
import GlobalReliefFundClient from "./GlobalReliefFundClient";
|
||||
|
||||
const [open, setOpen] = useState(false);
|
||||
const [index, setIndex] = useState(0);
|
||||
|
||||
return (
|
||||
<>
|
||||
<Layout headerStyle={1} footerStyle={1}>
|
||||
|
||||
<div
|
||||
className="inner-page-header"
|
||||
style={{
|
||||
backgroundImage: 'url(/assets/img/community/fund/fund-banner.webp)',
|
||||
backgroundSize: 'cover',
|
||||
backgroundPosition: 'center',
|
||||
padding: '100px 0',
|
||||
}}
|
||||
>
|
||||
<div className="container">
|
||||
<div className="row">
|
||||
<div className="col-lg-12 m-auto">
|
||||
<div className="heading1 text-white">
|
||||
<h1>TCA Global Relief Fund</h1>
|
||||
<div className="space20" />
|
||||
<Link href="/" className="text-white text-decoration-none">
|
||||
Home <i className="fa-solid fa-angle-right mx-2" />
|
||||
<span>Community</span>
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div className="bloginner-section-area sp4 bg-light">
|
||||
<div className="container">
|
||||
<div className="row">
|
||||
<div className="col-lg-12 m-auto">
|
||||
<div className="event2-header heading5 space-margin60">
|
||||
<h2 className="text-anime-style-3">TCA Global Relief Fund</h2>
|
||||
<div className="space20" />
|
||||
<div className="space20" />
|
||||
<div className='row'>
|
||||
<div className='col-lg-5 d-flex align-items-center'>
|
||||
<div className="about6-header heading9">
|
||||
|
||||
<img
|
||||
src="/assets/img/all-images/community/global-fund.jpg"
|
||||
alt=""
|
||||
// style={{ height: "550px", width: "650px"}}
|
||||
/>
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div className='col-lg-7'>
|
||||
<div className="space24" />
|
||||
<p>
|
||||
Tamil Cultural Association established a global relief fund in 2000 to support financially as well as in-kind support to under privileged communities or individuals in Canada, Sri Lanka and India.
|
||||
</p>
|
||||
<div className="space20" />
|
||||
<div className="ps-4">
|
||||
<p>1. A consignment of cloths were shipped through Trico freight to Nunavil Children’s Orphanage in Jaffna, Sri Lanka. </p>
|
||||
<div className="space10" />
|
||||
<p>2. Indian Rupees of 25,000 donated to burnt victim in Trichy, South India.</p>
|
||||
<div className="space10" />
|
||||
|
||||
<p>3. Project Hope fundraising in 2008 for Ramakrishna Mission school library, Batticaloa, Sri Lanka. Raised $2032.00</p>
|
||||
<div className="space10" />
|
||||
|
||||
<p>4. Donated funds and food items to St. John’s Soup Kitchen, Kitchener</p>
|
||||
<div className="space10" />
|
||||
|
||||
<p>5. Gifted educational materials to school children in Jaffna and Killinochchi, Sri Lanka in 2021. Facilitated by YMCA Jaffna.</p>
|
||||
<div className="space10" />
|
||||
|
||||
<p>6. Dry ration food kits were donated to Indian upcountry community in Nuwara Eliya and Kegalle district in 2021. Funds raised $3300</p>
|
||||
<div className="space10" />
|
||||
|
||||
<p>7. Toronto Tamil Chair campaign to establish a Tamil chair at University of Toronto. Raised funds amounting to $2400 in 2021</p>
|
||||
<div className="space10" />
|
||||
|
||||
<p>8. Raised funds and donated dry food to Waterloo Region Food bank in 2022. It was part of Tamil Heritage month.</p>
|
||||
<div className="space10" />
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="row gx-4 gy-4 mt-4">
|
||||
{galleryImages.length > 0 ? (
|
||||
galleryImages.map((img, i) => (
|
||||
<div
|
||||
key={img.id}
|
||||
className="col-xl-3 col-lg-4 col-md-6 col-sm-6 col-12"
|
||||
onClick={() => {
|
||||
setIndex(i);
|
||||
setOpen(true);
|
||||
}}
|
||||
style={{ cursor: 'pointer' }}
|
||||
>
|
||||
<div className="memory-boxarea shadow-sm rounded overflow-hidden h-100">
|
||||
<div
|
||||
className="image"
|
||||
data-aos="zoom-in"
|
||||
data-aos-duration={1000}
|
||||
style={{ borderRadius: 8 }}
|
||||
>
|
||||
<img
|
||||
src={img.src}
|
||||
alt={img.alt}
|
||||
className="img-fluid w-100"
|
||||
style={{ objectFit: 'cover', height: '100%', borderRadius: 8 }}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
))
|
||||
) : (
|
||||
<div className="col-12 text-center mt-5">
|
||||
<p className="text-muted">No images found for this event.</p>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<Lightbox
|
||||
open={open}
|
||||
close={() => setOpen(false)}
|
||||
slides={galleryImages}
|
||||
index={index}
|
||||
/>
|
||||
</Layout>
|
||||
</>
|
||||
);
|
||||
export default function GlobalReliefFundPage() {
|
||||
return <GlobalReliefFundClient />;
|
||||
}
|
||||
|
||||
@ -1,4 +1,10 @@
|
||||
'use client'
|
||||
import type { Metadata } from "next"
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Tamil Community Programs | Get Involved",
|
||||
description: "Discover Tamil community programs, initiatives, and social activities in Waterloo Region.",
|
||||
};
|
||||
|
||||
import CountUp from 'react-countup'
|
||||
import Countdown from '@/components/elements/Countdown'
|
||||
import Layout from "@/components/layout/Layout"
|
||||
|
||||
@ -1,3 +1,9 @@
|
||||
import type { Metadata } from "next"
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Traditional Tamil Recipes | Explore & Cook",
|
||||
description: "Explore traditional Tamil recipes and home-style dishes shared by the community.",
|
||||
};
|
||||
|
||||
|
||||
import Layout from "@/components/layout/Layout"
|
||||
|
||||
121
app/community/tamil-school/TamilSchoolClient.tsx
Normal file
121
app/community/tamil-school/TamilSchoolClient.tsx
Normal file
@ -0,0 +1,121 @@
|
||||
'use client';
|
||||
|
||||
import Layout from '@/components/layout/Layout';
|
||||
import { communitySubmenuData } from '@/utility/constant.utils';
|
||||
import Link from 'next/link';
|
||||
import { useState } from 'react';
|
||||
import Lightbox from "yet-another-react-lightbox";
|
||||
import "yet-another-react-lightbox/styles.css";
|
||||
|
||||
export default function TamilSchoolClient() {
|
||||
|
||||
const galleryImages = communitySubmenuData.filter((img: any) => +img.id >= 13 && +img.id <= 20);
|
||||
|
||||
const [open, setOpen] = useState(false);
|
||||
const [index, setIndex] = useState(0);
|
||||
|
||||
return (
|
||||
<>
|
||||
<Layout headerStyle={1} footerStyle={1}>
|
||||
<div
|
||||
className="inner-page-header"
|
||||
style={{
|
||||
backgroundImage: 'url(/assets/img/community/tamil-school/school-banner.webp)',
|
||||
}}
|
||||
>
|
||||
<div className="container">
|
||||
<div className="row">
|
||||
<div className="col-lg-12 m-auto">
|
||||
<div className="heading1">
|
||||
<h1>Tamil School</h1>
|
||||
<div className="space20" />
|
||||
<Link href="/" className="text-decoration-none">
|
||||
Home <i className="fa-solid fa-angle-right mx-2" />
|
||||
<span>Tamil School</span>
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="bloginner-section-area sp4">
|
||||
<div className="container">
|
||||
<div className="row">
|
||||
<div className="col-lg-12 m-auto">
|
||||
<div className="event2-header heading5 space-margin60">
|
||||
<h2 className="text-anime-style-3">
|
||||
Waterloo Region Tamil School
|
||||
</h2>
|
||||
|
||||
<div className="space24" />
|
||||
<p>Waterloo region's first Tamil language class was started in 1987 with the support of Late Mr. Marcil Francis, Late Prof. Pala Kannappan, Prof. Selvakumar and Mrs. Pushpa Seevaratnam. It was held at Victoria Public School, downtown Kitchener.</p>
|
||||
|
||||
<div className="space24" />
|
||||
<p>The first Tamil Variety show & Social Hour was held on December 5th, 1987 at Keatsway Public School, Waterloo.</p>
|
||||
|
||||
<div className="space24" />
|
||||
<p>Tamil Class was re-activated in 2000 at St. John's School, Guelph under the ILP program. Mrs. Padhmini Swaminathan was the first teacher. In the following year it was moved to St. Peter's School, Guelph and successive teachers were Shayamala Navam, Dharini Sivakumar and Shanthi Rajan. Classes discontinued in 2005 due to lack of student participation.</p>
|
||||
|
||||
<div className="space24" />
|
||||
<p>In 2011, Waterloo District School board in conjunction with Tamil Cultural Association recommenced the Tamil class at Hespler Public School, Cambridge. Mrs. E. Kunamalar was the teacher.</p>
|
||||
|
||||
<div className="space24" />
|
||||
<p>In the year 2020/21, as per instructions from Ontario Ministry of Education, Waterloo Tamil school switched to an online portal. This was due to Covid-19 pandemic in the Province. Virtual and in-house classes are conducted by Mrs. Suharmini Shrishankar.</p>
|
||||
|
||||
<div className="space24" />
|
||||
<p>October 2022, Waterloo school board recommenced live Tamil class at 555 Ellis Rd, Cambridge, ON N3C 4K2. It is held on Saturday at 9.00am</p>
|
||||
|
||||
<p>The school is primarily supported by Tamil Cultural Association of Waterloo Region and Waterloo District School Board.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="row gx-4 gy-4 mt-4">
|
||||
{galleryImages.length > 0 ? (
|
||||
galleryImages.map((img: any, i: number) => (
|
||||
<div
|
||||
key={img.id}
|
||||
className="col-xl-3 col-lg-4 col-md-6 col-sm-6 col-12"
|
||||
onClick={() => {
|
||||
setIndex(i);
|
||||
setOpen(true);
|
||||
}}
|
||||
style={{ cursor: 'pointer' }}
|
||||
>
|
||||
<div className="memory-boxarea rounded overflow-hidden h-100">
|
||||
<div
|
||||
className="image mb-2"
|
||||
data-aos="zoom-in"
|
||||
data-aos-duration={1000}
|
||||
style={{ borderRadius: 8 }}
|
||||
>
|
||||
<img
|
||||
src={img.src}
|
||||
alt={img.alt}
|
||||
className="img-fluid w-100"
|
||||
style={{ objectFit: 'cover', height: '100%', borderRadius: 8 }}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
))
|
||||
) : (
|
||||
<div className="col-12 text-center mt-5">
|
||||
<p className="text-muted">No images found for this event.</p>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<Lightbox
|
||||
open={open}
|
||||
close={() => setOpen(false)}
|
||||
slides={galleryImages}
|
||||
index={index}
|
||||
/>
|
||||
</Layout>
|
||||
</>
|
||||
);
|
||||
}
|
||||
@ -1,124 +1,12 @@
|
||||
'use client';
|
||||
import type { Metadata } from "next"
|
||||
|
||||
import Layout from '@/components/layout/Layout';
|
||||
import { communitySubmenuData } from '@/utility/constant.utils';
|
||||
import Link from 'next/link';
|
||||
import { useState } from 'react';
|
||||
import Lightbox from "yet-another-react-lightbox";
|
||||
import "yet-another-react-lightbox/styles.css";
|
||||
export const metadata: Metadata = {
|
||||
title: "Tamil Language School | Enroll Your Child",
|
||||
description: "Learn about Tamil language education programs for children in Waterloo Region.",
|
||||
};
|
||||
|
||||
export default function CricketClub() {
|
||||
import TamilSchoolClient from "./TamilSchoolClient";
|
||||
|
||||
const galleryImages = communitySubmenuData.filter(img => +img.id >= 13 && +img.id <= 20);
|
||||
|
||||
const [open, setOpen] = useState(false);
|
||||
const [index, setIndex] = useState(0);
|
||||
|
||||
return (
|
||||
<>
|
||||
<Layout headerStyle={1} footerStyle={1}>
|
||||
<div
|
||||
className="inner-page-header"
|
||||
style={{
|
||||
backgroundImage: 'url(/assets/img/community/tamil-school/school-banner.webp)',
|
||||
backgroundSize: 'cover',
|
||||
backgroundPosition: 'center',
|
||||
padding: '100px 0',
|
||||
}}
|
||||
>
|
||||
<div className="container">
|
||||
<div className="row">
|
||||
<div className="col-lg-12 m-auto">
|
||||
<div className="heading1">
|
||||
<h1>Tamil School</h1>
|
||||
<div className="space20" />
|
||||
<Link href="/" className="text-decoration-none">
|
||||
Home <i className="fa-solid fa-angle-right mx-2" />
|
||||
<span>Tamil School</span>
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="bloginner-section-area sp4">
|
||||
<div className="container">
|
||||
<div className="row">
|
||||
<div className="col-lg-12 m-auto">
|
||||
<div className="event2-header heading5 space-margin60">
|
||||
<h2 className="text-anime-style-3">
|
||||
Waterloo Region Tamil School
|
||||
</h2>
|
||||
|
||||
<div className="space24" />
|
||||
<p>Waterloo region’s first Tamil language class was started in 1987 with the support of Late Mr. Marcil Francis, Late Prof. Pala Kannappan, Prof. Selvakumar and Mrs. Pushpa Seevaratnam. It was held at Victoria Public School, downtown Kitchener.</p>
|
||||
|
||||
<div className="space24" />
|
||||
<p>The first Tamil Variety show & Social Hour was held on December 5th, 1987 at Keatsway Public School, Waterloo.</p>
|
||||
|
||||
<div className="space24" />
|
||||
<p>Tamil Class was re-activated in 2000 at St. John’s School, Guelph under the ILP program. Mrs. Padhmini Swaminathan was the first teacher. In the following year it was moved to St. Peter’s School, Guelph and successive teachers were Shayamala Navam, Dharini Sivakumar and Shanthi Rajan. Classes discontinued in 2005 due to lack of student participation.</p>
|
||||
|
||||
<div className="space24" />
|
||||
<p>In 2011, Waterloo District School board in conjunction with Tamil Cultural Association recommenced the Tamil class at Hespler Public School, Cambridge. Mrs. E. Kunamalar was the teacher.</p>
|
||||
|
||||
<div className="space24" />
|
||||
<p>In the year 2020/21, as per instructions from Ontario Ministry of Education, Waterloo Tamil school switched to an online portal. This was due to Covid-19 pandemic in the Province. Virtual and in-house classes are conducted by Mrs. Suharmini Shrishankar.</p>
|
||||
|
||||
<div className="space24" />
|
||||
<p>October 2022, Waterloo school board recommenced live Tamil class at 555 Ellis Rd, Cambridge, ON N3C 4K2. It is held on Saturday at 9.00am</p>
|
||||
|
||||
<p>The school is primarily supported by Tamil Cultural Association of Waterloo Region and Waterloo District School Board.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="row gx-4 gy-4 mt-4">
|
||||
{galleryImages.length > 0 ? (
|
||||
galleryImages.map((img, i) => (
|
||||
<div
|
||||
key={img.id}
|
||||
className="col-xl-3 col-lg-4 col-md-6 col-sm-6 col-12"
|
||||
onClick={() => {
|
||||
setIndex(i);
|
||||
setOpen(true);
|
||||
}}
|
||||
style={{ cursor: 'pointer' }}
|
||||
>
|
||||
<div className="memory-boxarea rounded overflow-hidden h-100">
|
||||
<div
|
||||
className="image mb-2"
|
||||
data-aos="zoom-in"
|
||||
data-aos-duration={1000}
|
||||
style={{ borderRadius: 8 }}
|
||||
>
|
||||
<img
|
||||
src={img.src}
|
||||
alt={img.alt}
|
||||
className="img-fluid w-100"
|
||||
style={{ objectFit: 'cover', height: '100%', borderRadius: 8 }}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
))
|
||||
) : (
|
||||
<div className="col-12 text-center mt-5">
|
||||
<p className="text-muted">No images found for this event.</p>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<Lightbox
|
||||
open={open}
|
||||
close={() => setOpen(false)}
|
||||
slides={galleryImages}
|
||||
index={index}
|
||||
/>
|
||||
</Layout>
|
||||
</>
|
||||
);
|
||||
export default function TamilSchoolPage() {
|
||||
return <TamilSchoolClient />;
|
||||
}
|
||||
|
||||
@ -1,256 +1,12 @@
|
||||
"use client";
|
||||
import Countdown from '@/components/elements/Countdown';
|
||||
import Layout from "@/components/layout/Layout";
|
||||
import Link from "next/link";
|
||||
import { useState, useEffect, ChangeEvent, FormEvent } from "react";
|
||||
import ReCAPTCHA from "react-google-recaptcha";
|
||||
import axios from "axios";
|
||||
import type { Metadata } from "next"
|
||||
|
||||
interface FormData {
|
||||
name: string;
|
||||
phone: string;
|
||||
email: string;
|
||||
subject: string;
|
||||
message: string;
|
||||
}
|
||||
export const metadata: Metadata = {
|
||||
title: "Contact Tamil Culture Waterloo | Connect With Us",
|
||||
description: "Contact Tamil Culture Waterloo for events, membership, volunteering, and community support in Waterloo, Ontario.",
|
||||
};
|
||||
|
||||
interface FormErrors {
|
||||
name?: string;
|
||||
phone?: string;
|
||||
email?: string;
|
||||
subject?: string;
|
||||
message?: string;
|
||||
captcha?: string;
|
||||
}
|
||||
import ContactSection from "@/components/contact/ContactSection";
|
||||
|
||||
export default function Contact() {
|
||||
const [formData, setFormData] = useState<FormData>({
|
||||
name: "",
|
||||
phone: "",
|
||||
email: "",
|
||||
subject: "",
|
||||
message: "",
|
||||
});
|
||||
|
||||
const [captchaToken, setCaptchaToken] = useState<string | null>(null);
|
||||
const [formErrors, setFormErrors] = useState<FormErrors>({});
|
||||
const [alert, setAlert] = useState<{ show: boolean; type: string; message: string }>({
|
||||
show: false,
|
||||
type: "",
|
||||
message: "",
|
||||
});
|
||||
|
||||
const handleChange = (e: ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => {
|
||||
const { name, value } = e.target;
|
||||
setFormData((prev) => ({ ...prev, [name]: value }));
|
||||
};
|
||||
|
||||
const handleCaptchaChange = (token: string | null) => {
|
||||
setCaptchaToken(token);
|
||||
};
|
||||
|
||||
const handleSubmit = async (e: FormEvent) => {
|
||||
e.preventDefault();
|
||||
|
||||
const errors: FormErrors = {};
|
||||
if (!formData.name.trim()) errors.name = "Name is required.";
|
||||
if (!formData.phone.trim()) errors.phone = "Phone number is required.";
|
||||
if (!formData.email.trim()) errors.email = "Email is required.";
|
||||
if (!formData.subject.trim()) errors.subject = "Subject is required.";
|
||||
if (!formData.message.trim()) errors.message = "Message is required.";
|
||||
if (!captchaToken) errors.captcha = "Please verify the CAPTCHA.";
|
||||
|
||||
setFormErrors(errors);
|
||||
if (Object.keys(errors).length > 0) return;
|
||||
|
||||
const emailData = {
|
||||
...formData,
|
||||
message: `Subject: ${formData.subject}<br /><br />Message: ${formData.message}`,
|
||||
to: "mail@tamilculturewaterloo.org",
|
||||
senderName: "Tamil Culture Waterloo Contact Page",
|
||||
recaptchaToken: captchaToken,
|
||||
};
|
||||
|
||||
try {
|
||||
const res = await axios.post("https://mailserver.metatronnest.com/send", emailData, {
|
||||
headers: { "Content-Type": "application/json" },
|
||||
});
|
||||
|
||||
setAlert({
|
||||
show: true,
|
||||
type: "success",
|
||||
message: res?.data?.message || "Message sent successfully!",
|
||||
});
|
||||
|
||||
setFormData({ name: "", phone: "", email: "", subject: "", message: "" });
|
||||
setCaptchaToken(null);
|
||||
setFormErrors({});
|
||||
} catch {
|
||||
setAlert({
|
||||
show: true,
|
||||
type: "danger",
|
||||
message: "Failed to send message. Please try again later.",
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
if (alert.show) {
|
||||
const timer = setTimeout(() => {
|
||||
setAlert(prev => ({ ...prev, show: false }));
|
||||
}, 5000);
|
||||
return () => clearTimeout(timer);
|
||||
}
|
||||
}, [alert.show]);
|
||||
|
||||
|
||||
return (
|
||||
<Layout headerStyle={1} footerStyle={1}>
|
||||
<div>
|
||||
<div className="inner-page-header" style={{ backgroundImage: 'url(/assets/img/all-images/contact/contact-banner.webp)' }}>
|
||||
<div className="container">
|
||||
<div className="row">
|
||||
<div className="col-lg-12 m-auto">
|
||||
<div className="heading1">
|
||||
<h1>Contact Us</h1>
|
||||
<div className="space20" />
|
||||
<Link href="/">Home <i className="fa-solid fa-angle-right" /> <span>Contact Us</span></Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="space80" />
|
||||
<div className="contact-bg-section">
|
||||
<div className="container">
|
||||
<div className="row">
|
||||
<div className="col-lg-6 col-md-6">
|
||||
<div className="contact-boxarea3 mb-2" data-aos="zoom-in" data-aos-duration={900}>
|
||||
<div className="icons">
|
||||
<img src="/assets/img/icons/mail1.svg" alt="" />
|
||||
</div>
|
||||
<div className="text">
|
||||
<h5>Email</h5>
|
||||
<div className="space14" />
|
||||
<Link href="mailto:mail@tamilculturewaterloo.org">mail@tamilculturewaterloo.org</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-6 col-md-6">
|
||||
<div className="contact-boxarea2" data-aos="zoom-in" data-aos-duration={900}>
|
||||
<div className="icons">
|
||||
<img src="/assets/img/icons/location1.svg" alt="" />
|
||||
</div>
|
||||
<div className="text">
|
||||
<h5>Location</h5>
|
||||
<div className="space14" />
|
||||
<Link href="mailto:mail@tamilculturewaterloo.org">P.O. Box No:25068, Kitchener, Ontario, N2A 4A5, Canada.</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/* <div className="col-lg-4 col-md-6">
|
||||
<div className="contact-boxarea3" data-aos="zoom-in" data-aos-duration={1000}>
|
||||
<div className="icons">
|
||||
<img src="/assets/img/icons/phn1.svg" alt="" />
|
||||
</div>
|
||||
<div className="text">
|
||||
<h5>Call Us</h5>
|
||||
<div className="space14" />
|
||||
<Link href="tel:+11234567890">+1 123 456 7890</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div> */}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="contact-inner-section sp4">
|
||||
<div className="container">
|
||||
<div className="row">
|
||||
<div className="col-lg-6" data-aos="zoom-in" data-aos-duration={1000}>
|
||||
<div className="contact4-boxarea">
|
||||
<h3 className="text-anime-style-3">Get In Touch Now</h3>
|
||||
<div className="space8" />
|
||||
<form onSubmit={handleSubmit}>
|
||||
{alert.show && (
|
||||
<div className={`alert alert-${alert.type}`}>{alert.message}</div>
|
||||
)}
|
||||
<div className="row">
|
||||
<div className="col-lg-6 col-md-6">
|
||||
<div className="input-area">
|
||||
<input type="text" name="name" placeholder="Name" value={formData.name} onChange={handleChange} />
|
||||
{formErrors.name && <small className="text-danger">{formErrors.name}</small>}
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-6 col-md-6">
|
||||
<div className="input-area">
|
||||
<input type="text" name="phone" placeholder="Phone" value={formData.phone} onChange={handleChange} />
|
||||
{formErrors.phone && <small className="text-danger">{formErrors.phone}</small>}
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-12 col-md-6">
|
||||
<div className="input-area">
|
||||
<input type="email" name="email" placeholder="Email" value={formData.email} onChange={handleChange} />
|
||||
{formErrors.email && <small className="text-danger">{formErrors.email}</small>}
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-12 col-md-6">
|
||||
<div className="input-area">
|
||||
<input type="text" name="subject" placeholder="Subjects" value={formData.subject} onChange={handleChange} />
|
||||
{formErrors.subject && <small className="text-danger">{formErrors.subject}</small>}
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-12">
|
||||
<div className="input-area">
|
||||
<textarea name="message" placeholder="Message" value={formData.message} onChange={handleChange} />
|
||||
{formErrors.message && <small className="text-danger">{formErrors.message}</small>}
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-12 mt-2">
|
||||
<ReCAPTCHA
|
||||
sitekey="6Lea8ZYrAAAAAHaghaLjDx_K084IFATZby7Rzqhl"
|
||||
onChange={handleCaptchaChange}
|
||||
/>
|
||||
{formErrors.captcha && <small className="text-danger">{formErrors.captcha}</small>}
|
||||
</div>
|
||||
<div className="col-lg-12">
|
||||
<div className="space24" />
|
||||
<div className="input-area text-end">
|
||||
<button type="submit" className="vl-btn1">Submit Now</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-6">
|
||||
<div className="img1 image-anime">
|
||||
<img
|
||||
src="/assets/img/all-images/contact/contact-1.webp"
|
||||
alt=""
|
||||
style={{ border: 0, width: '100%', height: '620px' }}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="contact2-section">
|
||||
<div className="mapouter">
|
||||
<div className="gmap_canvas">
|
||||
<iframe
|
||||
src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d2886.0622283957745!2d-80.39731242413884!3d43.434476063108!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x882bf3cd7b1f3f11%3A0xc93e0b894c6a8b15!2sKitchener%2C%20ON%20N2A%204A5%2C%20Canada!5e0!3m2!1sen!2sin!4v1720000000000!5m2!1sen!2sin"
|
||||
style={{ border: 0, width: '100%', height: '450px' }}
|
||||
allowFullScreen
|
||||
loading="lazy"
|
||||
referrerPolicy="no-referrer-when-downgrade"
|
||||
></iframe>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</Layout>
|
||||
);
|
||||
return <ContactSection />;
|
||||
}
|
||||
@ -1,4 +1,7 @@
|
||||
import type { Metadata } from "next"
|
||||
import Layout from "@/components/layout/Layout"
|
||||
|
||||
|
||||
import Popup from '@/components/layout/Popup'
|
||||
import Section1 from '@/components/sections/home9/section1'
|
||||
import Section2 from '@/components/sections/home3/section2'
|
||||
@ -29,6 +32,11 @@ import AdSectionFive from "@/components/home/AdSectionFive"
|
||||
import HeritageLanguage from "@/components/heritage-language/heritage-language"
|
||||
import Food from "@/components/community/food/food"
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Tamil Culture Waterloo |Join Our Community",
|
||||
description: "Celebrating Tamil heritage in Waterloo, Ontario through culture, events, and community programs. Join Tamil families and stay connected locally.",
|
||||
};
|
||||
|
||||
export default function Home() {
|
||||
|
||||
return (
|
||||
|
||||
@ -1,3 +1,9 @@
|
||||
import type { Metadata } from "next"
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Christmas Celebration Registration | Celebrate With Us",
|
||||
description: "Register for Christmas celebrations with the Tamil community in Waterloo Region.",
|
||||
};
|
||||
|
||||
import Layout from "@/components/layout/Layout"
|
||||
import Section1 from "@/components/online/christmas/Section1"
|
||||
|
||||
@ -1,3 +1,9 @@
|
||||
import type { Metadata } from "next"
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Community Picnic Registration | Register Now",
|
||||
description: "Register for the community picnic and enjoy family-friendly activities in Waterloo.",
|
||||
};
|
||||
|
||||
import Layout from "@/components/layout/Layout"
|
||||
import Section1 from "@/components/online/communitypicnic/Section1"
|
||||
|
||||
@ -1,36 +0,0 @@
|
||||
|
||||
import Layout from "@/components/layout/Layout"
|
||||
import Section1 from "@/components/online/kalaivizha/Section1"
|
||||
import Section2 from "@/components/online/kalaivizha/Section2"
|
||||
import Section3 from "@/components/online/kalaivizha/Section3"
|
||||
import Link from "next/link"
|
||||
export default function kalaivizha() {
|
||||
|
||||
return (
|
||||
<>
|
||||
|
||||
<Layout headerStyle={1} footerStyle={1}>
|
||||
<div>
|
||||
<div className="inner-page-header" style={{ backgroundImage: 'url(/assets/img/online/banners/kalai-vizha.webp)' }}>
|
||||
<div className="container">
|
||||
<div className="row">
|
||||
<div className="col-lg-12 m-auto">
|
||||
<div className="heading1">
|
||||
<h1>Kalai Vizha 2025</h1>
|
||||
<div className="space20" />
|
||||
<Link href="/">Home <i className="fa-solid fa-angle-right" /> <span>Online</span></Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<Section1 />
|
||||
<Section2 />
|
||||
<Section3 />
|
||||
</div>
|
||||
|
||||
</Layout>
|
||||
</>
|
||||
)
|
||||
}
|
||||
@ -1,3 +1,9 @@
|
||||
import type { Metadata } from "next"
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Membership Registration 2024 | Sign Up Today",
|
||||
description: "Sign up for 2024 membership and support Tamil culture in Waterloo Region.",
|
||||
};
|
||||
|
||||
import Countdown from '@/components/elements/Countdown'
|
||||
import Layout from "@/components/layout/Layout"
|
||||
|
||||
@ -1,3 +1,9 @@
|
||||
import type { Metadata } from "next"
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Membership Registration 2025 | Join the Community",
|
||||
description: "Join as a 2025 member and participate in Tamil cultural, social, and family events.",
|
||||
};
|
||||
|
||||
import Layout from "@/components/layout/Layout"
|
||||
import Section1 from "@/components/online/membership2025/Section1"
|
||||
|
||||
42
app/register/membership-2026/page.tsx
Normal file
42
app/register/membership-2026/page.tsx
Normal file
@ -0,0 +1,42 @@
|
||||
import type { Metadata } from "next"
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Membership Registration 2026 | Become a Member",
|
||||
description: "Register for 2026 membership and stay connected with Tamil community activities in Waterloo.",
|
||||
};
|
||||
|
||||
import Layout from "@/components/layout/Layout"
|
||||
import Section1 from "@/components/online/membership2026/Section1"
|
||||
import Section2 from "@/components/online/membership2026/Section2"
|
||||
import Section3 from "@/components/online/membership2026/Section3"
|
||||
import Link from "next/link"
|
||||
export default function membership2026() {
|
||||
|
||||
return (
|
||||
<>
|
||||
|
||||
<Layout headerStyle={1} footerStyle={1}>
|
||||
<div>
|
||||
<div className="inner-page-header" style={{ backgroundImage: 'url(/assets/img/online/banners/membership-2026.webp)' }}>
|
||||
<div className="container">
|
||||
<div className="row">
|
||||
<div className="col-lg-12 m-auto">
|
||||
<div className="heading1">
|
||||
<h1>Membership 2026</h1>
|
||||
<div className="space20" />
|
||||
<Link href="/">Home <i className="fa-solid fa-angle-right" /> <span>Online</span></Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<Section1 />
|
||||
<Section2 />
|
||||
<Section3 />
|
||||
</div>
|
||||
|
||||
</Layout>
|
||||
</>
|
||||
)
|
||||
}
|
||||
@ -1,3 +1,9 @@
|
||||
import type { Metadata } from "next"
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Cultural Performance Registration | Apply Now",
|
||||
description: "Apply to perform at Tamil cultural events and showcase your talent on stage.",
|
||||
};
|
||||
|
||||
import Layout from "@/components/layout/Layout"
|
||||
import Section1 from "@/components/online/performance/Section1"
|
||||
|
||||
@ -1,3 +1,9 @@
|
||||
import type { Metadata } from "next"
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Event Registration Form | Register Online",
|
||||
description: "Complete the event registration form to participate in upcoming community programs.",
|
||||
};
|
||||
|
||||
import Layout from "@/components/layout/Layout"
|
||||
import Section1 from "@/components/online/registrationform/Section1"
|
||||
|
||||
@ -1,3 +1,7 @@
|
||||
export const metadata = {
|
||||
title: "Sponsorship Registration | Support Our Community",
|
||||
description: "Become a sponsor and support Tamil cultural programs and community initiatives.",
|
||||
};
|
||||
|
||||
import Layout from "@/components/layout/Layout"
|
||||
import Section1 from "@/components/online/sponsor/Section1"
|
||||
|
||||
@ -1,3 +1,9 @@
|
||||
import type { Metadata } from "next"
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Sports Day Registration | Participate Today",
|
||||
description: "Sign up for Sports Day and participate in fun, fitness, and team spirit events.",
|
||||
};
|
||||
|
||||
import Layout from "@/components/layout/Layout"
|
||||
import Section1 from "@/components/online/sportsday/Section1"
|
||||
|
||||
@ -1,3 +1,9 @@
|
||||
import type { Metadata } from "next"
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Tamil New Year Event Registration | Join the Fest",
|
||||
description: "Celebrate Tamil New Year with community events, rituals, and cultural programs.",
|
||||
};
|
||||
|
||||
import Layout from "@/components/layout/Layout"
|
||||
import Section1 from "@/components/online/tamilnewyear/Section1"
|
||||
|
||||
@ -1,3 +1,9 @@
|
||||
import type { Metadata } from "next"
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Thai Pongal 2025 Registration | Celebrate Together",
|
||||
description: "Register for Thai Pongal 2025 celebrations and enjoy Tamil traditions in Waterloo.",
|
||||
};
|
||||
|
||||
import Layout from "@/components/layout/Layout"
|
||||
import Section1 from "@/components/online/thaipongal2025/Section1"
|
||||
|
||||
@ -1,3 +1,9 @@
|
||||
import type { Metadata } from "next"
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Volunteer Registration | Serve the Community",
|
||||
description: "Volunteer with us and contribute your time to support the Tamil community in Waterloo.",
|
||||
};
|
||||
|
||||
import Layout from "@/components/layout/Layout"
|
||||
import Section1 from "@/components/online/volunteer/Section1"
|
||||
|
||||
@ -1,4 +1,10 @@
|
||||
'use client'
|
||||
import type { Metadata } from "next"
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Christian Festivals Among Tamils | Faith & Heritage",
|
||||
description: "Learn how Christian Tamil festivals are celebrated in Waterloo with faith, tradition, and community spirit.",
|
||||
};
|
||||
|
||||
import Layout from "@/components/layout/Layout"
|
||||
import Section1 from "@/components/tamilculture/tamil-festivals/christian-festivals/Section1"
|
||||
import Link from "next/link"
|
||||
|
||||
@ -1,4 +1,10 @@
|
||||
'use client'
|
||||
import type { Metadata } from "next"
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Hindu Festivals in Tamil Culture | Learn & Celebrate",
|
||||
description: "Learn about Hindu festivals observed by Tamil families and communities in Waterloo Region.",
|
||||
};
|
||||
|
||||
import Layout from "@/components/layout/Layout"
|
||||
import Section1 from "@/components/tamilculture/tamil-festivals/hindu-festivals/Section1"
|
||||
import Section2 from "@/components/tamilculture/tamil-festivals/hindu-festivals/Section2"
|
||||
|
||||
@ -1,7 +1,16 @@
|
||||
'use client'
|
||||
import type { Metadata } from "next"
|
||||
|
||||
|
||||
import Layout from "@/components/layout/Layout"
|
||||
import Section1 from "@/components/tamilculture/tamil-festivals/muslim-festivals/Section1"
|
||||
import Link from "next/link"
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Muslim Festivals in Tamil Community | Cultural Unity",
|
||||
description: "Discover Muslim festivals celebrated within the Tamil community, promoting unity and shared heritage.",
|
||||
};
|
||||
|
||||
|
||||
export default function MuslimFestivals() {
|
||||
|
||||
return (
|
||||
|
||||
@ -1,4 +1,10 @@
|
||||
'use client'
|
||||
import type { Metadata } from "next"
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Tamil Festivals & Traditions | Explore Our Culture",
|
||||
description: "Explore Tamil festivals celebrated in Waterloo, Ontario, and learn their cultural meaning and traditions.",
|
||||
};
|
||||
|
||||
import Layout from "@/components/layout/Layout"
|
||||
import Section1 from "@/components/tamilculture/tamil-festivals/Section1"
|
||||
import Link from "next/link"
|
||||
|
||||
@ -1,3 +1,8 @@
|
||||
export const metadata = {
|
||||
title: "Tamil Language History & Culture | Learn Tamil",
|
||||
description: "Explore the history, richness, and global significance of the Tamil language.",
|
||||
};
|
||||
|
||||
import Countdown from '@/components/elements/Countdown';
|
||||
import Layout from "@/components/layout/Layout";
|
||||
import { tamilculture } from '@/utility/constant.utils';
|
||||
|
||||
@ -38,13 +38,12 @@ export default function TamilLanguageData() {
|
||||
>
|
||||
<div className="container">
|
||||
<div className="row">
|
||||
<div className="col-lg-6 m-auto">
|
||||
<div className="heading1 text-center">
|
||||
<div className="col-lg-12 m-auto">
|
||||
<div className="heading1">
|
||||
<h1>TAMIL LANGUAGE</h1>
|
||||
<div className="space20" />
|
||||
<Link href="/">
|
||||
Home <i className="fa-solid fa-angle-right" />{' '}
|
||||
<span>TAMIL LANGUAGE</span>
|
||||
Home <i className="fa-solid fa-angle-right" /> <span>TAMIL LANGUAGE</span>
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -1,3 +1,9 @@
|
||||
import type { Metadata } from "next"
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Tamil Bridal Makeup Traditions | Explore Styles",
|
||||
description: "Explore traditional and modern Tamil bridal makeup styles and cultural beauty practices.",
|
||||
};
|
||||
|
||||
import Countdown from '@/components/elements/Countdown'
|
||||
import Layout from "@/components/layout/Layout"
|
||||
|
||||
@ -1,3 +1,9 @@
|
||||
import type { Metadata } from "next"
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Catholic Tamil Wedding Customs | Cultural Insights",
|
||||
description: "Learn about Catholic Tamil wedding customs practiced by families in the community.",
|
||||
};
|
||||
|
||||
import Countdown from '@/components/elements/Countdown'
|
||||
import Layout from "@/components/layout/Layout"
|
||||
|
||||
@ -1,3 +1,9 @@
|
||||
import type { Metadata } from "next"
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Modern City Style Tamil Weddings | View Trends",
|
||||
description: "Discover modern city-style Tamil weddings blending tradition with contemporary trends.",
|
||||
};
|
||||
|
||||
import Countdown from '@/components/elements/Countdown'
|
||||
import Layout from "@/components/layout/Layout"
|
||||
|
||||
@ -1,3 +1,9 @@
|
||||
import type { Metadata } from "next"
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Hindu Wedding Rituals | Understand Sacred Customs",
|
||||
description: "Learn the meaning behind Hindu Tamil wedding rituals and sacred marriage traditions.",
|
||||
};
|
||||
|
||||
import Countdown from '@/components/elements/Countdown'
|
||||
import Layout from "@/components/layout/Layout"
|
||||
|
||||
@ -1,8 +1,17 @@
|
||||
'use client'
|
||||
import type { Metadata } from "next"
|
||||
|
||||
|
||||
import Layout from "@/components/layout/Layout"
|
||||
import TamilCultureSection from "@/components/tamilculture/culturehome/TamilCultureSection"
|
||||
import Section1 from "@/components/tamilculture/tamil-wedding-custom/Section1"
|
||||
import Link from "next/link"
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Traditional Tamil Wedding Customs | Learn Traditions",
|
||||
description: "Understand traditional Tamil wedding customs and rituals followed by families across generations.",
|
||||
};
|
||||
|
||||
|
||||
export default function TamilWeddingCustom() {
|
||||
|
||||
return (
|
||||
|
||||
@ -1,3 +1,9 @@
|
||||
import type { Metadata } from "next"
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Protestant Tamil Wedding Traditions | Learn More",
|
||||
description: "Explore Protestant Tamil wedding traditions and their cultural and religious significance.",
|
||||
};
|
||||
|
||||
import Countdown from '@/components/elements/Countdown'
|
||||
import Layout from "@/components/layout/Layout"
|
||||
|
||||
@ -1,3 +1,9 @@
|
||||
import type { Metadata } from "next"
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Story of the Saree | Discover Tamil Heritage",
|
||||
description: "Learn the story, history, and cultural importance of the saree in Tamil heritage.",
|
||||
};
|
||||
|
||||
import Countdown from '@/components/elements/Countdown'
|
||||
import Layout from "@/components/layout/Layout"
|
||||
|
||||
@ -62,7 +62,9 @@ export default function Section1() {
|
||||
</div>
|
||||
</div>
|
||||
<div className="content-area">
|
||||
<Link href="/speakers-single">{member.name}</Link>
|
||||
<h5 style={{ fontWeight: "bold" }}>
|
||||
{member.name}
|
||||
</h5>
|
||||
<div className="space6" />
|
||||
<p>{member.post}</p>
|
||||
</div>
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
256
components/contact/ContactSection.tsx
Normal file
256
components/contact/ContactSection.tsx
Normal file
@ -0,0 +1,256 @@
|
||||
'use client';
|
||||
|
||||
import Layout from "@/components/layout/Layout";
|
||||
import Link from "next/link";
|
||||
import { useState, useEffect, ChangeEvent, FormEvent } from "react";
|
||||
import ReCAPTCHA from "react-google-recaptcha";
|
||||
import axios from "axios";
|
||||
|
||||
interface FormData {
|
||||
name: string;
|
||||
phone: string;
|
||||
email: string;
|
||||
subject: string;
|
||||
message: string;
|
||||
}
|
||||
|
||||
interface FormErrors {
|
||||
name?: string;
|
||||
phone?: string;
|
||||
email?: string;
|
||||
subject?: string;
|
||||
message?: string;
|
||||
captcha?: string;
|
||||
}
|
||||
|
||||
export default function ContactSection() {
|
||||
const [formData, setFormData] = useState<FormData>({
|
||||
name: "",
|
||||
phone: "",
|
||||
email: "",
|
||||
subject: "",
|
||||
message: "",
|
||||
});
|
||||
|
||||
const [captchaToken, setCaptchaToken] = useState<string | null>(null);
|
||||
const [formErrors, setFormErrors] = useState<FormErrors>({});
|
||||
const [alert, setAlert] = useState<{ show: boolean; type: string; message: string }>({
|
||||
show: false,
|
||||
type: "",
|
||||
message: "",
|
||||
});
|
||||
|
||||
const handleChange = (e: ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => {
|
||||
const { name, value } = e.target;
|
||||
setFormData((prev) => ({ ...prev, [name]: value }));
|
||||
};
|
||||
|
||||
const handleCaptchaChange = (token: string | null) => {
|
||||
setCaptchaToken(token);
|
||||
};
|
||||
|
||||
const handleSubmit = async (e: FormEvent) => {
|
||||
e.preventDefault();
|
||||
|
||||
const errors: FormErrors = {};
|
||||
if (!formData.name.trim()) errors.name = "Name is required.";
|
||||
if (!formData.phone.trim()) errors.phone = "Phone number is required.";
|
||||
if (!formData.email.trim()) errors.email = "Email is required.";
|
||||
if (!formData.subject.trim()) errors.subject = "Subject is required.";
|
||||
if (!formData.message.trim()) errors.message = "Message is required.";
|
||||
if (!captchaToken) errors.captcha = "Please verify the CAPTCHA.";
|
||||
|
||||
setFormErrors(errors);
|
||||
if (Object.keys(errors).length > 0) return;
|
||||
|
||||
const emailData = {
|
||||
...formData,
|
||||
message: `Subject: ${formData.subject}<br /><br />Message: ${formData.message}`,
|
||||
to: "mail@tamilculturewaterloo.org",
|
||||
senderName: "Tamil Culture Waterloo Contact Page",
|
||||
recaptchaToken: captchaToken,
|
||||
};
|
||||
|
||||
try {
|
||||
const res = await axios.post("https://mailserver.metatronnest.com/send", emailData, {
|
||||
headers: { "Content-Type": "application/json" },
|
||||
});
|
||||
|
||||
setAlert({
|
||||
show: true,
|
||||
type: "success",
|
||||
message: res?.data?.message || "Message sent successfully!",
|
||||
});
|
||||
|
||||
setFormData({ name: "", phone: "", email: "", subject: "", message: "" });
|
||||
setCaptchaToken(null);
|
||||
setFormErrors({});
|
||||
} catch {
|
||||
setAlert({
|
||||
show: true,
|
||||
type: "danger",
|
||||
message: "Failed to send message. Please try again later.",
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
if (alert.show) {
|
||||
const timer = setTimeout(() => {
|
||||
setAlert(prev => ({ ...prev, show: false }));
|
||||
}, 5000);
|
||||
return () => clearTimeout(timer);
|
||||
}
|
||||
}, [alert.show]);
|
||||
|
||||
|
||||
return (
|
||||
<Layout headerStyle={1} footerStyle={1}>
|
||||
<div>
|
||||
<div className="inner-page-header" style={{ backgroundImage: 'url(/assets/img/all-images/contact/contact-banner.webp)' }}>
|
||||
<div className="container">
|
||||
<div className="row">
|
||||
<div className="col-lg-12 m-auto">
|
||||
<div className="heading1">
|
||||
<h1>Contact Us</h1>
|
||||
<div className="space20" />
|
||||
<Link href="/">Home <i className="fa-solid fa-angle-right" /> <span>Contact Us</span></Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="space80" />
|
||||
<div className="contact-bg-section">
|
||||
<div className="container">
|
||||
<div className="row">
|
||||
<div className="col-lg-6 col-md-6">
|
||||
<div className="contact-boxarea3 mb-2" data-aos="zoom-in" data-aos-duration={900}>
|
||||
<div className="icons">
|
||||
<img src="/assets/img/icons/mail1.svg" alt="" />
|
||||
</div>
|
||||
<div className="text">
|
||||
<h5>Email</h5>
|
||||
<div className="space14" />
|
||||
<Link href="mailto:mail@tamilculturewaterloo.org">mail@tamilculturewaterloo.org</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-6 col-md-6">
|
||||
<div className="contact-boxarea2" data-aos="zoom-in" data-aos-duration={900}>
|
||||
<div className="icons">
|
||||
<img src="/assets/img/icons/location1.svg" alt="" />
|
||||
</div>
|
||||
<div className="text">
|
||||
<h5>Location</h5>
|
||||
<div className="space14" />
|
||||
<Link href="mailto:mail@tamilculturewaterloo.org">P.O. Box No:25068, Kitchener, Ontario, N2A 4A5, Canada.</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/* <div className="col-lg-4 col-md-6">
|
||||
<div className="contact-boxarea3" data-aos="zoom-in" data-aos-duration={1000}>
|
||||
<div className="icons">
|
||||
<img src="/assets/img/icons/phn1.svg" alt="" />
|
||||
</div>
|
||||
<div className="text">
|
||||
<h5>Call Us</h5>
|
||||
<div className="space14" />
|
||||
<Link href="tel:+11234567890">+1 123 456 7890</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div> */}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="contact-inner-section sp4">
|
||||
<div className="container">
|
||||
<div className="row">
|
||||
<div className="col-lg-6" data-aos="zoom-in" data-aos-duration={1000}>
|
||||
<div className="contact4-boxarea">
|
||||
<h3 className="text-anime-style-3">Get In Touch Now</h3>
|
||||
<div className="space8" />
|
||||
<form onSubmit={handleSubmit}>
|
||||
{alert.show && (
|
||||
<div className={`alert alert-${alert.type}`}>{alert.message}</div>
|
||||
)}
|
||||
<div className="row">
|
||||
<div className="col-lg-6 col-md-6">
|
||||
<div className="input-area">
|
||||
<input type="text" name="name" placeholder="Name" value={formData.name} onChange={handleChange} />
|
||||
{formErrors.name && <small className="text-danger">{formErrors.name}</small>}
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-6 col-md-6">
|
||||
<div className="input-area">
|
||||
<input type="text" name="phone" placeholder="Phone" value={formData.phone} onChange={handleChange} />
|
||||
{formErrors.phone && <small className="text-danger">{formErrors.phone}</small>}
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-12 col-md-6">
|
||||
<div className="input-area">
|
||||
<input type="email" name="email" placeholder="Email" value={formData.email} onChange={handleChange} />
|
||||
{formErrors.email && <small className="text-danger">{formErrors.email}</small>}
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-12 col-md-6">
|
||||
<div className="input-area">
|
||||
<input type="text" name="subject" placeholder="Subjects" value={formData.subject} onChange={handleChange} />
|
||||
{formErrors.subject && <small className="text-danger">{formErrors.subject}</small>}
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-12">
|
||||
<div className="input-area">
|
||||
<textarea name="message" placeholder="Message" value={formData.message} onChange={handleChange} />
|
||||
{formErrors.message && <small className="text-danger">{formErrors.message}</small>}
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-12 mt-2">
|
||||
<ReCAPTCHA
|
||||
sitekey="6Lea8ZYrAAAAAHaghaLjDx_K084IFATZby7Rzqhl"
|
||||
onChange={handleCaptchaChange}
|
||||
/>
|
||||
{formErrors.captcha && <small className="text-danger">{formErrors.captcha}</small>}
|
||||
</div>
|
||||
<div className="col-lg-12">
|
||||
<div className="space24" />
|
||||
<div className="input-area text-end">
|
||||
<button type="submit" className="vl-btn1">Submit Now</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-6">
|
||||
<div className="img1 image-anime">
|
||||
<img
|
||||
src="/assets/img/all-images/contact/contact-1.webp"
|
||||
alt=""
|
||||
style={{ border: 0, width: '100%', height: '620px' }}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="contact2-section">
|
||||
<div className="mapouter">
|
||||
<div className="gmap_canvas">
|
||||
<iframe
|
||||
src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d2886.0622283957745!2d-80.39731242413884!3d43.434476063108!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x882bf3cd7b1f3f11%3A0xc93e0b894c6a8b15!2sKitchener%2C%20ON%20N2A%204A5%2C%20Canada!5e0!3m2!1sen!2sin!4v1720000000000!5m2!1sen!2sin"
|
||||
style={{ border: 0, width: '100%', height: '450px' }}
|
||||
allowFullScreen
|
||||
loading="lazy"
|
||||
referrerPolicy="no-referrer-when-downgrade"
|
||||
></iframe>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</Layout>
|
||||
);
|
||||
}
|
||||
125
components/events/PhotoGallerySection.jsx
Normal file
125
components/events/PhotoGallerySection.jsx
Normal file
@ -0,0 +1,125 @@
|
||||
'use client';
|
||||
import axios from 'axios';
|
||||
import Layout from "@/components/layout/Layout";
|
||||
import Link from "next/link";
|
||||
import { useState, useEffect } from 'react';
|
||||
|
||||
export default function PhotoGallerySection() {
|
||||
const [selectedYear, setSelectedYear] = useState('');
|
||||
const [events, setEvents] = useState([]);
|
||||
const [years, setYears] = useState([]);
|
||||
|
||||
useEffect(() => {
|
||||
getEvents();
|
||||
}, []);
|
||||
|
||||
const getEvents = async () => {
|
||||
try {
|
||||
const eventRes = await axios.get(
|
||||
'https://api.tamilculturewaterloo.org/api/events/'
|
||||
);
|
||||
|
||||
const eventsData = eventRes?.data?.data || [];
|
||||
setEvents(eventsData);
|
||||
|
||||
// Extract unique years & sort (latest first)
|
||||
const uniqueYears = [...new Set(eventsData.map(event => event.year))].sort((a, b) => b - a);
|
||||
setYears(uniqueYears);
|
||||
|
||||
// Default to latest year immediately
|
||||
if (uniqueYears.length > 0) {
|
||||
setSelectedYear(uniqueYears[0]);
|
||||
}
|
||||
} catch (error) {
|
||||
console.log("error fetching data", error);
|
||||
}
|
||||
};
|
||||
|
||||
// Filter events by selected year
|
||||
const filteredEvents = events.filter(event => event.year === selectedYear);
|
||||
|
||||
return (
|
||||
<Layout headerStyle={1} footerStyle={1}>
|
||||
<div>
|
||||
{/* Header Section */}
|
||||
<div
|
||||
className="inner-page-header"
|
||||
style={{ backgroundImage: 'url(/assets/img/event/gallery/gallery-banner.webp)' }}
|
||||
>
|
||||
<div className="container">
|
||||
<div className="row">
|
||||
<div className="col-lg-12 m-auto">
|
||||
<div className="heading1">
|
||||
<h1>Recent Memories</h1>
|
||||
<div className="space20" />
|
||||
<Link href="/">
|
||||
Home <i className="fa-solid fa-angle-right" /> <span>Recent Memories</span>
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Memory Section */}
|
||||
<div className="memory-inner-section-area blog-details-section sp4">
|
||||
<div className="container">
|
||||
<div className="row gx-5">
|
||||
{/* Left Column: Year Tabs */}
|
||||
<div className="col-lg-3 mb-4 mb-lg-0">
|
||||
<div className="blog-auhtor-details sticky-top" style={{ top: "120px" }}>
|
||||
<div className="blog-categories">
|
||||
<ul className="list-unstyled">
|
||||
{years.map((year) => (
|
||||
<li key={year}>
|
||||
<button
|
||||
onClick={() => setSelectedYear(year)}
|
||||
className={`btn w-100 mb-2 category-btn ${selectedYear === year ? 'active' : ''}`}
|
||||
>
|
||||
Year {year}
|
||||
</button>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Right Column: Gallery */}
|
||||
<div className="col-lg-9">
|
||||
<div className="row justify-content-start">
|
||||
{filteredEvents.map((event, idx) => (
|
||||
<div className="col-lg-4 col-md-6 mb-4" key={idx}>
|
||||
<div className="memory3-boxarea">
|
||||
<div className="img1">
|
||||
<img src={event.eventimageurl} alt={event.eventtitle} />
|
||||
</div>
|
||||
<div className="content-area">
|
||||
<p>{event.eventdate}</p>
|
||||
<div className="space12" />
|
||||
<Link href={`/photo-gallery/single-gallery?id=${event.id}`}>
|
||||
{event.eventtitle}
|
||||
</Link>
|
||||
<div className="plus">
|
||||
<Link href={`/photo-gallery/single-gallery?id=${event.id}`}>
|
||||
<i className="fa-solid fa-plus" />
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
{filteredEvents.length === 0 && (
|
||||
<div className="col-12 text-center">
|
||||
<p>No events found for {selectedYear}</p>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</Layout>
|
||||
);
|
||||
}
|
||||
@ -2,92 +2,11 @@
|
||||
import Link from 'next/link'
|
||||
import moment from "moment";
|
||||
import { useState } from "react"
|
||||
import { events } from "@/utility/constant.utils"; // <-- import the events array here
|
||||
|
||||
export default function UpcomingEventData() {
|
||||
const [currentMonth, setCurrentMonth] = useState(moment());
|
||||
|
||||
// Events normalized with YYYY-MM-DD format
|
||||
const events = [
|
||||
{
|
||||
id: 1,
|
||||
date: "2024-01-14",
|
||||
time: "05:30 PM",
|
||||
title: "Thai Pongal 2024",
|
||||
location: "Holy Family Croatian Roman Catholic Parish Hall, Kitchener, Canada",
|
||||
image: "/assets/img/event/upcoming-event/thai-pongal.webp",
|
||||
url: "#",
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
date: "2024-04-14",
|
||||
title: "AGM",
|
||||
location: "Christ Lutheran Church, Waterloo, ON",
|
||||
image: "/assets/img/event/upcoming-event/agm.webp",
|
||||
url: "#",
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
date: "2024-06-22",
|
||||
title: "KW Multicultural Festival",
|
||||
location: "Indian & Sri Lankan Food Court, Victoria Park, Kitchener, ON",
|
||||
image: "/assets/img/event/upcoming-event/kw.webp",
|
||||
url: "#",
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
date: "2024-07-07",
|
||||
time: "10:00 AM",
|
||||
title: "TCA Picnic – Potlock",
|
||||
location: "Pinehurst Lake – Sutor Shelter, Ayr, ON",
|
||||
image: "/assets/img/event/upcoming-event/picnic.webp",
|
||||
url: "#",
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
date: "2024-07-27",
|
||||
title: "South Asian Family Sports Day",
|
||||
location: "Waterloo Park, Waterloo, ON",
|
||||
image: "/assets/img/event/upcoming-event/sports.webp",
|
||||
url: "#",
|
||||
},
|
||||
{
|
||||
id: 6,
|
||||
date: "2023-08-23",
|
||||
time: "06:30-08:30 PM",
|
||||
title: "Conestoga College Workshop",
|
||||
location: "Conestoga College – WC 241, Doon Campus, Ontario",
|
||||
image: "/assets/img/event/upcoming-event/workshop.webp",
|
||||
url: "#",
|
||||
},
|
||||
{
|
||||
id: 7,
|
||||
date: "2023-08-23",
|
||||
time: "06:30-08:30 PM",
|
||||
title: "Tamil Cultural Nite",
|
||||
location: "Doon Campus, Ontario (TBA)",
|
||||
image: "/assets/img/event/upcoming-event/cultural.webp",
|
||||
url: "#",
|
||||
},
|
||||
{
|
||||
id: 8,
|
||||
date: "2024-10-26",
|
||||
time: "1.00 PM-4.30 PM",
|
||||
title: "TCA – WPL Deepavali Celebrations",
|
||||
location: "Waterloo Public Library, John M. Harper Branch",
|
||||
image: "/assets/img/event/upcoming-event/deepavali.webp",
|
||||
url: "#",
|
||||
},
|
||||
{
|
||||
id: 9,
|
||||
date: "2024-12-21",
|
||||
time: "05:00 PM-09:00 PM",
|
||||
title: "Christmas & 2024 Year End Celebration",
|
||||
location: "RIM Park, 2001 University Ave E, Waterloo, ON",
|
||||
image: "/assets/img/event/upcoming-event/christmas.webp",
|
||||
url: "#",
|
||||
},
|
||||
];
|
||||
|
||||
// Get start and end of current month
|
||||
const startOfMonth = currentMonth.clone().startOf("month");
|
||||
const endOfMonth = currentMonth.clone().endOf("month");
|
||||
@ -103,8 +22,22 @@ export default function UpcomingEventData() {
|
||||
|
||||
// Get events for a given date
|
||||
const getEventForDate = (date) => {
|
||||
const dateString = date?.format("YYYY-MM-DD");
|
||||
return events.filter(event => event.date === dateString);
|
||||
if (!date) return [];
|
||||
const dateString = date.format("YYYY-MM-DD");
|
||||
const dateStringDMY = date.format("DD/MM/YYYY");
|
||||
return events.filter(event => {
|
||||
if (!event.date) return false;
|
||||
return event.date === dateString || event.date.includes(dateString) || event.date.includes(dateStringDMY);
|
||||
});
|
||||
};
|
||||
|
||||
const formatEventDate = (dateStr) => {
|
||||
if (!dateStr) return "";
|
||||
|
||||
return dateStr.replace(/\d{4}-\d{2}-\d{2}/g, (date) => {
|
||||
const m = moment(date, "YYYY-MM-DD", true);
|
||||
return m.isValid() ? m.format("ddd, MMM DD, YYYY") : date;
|
||||
});
|
||||
};
|
||||
|
||||
// Navigate months
|
||||
@ -118,7 +51,7 @@ export default function UpcomingEventData() {
|
||||
<div className="row">
|
||||
<div className="col-lg-6 m-auto">
|
||||
<div className="event2-header heading5 text-center space-margin60">
|
||||
<h2 className="text-anime-style-3">Upcoming Events</h2>
|
||||
<h2 className="text-anime-style-3">Events</h2>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -190,19 +123,14 @@ export default function UpcomingEventData() {
|
||||
</table>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<div className="col-lg-9" data-aos="fade-up" data-aos-duration={1000}>
|
||||
|
||||
<div className="tab-content" id="pills-tabContent">
|
||||
<div className={"tab-pane fade show active tab-pane fade"} id="pills-home" role="tabpanel" aria-labelledby="pills-home-tab" tabIndex={0}>
|
||||
<div className="event-widget-area">
|
||||
|
||||
|
||||
|
||||
|
||||
{events.map((event, idx) => {
|
||||
const isEven = (idx + 1) % 2 === 0; // check even/odd index
|
||||
const isEven = (idx + 1) % 2 === 0;
|
||||
const buttonHref = event.url || event.link || "#";
|
||||
const isExternalButton = /^https?:\/\//.test(buttonHref);
|
||||
|
||||
return (
|
||||
<div key={event.id} className="mb-5">
|
||||
@ -212,10 +140,8 @@ export default function UpcomingEventData() {
|
||||
<div className="event2-boxarea box1 d-flex flex-wrap align-items-center">
|
||||
<h1 className="active me-3">{String(idx + 1).padStart(2, "0")}</h1>
|
||||
|
||||
{/* First Event (Odd): Image Left | Even Event: Image Right */}
|
||||
{!isEven ? (
|
||||
<>
|
||||
{/* IMAGE LEFT */}
|
||||
<div className="col-lg-5">
|
||||
<div className="img1">
|
||||
<img src={event.image} alt={event.title} />
|
||||
@ -224,34 +150,48 @@ export default function UpcomingEventData() {
|
||||
|
||||
<div className="col-lg-1" />
|
||||
|
||||
{/* CONTENT RIGHT */}
|
||||
<div className="col-lg-6">
|
||||
<div className="content-area">
|
||||
<ul>
|
||||
<li>
|
||||
<span>
|
||||
<img src="/assets/img/icons/clock1.svg" alt="" />{" "}
|
||||
<span className='d-flex g-3 metered-data'>
|
||||
<img src={event.time ? "/assets/img/icons/clock1.svg" : "/assets/img/icons/calender1.svg"} alt={event.time ? "clock" : "calendar"} />{" "}
|
||||
{event.time ? `${event.time} - ` : ""}
|
||||
{moment(event.date).format("ddd, MMM DD, YYYY")}
|
||||
{formatEventDate(event.date)}
|
||||
</span>
|
||||
</li>
|
||||
{event.location && event.location.trim() && (
|
||||
<li>
|
||||
<span>
|
||||
<span className='d-flex g-3 metered-data'>
|
||||
<img src="/assets/img/icons/location1.svg" alt="" />{" "}
|
||||
{event.location}
|
||||
</span>
|
||||
</li>
|
||||
)}
|
||||
</ul>
|
||||
<div className="space20" />
|
||||
<Link href={event.url || "#"} className="head">
|
||||
{event.title}
|
||||
</Link>
|
||||
<Link href={event.link || "#"} className="head">{event.title}</Link>
|
||||
<div className="space24" />
|
||||
<p>{event.location}</p>
|
||||
<p
|
||||
style={{
|
||||
display: '-webkit-box',
|
||||
WebkitLineClamp: 2,
|
||||
WebkitBoxOrient: 'vertical',
|
||||
overflow: 'hidden',
|
||||
textOverflow: 'ellipsis',
|
||||
}}
|
||||
>
|
||||
{event.desc}
|
||||
</p>
|
||||
|
||||
<div className="space24" />
|
||||
<div className="btn-area1">
|
||||
<Link href={event.url || "#"} className="vl-btn3">
|
||||
<span className="demo">Online Tickets</span>
|
||||
<Link
|
||||
href={buttonHref}
|
||||
className="vl-btn3"
|
||||
{...(isExternalButton ? { target: "_blank", rel: "noopener noreferrer" } : {})}
|
||||
>
|
||||
<span className="demo">{event.btnText || "Online Tickets"}</span>
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
@ -259,34 +199,47 @@ export default function UpcomingEventData() {
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
{/* CONTENT LEFT */}
|
||||
<div className="col-lg-6">
|
||||
<div className="content-area">
|
||||
<ul>
|
||||
<li>
|
||||
<span>
|
||||
<img src="/assets/img/icons/clock1.svg" alt="" />{" "}
|
||||
<span className='d-flex g-3 metered-data'>
|
||||
<img src={event.time ? "/assets/img/icons/clock1.svg" : "/assets/img/icons/calender1.svg"} alt={event.time ? "clock" : "calendar"} />{" "}
|
||||
{event.time ? `${event.time} - ` : ""}
|
||||
{moment(event.date).format("ddd, MMM DD, YYYY")}
|
||||
{formatEventDate(event.date)}
|
||||
</span>
|
||||
</li>
|
||||
{event.location && event.location.trim() && (
|
||||
<li>
|
||||
<span>
|
||||
<span className='d-flex g-3 metered-data'>
|
||||
<img src="/assets/img/icons/location1.svg" alt="" />{" "}
|
||||
{event.location}
|
||||
</span>
|
||||
</li>
|
||||
)}
|
||||
</ul>
|
||||
<div className="space20" />
|
||||
<Link href={event.url || "#"} className="head">
|
||||
{event.title}
|
||||
</Link>
|
||||
<Link href={event.link || "#"} className="head">{event.title}</Link>
|
||||
<div className="space24" />
|
||||
<p>{event.location}</p>
|
||||
<p
|
||||
style={{
|
||||
display: '-webkit-box',
|
||||
WebkitLineClamp: 2,
|
||||
WebkitBoxOrient: 'vertical',
|
||||
overflow: 'hidden',
|
||||
textOverflow: 'ellipsis',
|
||||
}}
|
||||
>
|
||||
{event.desc}
|
||||
</p>
|
||||
<div className="space24" />
|
||||
<div className="btn-area1">
|
||||
<Link href={event.url || "#"} className="vl-btn3">
|
||||
<span className="demo">Online Tickets</span>
|
||||
<Link
|
||||
href={buttonHref}
|
||||
className="vl-btn3"
|
||||
{...(isExternalButton ? { target: "_blank", rel: "noopener noreferrer" } : {})}
|
||||
>
|
||||
<span className="demo">{event.btnText || "Online Tickets"}</span>
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
@ -294,7 +247,6 @@ export default function UpcomingEventData() {
|
||||
|
||||
<div className="col-lg-1" />
|
||||
|
||||
{/* IMAGE RIGHT */}
|
||||
<div className="col-lg-5">
|
||||
<div className="img1">
|
||||
<img src={event.image} alt={event.title} />
|
||||
@ -308,7 +260,6 @@ export default function UpcomingEventData() {
|
||||
</div>
|
||||
);
|
||||
})}
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
154
components/events/UpcomingEventSinglePage.jsx
Normal file
154
components/events/UpcomingEventSinglePage.jsx
Normal file
@ -0,0 +1,154 @@
|
||||
import Layout from "@/components/layout/Layout";
|
||||
import Link from "next/link";
|
||||
import moment from "moment";
|
||||
import { events } from "@/utility/constant.utils";
|
||||
|
||||
const formatEventDate = (dateStr) => {
|
||||
if (!dateStr) return "Details will be announced";
|
||||
|
||||
return dateStr.replace(/\d{4}-\d{2}-\d{2}/g, (date) => {
|
||||
const m = moment(date, "YYYY-MM-DD", true);
|
||||
return m.isValid() ? m.format("MMM D, YYYY") : date;
|
||||
});
|
||||
};
|
||||
|
||||
export default function UpcomingEventSinglePage({ slug }) {
|
||||
const event = events.find((item) => item.slug === slug);
|
||||
|
||||
if (!event) {
|
||||
return null;
|
||||
}
|
||||
|
||||
const eventDate = formatEventDate(event.date);
|
||||
const eventLocation = event.location || "Venue will be confirmed";
|
||||
|
||||
return (
|
||||
<Layout headerStyle={1} footerStyle={1}>
|
||||
<div>
|
||||
<div
|
||||
className="inner-page-header"
|
||||
style={{
|
||||
backgroundImage: "url(/assets/img/event/upcoming-event/upcoming-events-banner.webp)",
|
||||
backgroundSize: "cover",
|
||||
backgroundPosition: "center",
|
||||
}}
|
||||
>
|
||||
<div className="container">
|
||||
<div className="row">
|
||||
<div className="col-lg-12 m-auto">
|
||||
<div className="heading1">
|
||||
<h1>{event.title}</h1>
|
||||
<div className="space20" />
|
||||
<Link href="/">
|
||||
Home <i className="fa-solid fa-angle-right" />{" "}
|
||||
<span>{event.title}</span>
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="blog-details-section sp4 pb-4 mb-4">
|
||||
<div className="container">
|
||||
<div className="row">
|
||||
<div className="col-lg-12">
|
||||
<div className="blog-deatils-content heading2">
|
||||
<div className="about2-header heading4 text-center">
|
||||
<h2 className="text-anime-style-3">{event.title}</h2>
|
||||
<div className="space16" />
|
||||
<p>{event.desc || "More details will be updated soon."}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="about6-section-area sp4 pt-0">
|
||||
<div className="container">
|
||||
<div className="row align-items-center">
|
||||
<div className="col-lg-6 order-2 order-lg-1">
|
||||
<div
|
||||
className="img text-center"
|
||||
style={{
|
||||
background: "#f8f8f8",
|
||||
borderRadius: "8px",
|
||||
padding: "24px",
|
||||
}}
|
||||
>
|
||||
<img
|
||||
src={event.image}
|
||||
alt={event.title}
|
||||
style={{
|
||||
width: "100%",
|
||||
maxWidth: "420px",
|
||||
height: "auto",
|
||||
objectFit: "contain",
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-6 order-1 order-lg-2 mb-5">
|
||||
<div className="about2-header heading4">
|
||||
<h3 className="text-anime-style-3">Event Details</h3>
|
||||
<div className="space16" />
|
||||
<div className="about6-header heading9 space-margin60 mb-4">
|
||||
<ul>
|
||||
<li>Date: {eventDate}</li>
|
||||
</ul>
|
||||
<div className="space18" />
|
||||
<ul>
|
||||
<li>Venue: {eventLocation}</li>
|
||||
</ul>
|
||||
<div className="space18" />
|
||||
<ul>
|
||||
<li>Time: {event.time || "Details will be announced"}</li>
|
||||
</ul>
|
||||
<div className="space18" />
|
||||
{event.admission && (
|
||||
<>
|
||||
<ul>
|
||||
<li>Admission: {event.admission}</li>
|
||||
</ul>
|
||||
<div className="space18" />
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="pricing-lan-section-area sp4 pt-0">
|
||||
<div className="container">
|
||||
<div className="row">
|
||||
<div className="col-lg-10 m-auto">
|
||||
<div className="mission">
|
||||
<div className="heading2 mb-4">
|
||||
<h3>Additional Information</h3>
|
||||
</div>
|
||||
<ul className="list-unstyled">
|
||||
<li className="d-flex mb-3">
|
||||
<img src="/assets/img/icons/check2.svg" alt="" className="me-2" />
|
||||
<span>Program details will be updated as they are confirmed.</span>
|
||||
</li>
|
||||
<li className="d-flex mb-3">
|
||||
<img src="/assets/img/icons/check2.svg" alt="" className="me-2" />
|
||||
<span>Registration or ticket information will be added here when available.</span>
|
||||
</li>
|
||||
<li className="d-flex mb-3">
|
||||
<img src="/assets/img/icons/check2.svg" alt="" className="me-2" />
|
||||
<span>Please check back closer to the event date for final details.</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</Layout>
|
||||
);
|
||||
}
|
||||
@ -19,44 +19,74 @@ export default function HomeHeroBanner() {
|
||||
// image: '/assets/img/all-images/hero/hero-img11.png',
|
||||
// },
|
||||
{
|
||||
title: "Grace moves with vibrant<br />Tradition meets bass",
|
||||
date: 'SERVING',
|
||||
location: 'WATERLOO – KITCHENER – CAMBRIDGE- GUELPH – BRANTFORD AND SURROUNDING AREAS SINCE 1989',
|
||||
bgImage: '/assets/img/home/banner/hero-banner-1.webp',
|
||||
image: '/assets/img/all-images/hero/hero-img12.png',
|
||||
buttonText: "Discover Harmony",
|
||||
buttonLink: "/about",
|
||||
// title: 'Tamil Cultural Nite 2025',
|
||||
// date: 'SERVING',
|
||||
// location: 'WATERLOO – KITCHENER – CAMBRIDGE- GUELPH – BRANTFORD AND SURROUNDING AREAS SINCE 1989',
|
||||
bgImage: '/assets/img/home/banner/banner.webp',
|
||||
mobileBgImage: '/assets/img/home/banner/mobile-banner.jpeg',
|
||||
// image: '/assets/img/all-images/hero/hero-img12.png',
|
||||
// buttonText: "Book Now",
|
||||
// buttonLink: "/upcoming-event/tamil-cultural-nite-2025",
|
||||
},
|
||||
{
|
||||
title: "Crafted with tradition’s<br />Feel rhythm of roots",
|
||||
date: 'SERVING',
|
||||
location: 'WATERLOO – KITCHENER – CAMBRIDGE- GUELPH – BRANTFORD AND SURROUNDING AREAS SINCE 1989',
|
||||
bgImage: '/assets/img/home/banner/hero-banner-2.webp',
|
||||
image: '/assets/img/all-images/hero/hero-img12.png',
|
||||
buttonText: "Heritage Beats",
|
||||
buttonLink: "/upcoming-event",
|
||||
},
|
||||
{
|
||||
title: 'Lighting hearts across<br />A pure blend of spirit',
|
||||
title: 'Tamil Cultural Nite 2025',
|
||||
date: 'SERVING',
|
||||
location: 'WATERLOO – KITCHENER – CAMBRIDGE- GUELPH – BRANTFORD AND SURROUNDING AREAS SINCE 1989',
|
||||
bgImage: '/assets/img/home/banner/hero-banner-3.webp',
|
||||
image: '/assets/img/all-images/hero/hero-img12.png',
|
||||
buttonText: "Radiant Spirit",
|
||||
buttonLink: "/community",
|
||||
buttonText: "Book Now",
|
||||
buttonLink: "/upcoming-event/tamil-cultural-nite-2025",
|
||||
},
|
||||
{
|
||||
title: 'Rooted in deep tradition <br />Echoes of true legacy',
|
||||
title: "Tamil Cultural Nite 2025",
|
||||
date: 'SERVING',
|
||||
location: 'WATERLOO – KITCHENER – CAMBRIDGE- GUELPH – BRANTFORD AND SURROUNDING AREAS SINCE 1989',
|
||||
bgImage: '/assets/img/home/banner/hero-banner-1.webp',
|
||||
image: '/assets/img/all-images/hero/hero-img12.png',
|
||||
buttonText: "Book Now",
|
||||
buttonLink: "/upcoming-event/tamil-cultural-nite-2025",
|
||||
},
|
||||
{
|
||||
title: "Tamil Cultural Nite 2025",
|
||||
date: 'SERVING',
|
||||
location: 'WATERLOO – KITCHENER – CAMBRIDGE- GUELPH – BRANTFORD AND SURROUNDING AREAS SINCE 1989',
|
||||
bgImage: '/assets/img/home/banner/hero-banner-2.webp',
|
||||
image: '/assets/img/all-images/hero/hero-img12.png',
|
||||
buttonText: "Book Now",
|
||||
buttonLink: "/upcoming-event/tamil-cultural-nite-2025",
|
||||
},
|
||||
|
||||
{
|
||||
title: 'Tamil Cultural Nite 2025',
|
||||
date: 'SERVING',
|
||||
location: 'WATERLOO – KITCHENER – CAMBRIDGE- GUELPH – BRANTFORD AND SURROUNDING AREAS SINCE 1989',
|
||||
bgImage: '/assets/img/home/banner/hero-banner-5.webp',
|
||||
image: '/assets/img/all-images/hero/hero-img12.png',
|
||||
buttonText: "Hear Echo",
|
||||
buttonLink: "/tamil-culture",
|
||||
buttonText: "Book Now",
|
||||
buttonLink: "/upcoming-event/tamil-cultural-nite-2025",
|
||||
},
|
||||
];
|
||||
|
||||
return (
|
||||
<>
|
||||
<style dangerouslySetInnerHTML={{__html: `
|
||||
@media (max-width: 600px) {
|
||||
.hero-container-first {
|
||||
padding-top: 200px !important;
|
||||
}
|
||||
}
|
||||
${slideData.map((slide, index) => slide.mobileBgImage ? `
|
||||
@media (max-width: 600px) {
|
||||
.mobile-bg-slide-${index} {
|
||||
background-image: url('${slide.mobileBgImage}') !important;
|
||||
background-position: top center !important;
|
||||
background-size: 100% 93% !important;
|
||||
padding-top: 172px !important;
|
||||
top: 29px !important;
|
||||
position: relative !important;
|
||||
}
|
||||
}` : '').join('\n')}
|
||||
`}} />
|
||||
<Swiper
|
||||
modules={[Autoplay, Navigation, Pagination]}
|
||||
slidesPerView={1}
|
||||
@ -68,7 +98,7 @@ export default function HomeHeroBanner() {
|
||||
{slideData.map((slide, index) => (
|
||||
<SwiperSlide key={index}>
|
||||
<div
|
||||
className="hero9-slider-area"
|
||||
className={"hero9-slider-area " + (slide.mobileBgImage ? "mobile-bg-slide-" + index : "")}
|
||||
style={{
|
||||
backgroundImage: `url(${slide.bgImage})`,
|
||||
backgroundRepeat: 'no-repeat',
|
||||
@ -76,60 +106,56 @@ export default function HomeHeroBanner() {
|
||||
backgroundPosition: 'center bottom',
|
||||
}}
|
||||
>
|
||||
<div className="container">
|
||||
<div className={`container ${index === 0 ? 'hero-container-first' : ''}`} style={index === 0 ? { paddingTop: '180px' } : {}}>
|
||||
<div className="row align-items-center">
|
||||
<div className="col-lg-7">
|
||||
<div className="hero8-header">
|
||||
{slide.title && (
|
||||
<>
|
||||
<h5>
|
||||
{/* <img src="/assets/img/icons/sub-logo1.svg" alt="" /> */}
|
||||
Where Culture Meets the Beat
|
||||
</h5>
|
||||
<div className="space16" />
|
||||
<h1 className="text-anime-style-3" dangerouslySetInnerHTML={{ __html: slide.title || '' }}></h1>
|
||||
<h1 className="text-anime-style-3" dangerouslySetInnerHTML={{ __html: slide.title }}></h1>
|
||||
</>
|
||||
)}
|
||||
<div className="space32" />
|
||||
{slide.buttonLink && slide.buttonText && (
|
||||
<div className="btn-area1">
|
||||
<Link href={slide.buttonLink} className="vl-btn9">
|
||||
<span className="demo">{slide.buttonText}</span>
|
||||
</Link>
|
||||
{/* <Link href="/event-schedule" className="vl-btn9 btn2">
|
||||
<span className="demo">Schedules</span>
|
||||
</Link> */}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/* <div className="col-lg-5">
|
||||
<div className="img1">
|
||||
<img src={slide.image} alt="" />
|
||||
</div>
|
||||
</div> */}
|
||||
</div>
|
||||
{(slide.date || slide.location) && (
|
||||
<div className="row">
|
||||
<div className="col-lg-12">
|
||||
<div className="timer-bg-area">
|
||||
<div className="row d-flex justify-content-center align-items-center" >
|
||||
{/* <div className="col-lg-7">
|
||||
<div className="timer-btn-area">
|
||||
<Countdown style={1} />
|
||||
</div>
|
||||
</div> */}
|
||||
<div className="col-lg-12 text-center d-flex justify-content-center align-items-center">
|
||||
<div className="heading12">
|
||||
<h3>{slide.date}</h3>
|
||||
{/* <div className="space16" /> */}
|
||||
{slide.date && <h3>{slide.date}</h3>}
|
||||
{slide.location && (
|
||||
<p>
|
||||
<img src="/assets/img/icons/location1.svg" alt="" />
|
||||
{slide.location}
|
||||
</p>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</SwiperSlide>
|
||||
))}
|
||||
</Swiper>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
@ -1,12 +1,17 @@
|
||||
'use client'
|
||||
import Link from 'next/link'
|
||||
import { useState } from "react"
|
||||
import { events } from "@/utility/constant.utils" // import your events array
|
||||
|
||||
export default function HomeUpcomingEvent() {
|
||||
const [isTab, setIsTab] = useState(1)
|
||||
const handleTab = (i: number) => {
|
||||
setIsTab(i)
|
||||
}
|
||||
|
||||
// Take only the first 3 events
|
||||
const displayEvents = events.slice(0, 3) as any[];
|
||||
|
||||
return (
|
||||
<>
|
||||
|
||||
@ -15,56 +20,34 @@ export default function HomeUpcomingEvent() {
|
||||
<div className="row">
|
||||
<div className="col-lg-12 m-auto">
|
||||
<div className="event2-header heading5 space-margin60">
|
||||
{/* <h5>Event Schedule</h5>
|
||||
<div className="space18" /> */}
|
||||
<h2 className="text-anime-style-3">Upcoming Events</h2>
|
||||
<h2 className="text-anime-style-3">Events</h2>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="row gx-5">
|
||||
<div className="col-lg-10" data-aos="fade-up" data-aos-duration={1000}>
|
||||
{/* <div className="tabs-button space-margin60">
|
||||
<ul className="nav nav-pills" id="pills-tab" role="tablist">
|
||||
<li className="nav-item" onClick={() => handleTab(1)}>
|
||||
<button className={isTab == 1 ? "nav-link active" : "nav-link"} id="pills-home-tab" data-bs-toggle="pill" data-bs-target="#pills-home" type="button" role="tab" aria-controls="pills-home" aria-selected="true">
|
||||
<span className="calender"><img src="/assets/img/icons/calender2.svg" alt="" /></span>
|
||||
<span className="pl-8">
|
||||
<span className="day">Day One</span>
|
||||
<span className="date">May 25, 2024</span>
|
||||
</span>
|
||||
</button>
|
||||
</li>
|
||||
<li className="nav-item" onClick={() => handleTab(2)}>
|
||||
<button className={isTab == 2 ? "nav-link active" : "nav-link"} id="pills-profile-tab" data-bs-toggle="pill" data-bs-target="#pills-profile" type="button" role="tab" aria-controls="pills-profile" aria-selected="false">
|
||||
<span className="calender"><img src="/assets/img/icons/calender2.svg" alt="" /></span>
|
||||
<span className="pl-8">
|
||||
<span className="day">Day Two</span>
|
||||
<span className="date">May 26, 2024</span>
|
||||
</span>
|
||||
</button>
|
||||
</li>
|
||||
<li className="nav-item" onClick={() => handleTab(3)}>
|
||||
<button className={isTab == 3 ? "nav-link m-0 active" : "nav-link m-0"} id="pills-contact-tab" data-bs-toggle="pill" data-bs-target="#pills-contact" type="button" role="tab" aria-controls="pills-contact" aria-selected="false">
|
||||
<span className="calender"><img src="/assets/img/icons/calender2.svg" alt="" /> </span>
|
||||
<span className="pl-8">
|
||||
<span className="day">Day Three</span>
|
||||
<span className="date">May 27, 2024</span>
|
||||
</span>
|
||||
</button>
|
||||
</li>
|
||||
</ul>
|
||||
</div> */}
|
||||
<div className="tab-content" id="pills-tabContent">
|
||||
<div className={isTab == 1 ? "tab-pane fade show active" : "tab-pane fade"} id="pills-home" role="tabpanel" aria-labelledby="pills-home-tab" tabIndex={0}>
|
||||
<div className="event-widget-area">
|
||||
|
||||
{displayEvents.map((event, idx) => {
|
||||
const buttonHref = event.url || event.link || "#";
|
||||
const isExternalButton = /^https?:\/\//.test(buttonHref);
|
||||
|
||||
return (
|
||||
<div key={event.id}>
|
||||
{idx > 0 && <div className={idx === 2 ? "space30" : "space48"} />}
|
||||
<div className="row">
|
||||
<div className="col-lg-12 m-auto">
|
||||
<div className="event2-boxarea box1">
|
||||
<h1 className="active">01</h1>
|
||||
<h1 className="active">{String(idx + 1).padStart(2, "0")}</h1>
|
||||
<div className="row align-items-center">
|
||||
{/* Alternating layout */}
|
||||
{idx % 2 === 0 ? (
|
||||
<>
|
||||
<div className="col-lg-5">
|
||||
<div className="img1">
|
||||
<img src="/assets/img/home/upcoming-events/upcoming-events-1.webp" alt="" />
|
||||
<img src={event.image} alt={event.title} />
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-1" />
|
||||
@ -72,170 +55,115 @@ export default function HomeUpcomingEvent() {
|
||||
<div className="content-area">
|
||||
<ul>
|
||||
<li>
|
||||
<Link href="/#"><img src="/assets/img/icons/clock1.svg" alt="" />5:30 PM - Sun Jan - 14 <span> | </span></Link>
|
||||
<Link href={event.url || "#"}>
|
||||
<span className='d-flex g-3 metered-data align-items-end'>
|
||||
<img src="/assets/img/icons/clock1.svg" alt="" />
|
||||
{event.time ? event.time + " - " : ""}{event.date}<span> | </span>
|
||||
</span>
|
||||
</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="/#"><img src="/assets/img/icons/location1.svg" alt="" />180 Schweitzer St, Kitchener, Canada </Link>
|
||||
<Link href={event.url || "#"}>
|
||||
<span className='d-flex g-3 metered-data align-items-end'> <img src="/assets/img/icons/location1.svg" alt="" />{event.location}
|
||||
</span>
|
||||
|
||||
</Link>
|
||||
</li>
|
||||
</ul>
|
||||
<div className="space20" />
|
||||
<Link href="#" className="head">Thai Pongal 2024</Link>
|
||||
<Link href={event.link || "#"} className="head">{event.title}</Link>
|
||||
<div className="space24" />
|
||||
<p>Holy Family Croatian Roman Catholic Parish Hall</p>
|
||||
{/* <div className="author-area">
|
||||
<div className="autho-name-area">
|
||||
<div className="img1">
|
||||
<img src="/assets/img/all-images/testimonials/testimonial-img1.png" alt="" />
|
||||
</div>
|
||||
<div className="text">
|
||||
<Link href="/speakers">Alex Roberton</Link>
|
||||
<div className="space8" />
|
||||
<p>UI/UX Designer</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="autho-name-area" style={{ padding: '0 0 0 12px', border: 'none' }}>
|
||||
<div className="img1">
|
||||
<img src="/assets/img/all-images/testimonials/testimonial-img2.png" alt="" />
|
||||
</div>
|
||||
<div className="text">
|
||||
<Link href="/speakers">Alexys Archer</Link>
|
||||
<div className="space8" />
|
||||
<p>WP Developer</p>
|
||||
</div>
|
||||
</div>
|
||||
</div> */}
|
||||
<p
|
||||
style={{
|
||||
display: '-webkit-box',
|
||||
WebkitLineClamp: 1,
|
||||
WebkitBoxOrient: 'vertical',
|
||||
overflow: 'hidden',
|
||||
textOverflow: 'ellipsis',
|
||||
}}
|
||||
>
|
||||
{event.desc}
|
||||
</p>
|
||||
<div className="space24" />
|
||||
<div className="btn-area1">
|
||||
<Link href="#" className="vl-btn3"><span className="demo">purchase ticket</span></Link>
|
||||
<Link
|
||||
href={buttonHref}
|
||||
className="vl-btn3"
|
||||
{...(isExternalButton ? { target: "_blank", rel: "noopener noreferrer" } : {})}
|
||||
>
|
||||
<span className="demo">{event.btnText || "purchase ticket"}</span>
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="space48" />
|
||||
<div className="row">
|
||||
|
||||
<div className="col-lg-12 m-auto">
|
||||
<div className="event2-boxarea box1">
|
||||
<h1 className="active">02</h1>
|
||||
<div className="row align-items-center">
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
<div className="col-lg-6 order-2 order-lg-1">
|
||||
<div className="content-area">
|
||||
<ul>
|
||||
<li>
|
||||
<Link href="/#"><img src="/assets/img/icons/clock1.svg" alt="" />Apr 14, 2024<span> | </span></Link>
|
||||
<Link href={event.url || "#"}>
|
||||
<span className='d-flex g-3 metered-data align-items-end'>
|
||||
<img src="/assets/img/icons/clock1.svg" alt="" />
|
||||
{event.time ? event.time + " - " : ""}{event.date}<span> | </span>
|
||||
</span>
|
||||
</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="/#"><img src="/assets/img/icons/location1.svg" alt="" />Christ Lutheran Church , Waterloo, ON. </Link>
|
||||
<Link href={event.url || "#"}>
|
||||
<span className='d-flex g-3 metered-data align-items-end'> <img src="/assets/img/icons/location1.svg" alt="" />{event.location}
|
||||
</span>
|
||||
|
||||
</Link>
|
||||
</li>
|
||||
</ul>
|
||||
<div className="space20" />
|
||||
<Link href="#" className="head">AGM</Link>
|
||||
<div className="space20" />
|
||||
<p>Christ Lutheran Church , Waterloo, ON.</p>
|
||||
{/* <div className="space24" />
|
||||
<div className="author-area">
|
||||
<div className="autho-name-area">
|
||||
<div className="img1">
|
||||
<img src="/assets/img/all-images/testimonials/testimonial-img1.png" alt="" />
|
||||
</div>
|
||||
<div className="text">
|
||||
<Link href="/speakers">Alex Roberton</Link>
|
||||
<div className="space8" />
|
||||
<p>UI/UX Designer</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="autho-name-area" style={{ padding: '0 0 0 12px', border: 'none' }}>
|
||||
<div className="img1">
|
||||
<img src="/assets/img/all-images/testimonials/testimonial-img2.png" alt="" />
|
||||
</div>
|
||||
<div className="text">
|
||||
<Link href="/speakers">Alexys Archer</Link>
|
||||
<div className="space8" />
|
||||
<p>WP Developer</p>
|
||||
</div>
|
||||
</div>
|
||||
</div> */}
|
||||
<Link href={event.link || "#"} className="head">{event.title}</Link>
|
||||
<div className="space24" />
|
||||
<p
|
||||
style={{
|
||||
display: '-webkit-box',
|
||||
WebkitLineClamp: 1,
|
||||
WebkitBoxOrient: 'vertical',
|
||||
overflow: 'hidden',
|
||||
textOverflow: 'ellipsis',
|
||||
}}
|
||||
>
|
||||
{event.desc}
|
||||
</p>
|
||||
<div className="space24" />
|
||||
<div className="btn-area1">
|
||||
<Link href="#" className="vl-btn3"><span className="demo">purchase ticket</span></Link>
|
||||
<Link
|
||||
href={buttonHref}
|
||||
className="vl-btn3"
|
||||
{...(isExternalButton ? { target: "_blank", rel: "noopener noreferrer" } : {})}
|
||||
>
|
||||
<span className="demo">{event.btnText || "purchase ticket"}</span>
|
||||
</Link>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div className="space30 d-lg-none d-block" />
|
||||
</div>
|
||||
<div className="col-lg-5 order-1 order-lg-2">
|
||||
<div className="img1">
|
||||
<img src="/assets/img/home/upcoming-events/upcoming-events-2.webp" alt="" />
|
||||
<img src={event.image} alt={event.title} />
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="space30" />
|
||||
<div className="row">
|
||||
)
|
||||
})}
|
||||
|
||||
<div className="col-lg-12 m-auto">
|
||||
<div className="event2-boxarea box1">
|
||||
<h1 className="active">03</h1>
|
||||
<div className="row align-items-center">
|
||||
<div className="col-lg-5">
|
||||
<div className="img1">
|
||||
<img src="/assets/img/home/upcoming-events/upcoming-events-3.webp" alt="" />
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-1" />
|
||||
<div className="col-lg-6">
|
||||
<div className="content-area">
|
||||
<ul>
|
||||
<li>
|
||||
<Link href="/#"><img src="/assets/img/icons/clock1.svg" alt="" />Jun 22-23, 2024<span> | </span></Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="/#"><img src="/assets/img/icons/location1.svg" alt="" />Indian & Sri Lankan Food Court, Kitchener.</Link>
|
||||
</li>
|
||||
</ul>
|
||||
<div className="space20" />
|
||||
<Link href="#" className="head">KW Multicultural Festival</Link>
|
||||
<div className="space24" />
|
||||
<p>Indian & Sri Lankan Food Court, Victoria Park, Kitchener, ON.</p>
|
||||
{/* <div className="author-area">
|
||||
<div className="autho-name-area">
|
||||
<div className="img1">
|
||||
<img src="/assets/img/all-images/testimonials/testimonial-img1.png" alt="" />
|
||||
</div>
|
||||
<div className="text">
|
||||
<Link href="/speakers">Alex Roberton</Link>
|
||||
<div className="space8" />
|
||||
<p>UI/UX Designer</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="autho-name-area" style={{ padding: '0 0 0 12px', border: 'none' }}>
|
||||
<div className="img1">
|
||||
<img src="/assets/img/all-images/testimonials/testimonial-img2.png" alt="" />
|
||||
</div>
|
||||
<div className="text">
|
||||
<Link href="/speakers">Alexys Archer</Link>
|
||||
<div className="space8" />
|
||||
<p>WP Developer</p>
|
||||
</div>
|
||||
</div>
|
||||
</div> */}
|
||||
<div className="space24" />
|
||||
<div className="btn-area1">
|
||||
<Link href="#" className="vl-btn3"><span className="demo">purchase ticket</span></Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -243,9 +171,6 @@ export default function HomeUpcomingEvent() {
|
||||
<div className="memory-boxarea pl-3">
|
||||
<div className="img1" data-aos="zoom-in" data-aos-duration={1000} >
|
||||
<img src="/assets/img/home/ad-banner/upcoming-events-ad.webp" alt="" className='mb-3' />
|
||||
{/* <img src="https://tamilculturewaterloo.org/wp-content/uploads/2025/06/2025KWFestposter-1-202x300.jpg" alt="" className='mb-3' />
|
||||
<img src="https://tamilculturewaterloo.org/wp-content/uploads/2025/06/2025KWFestposter-1-202x300.jpg" alt="" /> */}
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -1,9 +1,11 @@
|
||||
'use client'
|
||||
import { useState } from 'react';
|
||||
import Link from 'next/link'
|
||||
import { events } from "@/utility/constant.utils";
|
||||
|
||||
export default function MobileMenu({ isMobileMenu, handleMobileMenu }: any) {
|
||||
const [isAccordion, setIsAccordion] = useState<number | null>(null);
|
||||
const upcomingEvents = events.filter((event: any) => event.link);
|
||||
|
||||
const handleAccordion = (key: any) => {
|
||||
setIsAccordion(prevState => prevState === key ? null : key)
|
||||
@ -104,21 +106,37 @@ export default function MobileMenu({ isMobileMenu, handleMobileMenu }: any) {
|
||||
</li>
|
||||
<li className="has-sub hash-has-sub"><span className={`submenu-button ${isAccordion == 5 ? "submenu-opened" : ""}`} onClick={() => handleAccordion(5)}><em /></span>
|
||||
<Link href="#" className="hash-nav">Events</Link>
|
||||
<ul className={`sub-menu ${isAccordion == 5 ? "open-sub" : ""}`} style={{ display: `${isAccordion == 5 ? "block" : "none"}` }}>
|
||||
<li className="hash-has-sub"><Link href="/upcoming-event" className="hash-nav">Upcoming Event</Link></li>
|
||||
<li className="hash-has-sub"><Link href="/photo-gallery" className="hash-nav">Photos Gallery</Link></li>
|
||||
<ul className={`sub-menu ${isAccordion === 5 ? "open-sub" : ""}`} style={{ display: `${isAccordion === 5 ? "block" : "none"}` }}>
|
||||
<li className={`hash-has-sub ${subAccordion === 1 ? "open-sub" : ""}`}>
|
||||
<Link href="/upcoming-event" className="hash-nav" onClick={() => setSubAccordion(subAccordion === 1 ? 0 : 1)}>
|
||||
Upcoming Event
|
||||
</Link>
|
||||
<ul className={`sub-menu ${subAccordion === 1 ? "open-sub" : ""}`} style={{ display: subAccordion === 1 ? "block" : "none" }}>
|
||||
{upcomingEvents.map((event: any) => (
|
||||
<li key={event.id}>
|
||||
<Link href={event.link} className="hash-nav">
|
||||
{event.title}
|
||||
</Link>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="/photo-gallery" className="hash-nav">Photos Gallery</Link>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li className="has-sub hash-has-sub"><span className={`submenu-button ${isAccordion == 2 ? "submenu-opened" : ""}`} onClick={() => handleAccordion(2)}><em /></span>
|
||||
<Link href="#" className="hash-nav">Registration </Link>
|
||||
<ul className={`sub-menu ${isAccordion == 2 ? "open-sub" : ""}`} style={{ display: `${isAccordion == 2 ? "block" : "none"}` }}>
|
||||
<li className="hash-has-sub"><Link href="/register/membership-2024" className="hash-nav">Membership - 2024</Link></li>
|
||||
<li className="hash-has-sub"><Link href="/register/membership-2025" className="hash-nav">Membership - 2025</Link></li>
|
||||
<li className="hash-has-sub"><Link href="/register/membership-2026" className="hash-nav">Membership - 2026</Link></li>
|
||||
{/* <li className="hash-has-sub"><Link href="/register/membership-2025" className="hash-nav">Membership - 2025</Link></li>
|
||||
<li className="hash-has-sub"><Link href="/register/membership-2024" className="hash-nav">Membership - 2024</Link></li> */}
|
||||
<li className="hash-has-sub"><Link href="/register/thai-pongal-2025" className="hash-nav">Thai Pongal</Link></li>
|
||||
<li className="hash-has-sub"><Link href="/register/tamil-new-year" className="hash-nav">Tamil New Year</Link></li>
|
||||
<li className="hash-has-sub"><Link href="/register/community-picnic" className="hash-nav">Community Picnic</Link></li>
|
||||
<li className="hash-has-sub"><Link href="/register/sports-day" className="hash-nav">Sports Day</Link></li>
|
||||
<li className="hash-has-sub"><Link href="/register/kalai-vizha" className="hash-nav">Kalai Vizha</Link></li>
|
||||
{/* <li className="hash-has-sub"><Link href="/register/kalai-vizha" className="hash-nav">Kalai Vizha</Link></li> */}
|
||||
<li className="hash-has-sub"><Link href="/register/christmas" className="hash-nav">Christmas & Year End</Link></li>
|
||||
<li className="hash-has-sub"><Link href="/register/performance" className="hash-nav">Program Performance Registration</Link></li>
|
||||
<li className="hash-has-sub"><Link href="/register/sponsor" className="hash-nav">Sponsor</Link></li>
|
||||
@ -130,9 +148,9 @@ export default function MobileMenu({ isMobileMenu, handleMobileMenu }: any) {
|
||||
<li className="has-sub hash-has-sub"><span className={`submenu-button ${isAccordion == 4 ? "submenu-opened" : ""}`} onClick={() => handleAccordion(4)}><em /></span>
|
||||
<Link href="/community" className="hash-nav">Community</Link>
|
||||
<ul className={`sub-menu ${isAccordion == 4 ? "open-sub" : ""}`} style={{ display: `${isAccordion == 4 ? "block" : "none"}` }}>
|
||||
<li className="hash-has-sub"><Link href="/community/recipes" className="hash-nav">Recipes</Link></li>
|
||||
<li className="hash-has-sub"><Link href="/community/cricket-club" className="hash-nav">Cricket Club</Link></li>
|
||||
<li className="hash-has-sub"><Link href="/community/badminton-club" className="hash-nav">Badminton Club</Link></li>
|
||||
{/* <li className="hash-has-sub"><Link href="/community/recipes" className="hash-nav">Recipes</Link></li> */}
|
||||
{/* <li className="hash-has-sub"><Link href="/community/cricket-club" className="hash-nav">Cricket Club</Link></li>
|
||||
<li className="hash-has-sub"><Link href="/community/badminton-club" className="hash-nav">Badminton Club</Link></li> */}
|
||||
<li className="hash-has-sub"><Link href="/community/business-directory" className="hash-nav">Business Directory</Link></li>
|
||||
<li className="hash-has-sub"><Link href="/community/tamil-school" className="hash-nav">Tamil School</Link></li>
|
||||
<li className="hash-has-sub"><Link href="/community/global-relief-fund" className="hash-nav">Global Relief Fund</Link></li>
|
||||
|
||||
@ -46,9 +46,9 @@ export default function Footer1() {
|
||||
<div className="link-content quick-links-section">
|
||||
<h3>Community</h3>
|
||||
<ul>
|
||||
<li><Link href="/community/recipes">Recipes</Link></li>
|
||||
<li><Link href="/community/cricket-club">Cricket Club</Link></li>
|
||||
<li><Link href="/community/badminton-club">Badminton Club</Link></li>
|
||||
{/* <li><Link href="/community/recipes">Recipes</Link></li> */}
|
||||
{/* <li><Link href="/community/cricket-club">Cricket Club</Link></li>
|
||||
<li><Link href="/community/badminton-club">Badminton Club</Link></li> */}
|
||||
<li><Link href="/community/business-directory">Business Directory</Link></li>
|
||||
<li><Link href="/community/tamil-school">Tamil School</Link></li>
|
||||
<li><Link href="/community/global-relief-fund">Global Relief Fund</Link></li>
|
||||
|
||||
@ -4,12 +4,14 @@ import Link from "next/link";
|
||||
import React, { useState } from "react";
|
||||
import { Swiper, SwiperSlide } from "swiper/react";
|
||||
import { Autoplay, Pagination } from "swiper/modules";
|
||||
import { events } from "@/utility/constant.utils";
|
||||
import "swiper/css";
|
||||
import "swiper/css/pagination";
|
||||
|
||||
export default function Header1({ scroll, isMobileMenu, handleMobileMenu, isSearch, handleSearch }: any) {
|
||||
|
||||
const [mobileMenu, setMobileMenu] = useState(false);
|
||||
const upcomingEvents = events.filter((event: any) => event.link);
|
||||
|
||||
return (
|
||||
<>
|
||||
@ -235,21 +237,35 @@ export default function Header1({ scroll, isMobileMenu, handleMobileMenu, isSear
|
||||
<li>
|
||||
<Link href="#">Events <i className="fa-solid fa-angle-down" /></Link>
|
||||
<ul className="dropdown-padding">
|
||||
<li><Link href="/upcoming-event">Upcoming Event</Link></li>
|
||||
<li><Link href="/photo-gallery">Photos Gallery</Link></li>
|
||||
|
||||
<li className="dropdown-submenu">
|
||||
<Link href="/upcoming-event">
|
||||
Upcoming Event <i className="fa-solid fa-angle-down" />
|
||||
</Link>
|
||||
<ul className="submenu">
|
||||
{upcomingEvents.map((event: any) => (
|
||||
<li key={event.id}>
|
||||
<Link href={event.link}>
|
||||
{event.title}
|
||||
</Link>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
</li>
|
||||
<li><Link href="/photo-gallery">Photos Gallery</Link></li>
|
||||
</ul>
|
||||
</li>
|
||||
|
||||
<li>
|
||||
<Link href="#">Registration <i className="fa-solid fa-angle-down" /></Link>
|
||||
<ul className="dropdown-padding">
|
||||
<li><Link href="/register/membership-2024">Membership - 2024</Link></li>
|
||||
<li><Link href="/register/membership-2025">Membership - 2025</Link></li>
|
||||
<li><Link href="/register/membership-2026">Membership - 2026</Link></li>
|
||||
{/* <li><Link href="/register/membership-2025">Membership - 2025</Link></li>
|
||||
<li><Link href="/register/membership-2024">Membership - 2024</Link></li> */}
|
||||
<li><Link href="/register/thai-pongal-2025">Thai Pongal</Link></li>
|
||||
<li><Link href="/register/tamil-new-year">Tamil New Year</Link></li>
|
||||
<li><Link href="/register/community-picnic">Community Picnic</Link></li>
|
||||
<li><Link href="/register/sports-day">Sports Day</Link></li>
|
||||
<li><Link href="/register/kalai-vizha">Kalai Vizha</Link></li>
|
||||
{/* <li><Link href="/register/kalai-vizha">Kalai Vizha</Link></li> */}
|
||||
<li><Link href="/register/christmas">Christmas & Year End</Link></li>
|
||||
<li><Link href="/register/performance">Program Performance Registration</Link></li>
|
||||
<li><Link href="/register/sponsor">Sponsor</Link></li>
|
||||
@ -266,9 +282,9 @@ export default function Header1({ scroll, isMobileMenu, handleMobileMenu, isSear
|
||||
<li>
|
||||
<Link href="/community">Community <i className="fa-solid fa-angle-down" /></Link>
|
||||
<ul className="dropdown-padding">
|
||||
<li><Link href="/community/recipes">Recipes</Link></li>
|
||||
<li><Link href="/community/cricket-club">Cricket Club</Link></li>
|
||||
<li><Link href="/community/badminton-club">Badminton Club</Link></li>
|
||||
{/* <li><Link href="/community/recipes">Recipes</Link></li> */}
|
||||
{/* <li><Link href="/community/cricket-club">Cricket Club</Link></li>
|
||||
<li><Link href="/community/badminton-club">Badminton Club</Link></li> */}
|
||||
<li><Link href="/community/business-directory">Business Directory</Link></li>
|
||||
<li><Link href="/community/tamil-school">Tamil School</Link></li>
|
||||
<li><Link href="/community/global-relief-fund">Global Relief Fund</Link></li>
|
||||
@ -317,7 +333,7 @@ export default function Header1({ scroll, isMobileMenu, handleMobileMenu, isSear
|
||||
|
||||
<div className="btn-area1" style={{ marginTop: '10px' }}>
|
||||
<Link
|
||||
href="/register/membership-2025"
|
||||
href="/register/membership-2026"
|
||||
className="vl-btn9"
|
||||
style={{
|
||||
fontSize: '18px',
|
||||
|
||||
@ -17,7 +17,7 @@ export default function Section1() {
|
||||
</div>
|
||||
</div>
|
||||
<div className="row">
|
||||
<div className="col-lg-6">
|
||||
{/* <div className="col-lg-6">
|
||||
<div className="h-100 w-100">
|
||||
<div className="row h-100">
|
||||
<div className="flex_column av-cx34h4-a8d3062fb9de0a0faadd0da67fb825e0 av_one_half avia-builder-el-0 el_before_av_one_half avia-builder-el-first first flex_column_div av-zero-column-padding h-100">
|
||||
@ -59,21 +59,21 @@ export default function Section1() {
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div> */}
|
||||
|
||||
|
||||
|
||||
<div className="col-lg-6">
|
||||
{/* <div className="col-lg-6">
|
||||
<div className="about6-header heading9">
|
||||
{/* <h5 data-aos="fade-left" data-aos-duration={700}><img src="/assets/img/icons/sub-logo1.svg" alt="" />About Summit</h5> */}
|
||||
{/* <div className="space20" /> */}
|
||||
<h5 data-aos="fade-left" data-aos-duration={700}><img src="/assets/img/icons/sub-logo1.svg" alt="" />About Summit</h5>
|
||||
<div className="space20" />
|
||||
|
||||
<div className="img right-img">
|
||||
<img src="/assets/img/online/christmas-year-end/christmas-1.webp" alt="" />
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div> */}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -17,7 +17,7 @@ export default function Section1() {
|
||||
</div>
|
||||
</div>
|
||||
<div className="row">
|
||||
<div className="col-lg-6">
|
||||
{/* <div className="col-lg-6">
|
||||
<div className="h-100 w-100">
|
||||
<div className="row h-100">
|
||||
<div className="flex_column av-cx34h4-a8d3062fb9de0a0faadd0da67fb825e0 av_one_half avia-builder-el-0 el_before_av_one_half avia-builder-el-first first flex_column_div av-zero-column-padding h-100">
|
||||
@ -58,22 +58,22 @@ export default function Section1() {
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div> */}
|
||||
|
||||
|
||||
|
||||
|
||||
<div className="col-lg-6">
|
||||
{/* <div className="col-lg-6">
|
||||
<div className="about6-header heading9">
|
||||
{/* <h5 data-aos="fade-left" data-aos-duration={700}><img src="/assets/img/icons/sub-logo1.svg" alt="" />About Summit</h5> */}
|
||||
{/* <div className="space20" /> */}
|
||||
<h5 data-aos="fade-left" data-aos-duration={700}><img src="/assets/img/icons/sub-logo1.svg" alt="" />About Summit</h5>
|
||||
<div className="space20" />
|
||||
|
||||
<div className="img right-img">
|
||||
<img src="/assets/img/online/community-picnic/picnic-1.webp" alt="" />
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div> */}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -17,7 +17,7 @@ export default function Section1() {
|
||||
</div>
|
||||
</div>
|
||||
<div className="row">
|
||||
<div className="col-lg-6">
|
||||
{/* <div className="col-lg-6">
|
||||
<div
|
||||
style={{
|
||||
position: "relative",
|
||||
@ -41,20 +41,20 @@ export default function Section1() {
|
||||
scrolling="no"
|
||||
></iframe>
|
||||
</div>
|
||||
</div>
|
||||
</div> */}
|
||||
|
||||
|
||||
|
||||
<div className="col-lg-6">
|
||||
{/* <div className="col-lg-6">
|
||||
<div className="about6-header heading9">
|
||||
{/* <h5 data-aos="fade-left" data-aos-duration={700}><img src="/assets/img/icons/sub-logo1.svg" alt="" />About Summit</h5> */}
|
||||
{/* <div className="space20" /> */}
|
||||
<h5 data-aos="fade-left" data-aos-duration={700}><img src="/assets/img/icons/sub-logo1.svg" alt="" />About Summit</h5>
|
||||
<div className="space20" />
|
||||
|
||||
<div className="img right-img">
|
||||
<img src="/assets/img/online/membership-2024/section1.webp" alt="" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div> */}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -17,7 +17,7 @@ export default function Section1() {
|
||||
</div>
|
||||
</div>
|
||||
<div className="row">
|
||||
<div className="col-lg-6">
|
||||
{/* <div className="col-lg-6">
|
||||
<div
|
||||
style={{
|
||||
position: "relative",
|
||||
@ -49,20 +49,20 @@ export default function Section1() {
|
||||
></iframe>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div> */}
|
||||
|
||||
|
||||
|
||||
<div className="col-lg-6">
|
||||
{/* <div className="col-lg-6">
|
||||
<div className="about6-header heading9">
|
||||
{/* <h5 data-aos="fade-left" data-aos-duration={700}><img src="/assets/img/icons/sub-logo1.svg" alt="" />About Summit</h5> */}
|
||||
{/* <div className="space20" /> */}
|
||||
<h5 data-aos="fade-left" data-aos-duration={700}><img src="/assets/img/icons/sub-logo1.svg" alt="" />About Summit</h5>
|
||||
<div className="space20" />
|
||||
|
||||
<div className="img right-img">
|
||||
<img src="/assets/img/online/membership-2025/membership-2025-1.webp"alt="" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div> */}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
63
components/online/membership2026/Section1.jsx
Normal file
63
components/online/membership2026/Section1.jsx
Normal file
@ -0,0 +1,63 @@
|
||||
|
||||
import Link from 'next/link'
|
||||
|
||||
export default function Section1() {
|
||||
return (
|
||||
<>
|
||||
|
||||
<div className="about6-section-area sp4">
|
||||
<div className="container">
|
||||
<div className="row">
|
||||
<div className="col-lg-12">
|
||||
<div className="event2-header heading5 space-margin60 text-center ">
|
||||
<h2>Annual Membership-2026</h2>
|
||||
<div className="space18" />
|
||||
<p>By Tamil Cultural Association of Waterloo Region</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="row">
|
||||
<div className="col-lg-6">
|
||||
<div
|
||||
style={{
|
||||
position: "relative",
|
||||
width: "100%",
|
||||
height: "auto",
|
||||
overflow: "visible",
|
||||
}}
|
||||
>
|
||||
<iframe
|
||||
title="Donation form powered by Zeffy"
|
||||
className='annual-membership'
|
||||
src="https://www.zeffy.com/en-CA/ticketing/tca-annual-membership--2026"
|
||||
style={{
|
||||
width: "100%",
|
||||
height: "1250px",
|
||||
border: "0",
|
||||
}}
|
||||
allow="payment *"
|
||||
/>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<div className="col-lg-6">
|
||||
<div className="about6-header heading9">
|
||||
{/* <h5 data-aos="fade-left" data-aos-duration={700}><img src="/assets/img/icons/sub-logo1.svg" alt="" />About Summit</h5> */}
|
||||
{/* <div className="space20" /> */}
|
||||
|
||||
<div className="img right-img">
|
||||
<img src="/assets/img/online/membership-2026/membership-2026-1.webp" alt="" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</>
|
||||
)
|
||||
}
|
||||
42
components/online/membership2026/Section2.jsx
Normal file
42
components/online/membership2026/Section2.jsx
Normal file
@ -0,0 +1,42 @@
|
||||
|
||||
import Link from 'next/link'
|
||||
|
||||
export default function Section2() {
|
||||
return (
|
||||
<>
|
||||
|
||||
<div className="about6-section-area">
|
||||
<div className="container">
|
||||
|
||||
<div className="row">
|
||||
<div className="col-lg-6 order-2 order-lg-1">
|
||||
<div className="img">
|
||||
<img src="/assets/img/online/membership-2026/membership-2026-2.webp" alt="" />
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-6 order-1 order-lg-2 mb-5">
|
||||
<div className="about6-header heading9 space-margin60 mb-4">
|
||||
<p>Thank you very much for joining the TCA family. With this membership you and your family are opening yourselves up to a series of programs and services offered by us. As members you will also receive admission to some free events and discounts on tickets. Community volunteer and networking will be part of the package.</p>
|
||||
<div className="space18" />
|
||||
<p>Please note that our memberships are renewable each year during the month of January. The membership fee covers the calendar year, January 01 to December 31. We invite you to purchase your membership in the month of January to get the most value. Membership card is also available for print. The fee for your family membership or single person is $20 . Student under 18 is $15.</p>
|
||||
<div className="space18" />
|
||||
|
||||
<ul>
|
||||
<li>Membership Period: January 1st to December 31st.</li>
|
||||
</ul>
|
||||
<div className="space18" />
|
||||
<p>Tamil Cultural Association of Waterloo Region is registered non profit community organisation. Ontario Corporation # 1509837. It was established in 1989 in the region of Waterloo, Ontario, Canada. Visit our website for more information.</p>
|
||||
|
||||
<div className="space18" />
|
||||
<ul>
|
||||
<li> Note: Zeffy is a third party Canadian payment platform. Accessing will be subjected to Zeffy’s terms and conditions policy.</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</>
|
||||
)
|
||||
}
|
||||
44
components/online/membership2026/Section3.jsx
Normal file
44
components/online/membership2026/Section3.jsx
Normal file
@ -0,0 +1,44 @@
|
||||
'use client'
|
||||
import Lightbox from "yet-another-react-lightbox";
|
||||
import "yet-another-react-lightbox/styles.css";
|
||||
import { images } from "@/utility/constant.utils";
|
||||
import { useState } from "react";
|
||||
|
||||
export default function Section3() {
|
||||
// Show only images with id 1 to 4
|
||||
const selectedImages = images.filter(img => +img.id >= 49 && +img.id <= 52);
|
||||
|
||||
const [open, setOpen] = useState(false);
|
||||
const [index, setIndex] = useState(0);
|
||||
|
||||
return (
|
||||
<div className="about6-section-area sp4">
|
||||
<div className="container-fluid">
|
||||
<div className="row align-items-center">
|
||||
{selectedImages.map((img, i) => (
|
||||
<div className="col-lg-3 col-md-3 col-sm-12 col-6 event-img" key={img.id}>
|
||||
<div
|
||||
className="memory-boxarea pl-3"
|
||||
style={{ cursor: "pointer" }}
|
||||
onClick={() => {
|
||||
setIndex(i);
|
||||
setOpen(true);
|
||||
}}
|
||||
>
|
||||
<div className="image" data-aos="zoom-in" data-aos-duration={1000}>
|
||||
<img src={img.src} alt={img.alt} style={{ width: "100%", borderRadius: 8 }} />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
<Lightbox
|
||||
open={open}
|
||||
close={() => setOpen(false)}
|
||||
slides={selectedImages}
|
||||
index={index}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@ -17,7 +17,7 @@ export default function Section1() {
|
||||
</div>
|
||||
</div>
|
||||
<div className="row">
|
||||
<div className="col-lg-6">
|
||||
{/* <div className="col-lg-6">
|
||||
<div className="h-100 w-100">
|
||||
<div className="row h-100">
|
||||
<div className="flex_column av-cx34h4-a8d3062fb9de0a0faadd0da67fb825e0 av_one_half avia-builder-el-0 el_before_av_one_half avia-builder-el-first first flex_column_div av-zero-column-padding h-100">
|
||||
@ -58,21 +58,21 @@ export default function Section1() {
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div> */}
|
||||
|
||||
|
||||
|
||||
<div className="col-lg-6">
|
||||
{/* <div className="col-lg-6">
|
||||
<div className="about6-header heading9">
|
||||
{/* <h5 data-aos="fade-left" data-aos-duration={700}><img src="/assets/img/icons/sub-logo1.svg" alt="" />About Summit</h5> */}
|
||||
{/* <div className="space20" /> */}
|
||||
<h5 data-aos="fade-left" data-aos-duration={700}><img src="/assets/img/icons/sub-logo1.svg" alt="" />About Summit</h5>
|
||||
<div className="space20" />
|
||||
|
||||
<div className="img right-img">
|
||||
<img src="/assets/img/online/program-performance-registration/ppr-1.webp" alt="" />
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div> */}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -17,7 +17,7 @@ export default function Section1() {
|
||||
</div>
|
||||
</div>
|
||||
<div className="row">
|
||||
<div className="col-lg-6">
|
||||
{/* <div className="col-lg-6">
|
||||
<div className="h-100 w-100">
|
||||
<div className="row h-100">
|
||||
<div className="flex_column av-cx34h4-a8d3062fb9de0a0faadd0da67fb825e0 av_one_half avia-builder-el-0 el_before_av_one_half avia-builder-el-first first flex_column_div av-zero-column-padding h-100">
|
||||
@ -57,20 +57,20 @@ export default function Section1() {
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div> */}
|
||||
|
||||
|
||||
<div className="col-lg-6">
|
||||
{/* <div className="col-lg-6">
|
||||
<div className="about6-header heading9">
|
||||
{/* <h5 data-aos="fade-left" data-aos-duration={700}><img src="/assets/img/icons/sub-logo1.svg" alt="" />About Summit</h5> */}
|
||||
{/* <div className="space20" /> */}
|
||||
<h5 data-aos="fade-left" data-aos-duration={700}><img src="/assets/img/icons/sub-logo1.svg" alt="" />About Summit</h5>
|
||||
<div className="space20" />
|
||||
|
||||
<div className="img2 right-img">
|
||||
<img src="/assets/img/online/whats-app/whatsapp-1.webp" alt="" />
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div> */}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
|
||||
'use client'
|
||||
import Link from 'next/link'
|
||||
|
||||
export default function Section2() {
|
||||
@ -8,35 +8,204 @@ export default function Section2() {
|
||||
<div className="about6-section-area">
|
||||
<div className="container">
|
||||
|
||||
<div className="row">
|
||||
{/* Row 1: Left Image, Right Content (Guidelines 1, 2, 3) */}
|
||||
<div className="row align-items-center">
|
||||
<div className="col-lg-6 order-2 order-lg-1">
|
||||
<div className="img">
|
||||
<img src="/assets/img/online/whats-app/whatsapp-2.webp" alt="" />
|
||||
<img src="/assets/img/online/whats-app/section-1.webp" alt="" />
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-6 order-1 order-lg-2 mb-5">
|
||||
<div className="about6-header heading9 space-margin60 mb-4">
|
||||
<h3>Tamil Cultural Association Of Waterloo – WhatsApp</h3>
|
||||
<p style={{ fontWeight: 'bold' }}>வணக்கம்.</p>
|
||||
<div className="space12" />
|
||||
<h3>WhatsApp Group Policy for the Tamil Cultural Association (Waterloo Region)</h3>
|
||||
<div className='text-start' />
|
||||
<div className="space18" />
|
||||
<p>Thank you all for your continued patronage, as our group is actively growing, we have noticed that the capacity of this WhatsApp group has reached its maximum limit.</p>
|
||||
<div className="space18" />
|
||||
|
||||
<p style={{ fontWeight: 'bold' }}>Dear Community Members,</p>
|
||||
<div className="space12" />
|
||||
<p>
|
||||
As everyone is aware this WhatsApp group is only to serve the Tamil community in Waterloo Region. We humbly request anyone who has moved out of the region or not residing in Waterloo region to help us make room in the group.
|
||||
We are delighted to have over 700 members in our WhatsApp group, which has been created with the goal of supporting each other, sharing positive experiences, and fostering a sense of belonging within our Tamil community here in the Waterloo region.
|
||||
</p>
|
||||
<div className="space12" />
|
||||
<p>
|
||||
To maintain the friendly and supportive environment we all enjoy, we request that everyone adheres to the following guidelines:
|
||||
</p>
|
||||
|
||||
<div className="space18" />
|
||||
<p>
|
||||
We are in the process of validating the group members and request your cooperation, and will be reaching out to everyone in the group to get few details through online forms. Please arrange to provide all the information in the forms before Jun 05, 2024 12PM EST. This clean up process is going to take time and effort of our volunteers, If your details are not in the forms, then it will be assumed to be out of region and we will make room in the group. Thanks in advance for your understanding and cooperation.
|
||||
</p>
|
||||
<div className="space18" />
|
||||
<ul>
|
||||
<li>Note: Zeffy is a third party Canadian payment platform. Accessing will be subjected to Zeffy’s terms and conditions policy.</li>
|
||||
<div className="space24" />
|
||||
|
||||
<div className="policy-point mb-4">
|
||||
<h4 className="textured">1. Respectful and Positive Communication</h4>
|
||||
<div className="space8" />
|
||||
<ul className="dot-list" style={{ margin: '15px 0' }}>
|
||||
<li style={{ fontSize: '18px', fontWeight: '500', color: '#000000cf', lineHeight: '28px', background: 'transparent', padding: '0' }}>
|
||||
This group is a platform for supporting each other, sharing knowledge, and spreading happiness.
|
||||
</li>
|
||||
<li style={{ fontSize: '18px', fontWeight: '500', color: '#000000cf', lineHeight: '28px', background: 'transparent', padding: '0' }}>
|
||||
Kindness and respect should guide every conversation. Please be mindful of your words and how they might affect others.
|
||||
</li>
|
||||
<li style={{ fontSize: '18px', fontWeight: '500', color: '#000000cf', lineHeight: '28px', background: 'transparent', padding: '0' }}>
|
||||
Negative, offensive, or hurtful comments will not be tolerated. We aim to create an uplifting environment for all members.
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div className="policy-point mb-4">
|
||||
<h4 className="textured">2. No Political or Divisive Content</h4>
|
||||
<div className="space8" />
|
||||
<ul className="dot-list" style={{ margin: '15px 0' }}>
|
||||
<li style={{ fontSize: '18px', fontWeight: '500', color: '#000000cf', lineHeight: '28px', background: 'transparent', padding: '0' }}>
|
||||
Political discussions, controversial opinions, and divisive messages are not allowed in the group. We are here to focus on community building and fostering positive connections, not to engage in political debates.
|
||||
</li>
|
||||
<li style={{ fontSize: '18px', fontWeight: '500', color: '#000000cf', lineHeight: '28px', background: 'transparent', padding: '0' }}>
|
||||
If you wish to share personal political opinions, please do so in private conversations, not in the group.
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div className="policy-point mb-4">
|
||||
<h4 className="textured">3. Relevant Information Only</h4>
|
||||
<div className="space8" />
|
||||
<ul className="dot-list" style={{ margin: '15px 0' }}>
|
||||
<li style={{ fontSize: '18px', fontWeight: '500', color: '#000000cf', lineHeight: '28px', background: 'transparent', padding: '0' }}>
|
||||
Please keep posts relevant to the Tamil community and the purpose of the group. This includes cultural events, local services, helpful resources, and general support.
|
||||
</li>
|
||||
<li style={{ fontSize: '18px', fontWeight: '500', color: '#000000cf', lineHeight: '28px', background: 'transparent', padding: '0' }}>
|
||||
Advertisements or promotional content unrelated to the group's mission should be avoided. If you have something valuable to share, please reach out to the group admins for approval before posting. <strong>If you are promoting your own small/established business - please post only on Thursdays. If it is posted on other days it will be deleted.</strong>
|
||||
</li>
|
||||
<li style={{ fontSize: '18px', fontWeight: '500', color: '#000000cf', lineHeight: '28px', background: 'transparent', padding: '0' }}>
|
||||
Customers should follow the complaint process with the company they are dealing with. <strong>No open feedback or negative posts against any business or personals.</strong>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="space60" />
|
||||
|
||||
{/* Row 2: Left Content (Guidelines 4, 5, 6, Benefits, Closing), Right Image */}
|
||||
<div className="row align-items-center">
|
||||
<div className="col-lg-6 mb-5">
|
||||
<div className="about6-header heading9 mb-4">
|
||||
<div className="policy-point mb-4">
|
||||
<h4 className="textured">4. No Spamming or Forwarding Unverified Information</h4>
|
||||
<div className="space8" />
|
||||
<ul className="dot-list" style={{ margin: '15px 0' }}>
|
||||
<li style={{ fontSize: '18px', fontWeight: '500', color: '#000000cf', lineHeight: '28px', background: 'transparent', padding: '0' }}>
|
||||
To maintain trust and clarity, please avoid forwarding messages from unknown sources or rumors, especially if they are unverified. Misinformation can create confusion and negativity in the group.
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div className="policy-point mb-4">
|
||||
<h4 className="textured">5. Privacy and Confidentiality</h4>
|
||||
<div className="space8" />
|
||||
<ul className="dot-list" style={{ margin: '15px 0' }}>
|
||||
<li style={{ fontSize: '18px', fontWeight: '500', color: '#000000cf', lineHeight: '28px', background: 'transparent', padding: '0' }}>
|
||||
Respect the privacy of fellow members. Do not share personal information or images without permission.
|
||||
</li>
|
||||
<li style={{ fontSize: '18px', fontWeight: '500', color: '#000000cf', lineHeight: '28px', background: 'transparent', padding: '0' }}>
|
||||
Be aware that this group is a space for open communication, but personal details should remain confidential unless explicitly stated otherwise.
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div className="policy-point mb-4">
|
||||
<h4 className="textured">6. Respect Admin’s Authority</h4>
|
||||
<div className="space8" />
|
||||
<ul className="dot-list" style={{ margin: '15px 0' }}>
|
||||
<li style={{ fontSize: '18px', fontWeight: '500', color: '#000000cf', lineHeight: '28px', background: 'transparent', padding: '0' }}>
|
||||
Our group admins are here to ensure the smooth functioning of the group and to uphold the policies. If a message or member violates any of the above rules, admins reserve the right to issue a warning or remove members from the group as necessary.
|
||||
</li>
|
||||
<li style={{ fontSize: '18px', fontWeight: '500', color: '#000000cf', lineHeight: '28px', background: 'transparent', padding: '0' }}>
|
||||
If you feel a message is inappropriate, please report it to an admin instead of engaging directly. This helps maintain a peaceful environment.
|
||||
</li>
|
||||
<li style={{ fontSize: '18px', fontWeight: '500', color: '#000000cf', lineHeight: '28px', background: 'transparent', padding: '0' }}>
|
||||
Admins has rights to delete any inappropriate or office message.
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div className="space32" />
|
||||
<h3>Benefits of Being Part of This Group</h3>
|
||||
<div className="space18" />
|
||||
|
||||
<ul className="dot-list" style={{ margin: '15px 0' }}>
|
||||
<li style={{ fontSize: '18px', fontWeight: '500', color: '#000000cf', lineHeight: '28px', background: 'transparent', padding: '0' }}>
|
||||
<strong>Support Network:</strong> This group provides a space to seek and offer help in times of need – whether it's advice, resources, or simply a listening ear.
|
||||
</li>
|
||||
<li style={{ fontSize: '18px', fontWeight: '500', color: '#000000cf', lineHeight: '28px', background: 'transparent', padding: '0' }}>
|
||||
<strong>Cultural Connection:</strong> Stay informed about cultural events, celebrations, and activities that bring our community together.
|
||||
</li>
|
||||
<li style={{ fontSize: '18px', fontWeight: '500', color: '#000000cf', lineHeight: '28px', background: 'transparent', padding: '0' }}>
|
||||
<strong>Positive Environment:</strong> Our goal is to maintain a space where people feel welcomed, valued, and respected. When we all contribute positively, the group becomes a much more enriching place for everyone.
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<div className="space24" />
|
||||
|
||||
<p>We appreciate your cooperation in following these guidelines, and we thank you for being part of our vibrant and growing community. Together, we can continue to spread happiness, share knowledge, and build a stronger connection among our members.</p>
|
||||
<div className="space12" />
|
||||
<p>If you have any questions or concerns, feel free to reach out to the group admins directly.</p>
|
||||
<div className="space12" />
|
||||
<p>Thank you!</p>
|
||||
<div className="space12" />
|
||||
<p style={{ fontWeight: 'bold' }}>வாழ்க தமிழ்</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-6">
|
||||
<div className="img">
|
||||
<img src="/assets/img/online/whats-app/section-2.webp" alt="" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Full-width centered Join WhatsApp Button */}
|
||||
<div className="row">
|
||||
<div className="col-12">
|
||||
<a
|
||||
href="https://www.zeffy.com/en-CA/ticketing/f0e92379-696f-4788-bc41-fd38007ed97c"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
style={{
|
||||
display: 'inline-flex',
|
||||
alignItems: 'center',
|
||||
gap: '14px',
|
||||
backgroundColor: '#25D366',
|
||||
color: '#ffffff',
|
||||
fontFamily: 'inherit',
|
||||
fontSize: '12px',
|
||||
fontWeight: '700',
|
||||
padding: '10px 25px',
|
||||
borderRadius: '50px',
|
||||
textDecoration: 'none',
|
||||
boxShadow: '0 8px 28px rgba(37,211,102,0.40)',
|
||||
transition: 'all 0.3s ease',
|
||||
letterSpacing: '0.5px',
|
||||
}}
|
||||
onMouseEnter={e => {
|
||||
e.currentTarget.style.backgroundColor = '#1ebe5d';
|
||||
e.currentTarget.style.boxShadow = '0 12px 36px rgba(37,211,102,0.55)';
|
||||
e.currentTarget.style.transform = 'translateY(-3px)';
|
||||
}}
|
||||
onMouseLeave={e => {
|
||||
e.currentTarget.style.backgroundColor = '#25D366';
|
||||
e.currentTarget.style.boxShadow = '0 8px 28px rgba(37,211,102,0.40)';
|
||||
e.currentTarget.style.transform = 'translateY(0)';
|
||||
}}
|
||||
>
|
||||
{/* Official WhatsApp Icon */}
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="30" height="30" viewBox="0 0 24 24" fill="white">
|
||||
<path d="M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.008-.371-.01-.57-.01-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347m-5.421 7.403h-.004a9.87 9.87 0 01-5.031-1.378l-.361-.214-3.741.982.998-3.648-.235-.374a9.86 9.86 0 01-1.51-5.26c.001-5.45 4.436-9.884 9.888-9.884 2.64 0 5.122 1.03 6.988 2.898a9.825 9.825 0 012.893 6.994c-.003 5.45-4.437 9.884-9.885 9.884m8.413-18.297A11.815 11.815 0 0012.05 0C5.495 0 .16 5.335.157 11.892c0 2.096.547 4.142 1.588 5.945L.057 24l6.305-1.654a11.882 11.882 0 005.683 1.448h.005c6.554 0 11.89-5.335 11.893-11.893a11.821 11.821 0 00-3.48-8.413z"/>
|
||||
</svg>
|
||||
Join Our WhatsApp Group
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
)
|
||||
|
||||
@ -112,7 +112,7 @@ export default function Section1() {
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="about6-section-area">
|
||||
{/* <div className="about6-section-area">
|
||||
<div className="container">
|
||||
<div className="row">
|
||||
<div className="col-lg-6">
|
||||
@ -158,7 +158,7 @@ export default function Section1() {
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div> */}
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
@ -17,7 +17,7 @@ export default function Section1() {
|
||||
</div>
|
||||
</div>
|
||||
<div className="row">
|
||||
<div className="col-lg-6">
|
||||
{/* <div className="col-lg-6">
|
||||
<div className="h-100 w-100">
|
||||
<div className="row h-100">
|
||||
<div className="flex_column av-cx34h4-a8d3062fb9de0a0faadd0da67fb825e0 av_one_half avia-builder-el-0 el_before_av_one_half avia-builder-el-first first flex_column_div av-zero-column-padding h-100">
|
||||
@ -58,20 +58,20 @@ export default function Section1() {
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div> */}
|
||||
|
||||
|
||||
<div className="col-lg-6">
|
||||
{/* <div className="col-lg-6">
|
||||
<div className="about6-header heading9">
|
||||
{/* <h5 data-aos="fade-left" data-aos-duration={700}><img src="/assets/img/icons/sub-logo1.svg" alt="" />About Summit</h5> */}
|
||||
{/* <div className="space20" /> */}
|
||||
<h5 data-aos="fade-left" data-aos-duration={700}><img src="/assets/img/icons/sub-logo1.svg" alt="" />About Summit</h5>
|
||||
<div className="space20" />
|
||||
|
||||
<div className="img right-img">
|
||||
<img src="/assets/img/online/sports-day/sports-1.webp" alt="" />
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div> */}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -17,7 +17,7 @@ export default function Section1() {
|
||||
</div>
|
||||
</div>
|
||||
<div className="row">
|
||||
<div className="col-lg-6">
|
||||
{/* <div className="col-lg-6">
|
||||
<div
|
||||
style={{
|
||||
position: "relative",
|
||||
@ -47,21 +47,21 @@ export default function Section1() {
|
||||
data-load-mode="1"
|
||||
></iframe>
|
||||
</div>
|
||||
</div>
|
||||
</div> */}
|
||||
|
||||
|
||||
|
||||
<div className="col-lg-6">
|
||||
{/* <div className="col-lg-6">
|
||||
<div className="about6-header heading9">
|
||||
{/* <h5 data-aos="fade-left" data-aos-duration={700}><img src="/assets/img/icons/sub-logo1.svg" alt="" />About Summit</h5> */}
|
||||
{/* <div className="space20" /> */}
|
||||
<h5 data-aos="fade-left" data-aos-duration={700}><img src="/assets/img/icons/sub-logo1.svg" alt="" />About Summit</h5>
|
||||
<div className="space20" />
|
||||
|
||||
<div className="img right-img">
|
||||
<img src="/assets/img/online/new-year/tamil-new-year-1.webp" alt="" />
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div> */}
|
||||
</div>
|
||||
</div>
|
||||
</div >
|
||||
|
||||
@ -17,7 +17,7 @@ export default function Section1() {
|
||||
</div>
|
||||
</div>
|
||||
<div className="row">
|
||||
<div className="col-lg-6">
|
||||
{/* <div className="col-lg-6">
|
||||
<div
|
||||
style={{
|
||||
position: "relative",
|
||||
@ -48,19 +48,19 @@ export default function Section1() {
|
||||
data-load-mode="1"
|
||||
></iframe>
|
||||
</div>
|
||||
</div>
|
||||
</div> */}
|
||||
|
||||
<div className="col-lg-6">
|
||||
{/* <div className="col-lg-6">
|
||||
<div className="about6-header heading9">
|
||||
{/* <h5 data-aos="fade-left" data-aos-duration={700}><img src="/assets/img/icons/sub-logo1.svg" alt="" />About Summit</h5> */}
|
||||
{/* <div className="space20" /> */}
|
||||
<h5 data-aos="fade-left" data-aos-duration={700}><img src="/assets/img/icons/sub-logo1.svg" alt="" />About Summit</h5>
|
||||
<div className="space20" />
|
||||
|
||||
<div className="img right-img">
|
||||
<img src="/assets/img/online/thai-pongal/pongal-1.webp" alt="" />
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div> */}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -17,7 +17,7 @@ export default function Section1() {
|
||||
</div>
|
||||
</div>
|
||||
<div className="row">
|
||||
<div className="col-lg-6">
|
||||
{/* <div className="col-lg-6">
|
||||
<div className="h-100 w-100">
|
||||
<div className="row h-100">
|
||||
<div className="flex_column av-cx34h4-a8d3062fb9de0a0faadd0da67fb825e0 av_one_half avia-builder-el-0 el_before_av_one_half avia-builder-el-first first flex_column_div av-zero-column-padding h-100">
|
||||
@ -61,19 +61,19 @@ export default function Section1() {
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div> */}
|
||||
|
||||
<div className="col-lg-6">
|
||||
{/* <div className="col-lg-6">
|
||||
<div className="about6-header heading9">
|
||||
{/* <h5 data-aos="fade-left" data-aos-duration={700}><img src="/assets/img/icons/sub-logo1.svg" alt="" />About Summit</h5> */}
|
||||
{/* <div className="space20" /> */}
|
||||
<h5 data-aos="fade-left" data-aos-duration={700}><img src="/assets/img/icons/sub-logo1.svg" alt="" />About Summit</h5>
|
||||
<div className="space20" />
|
||||
|
||||
<div className="img right-img">
|
||||
<img src="/assets/img/online/event-volunteers/volunteer-1.webp" alt="" />
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div> */}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -720,7 +720,7 @@ Location:
|
||||
|
||||
@media (max-width: 767px) {
|
||||
.heading1 h1 {
|
||||
font-size: var(--ztc-font-size-font-s32);
|
||||
font-size: var(--ztc-font-size-font-s28);
|
||||
line-height: 40px;
|
||||
}
|
||||
}
|
||||
@ -3545,7 +3545,7 @@ Location:
|
||||
z-index: 1;
|
||||
background-size: cover;
|
||||
background-position: right center;
|
||||
padding: 200px 0 90px;
|
||||
padding: 300px 0 90px;
|
||||
}
|
||||
|
||||
@media (width: 768px) {
|
||||
@ -20376,6 +20376,28 @@ html {
|
||||
padding: 12px 10px;
|
||||
}
|
||||
|
||||
.texture {
|
||||
|
||||
font-size: 20px;
|
||||
color: #ce2029 !important;
|
||||
font-weight: 700;
|
||||
|
||||
}
|
||||
|
||||
.textured {
|
||||
|
||||
font-size: 22px !important;
|
||||
color: #ce2029 !important;
|
||||
font-weight: 700;
|
||||
|
||||
}
|
||||
|
||||
.metered-data img {
|
||||
|
||||
margin-right: 6px !important;
|
||||
|
||||
}
|
||||
|
||||
.about7-header ul li {
|
||||
color: #000000cf;
|
||||
font-family: var(--grotesk);
|
||||
@ -26273,6 +26295,31 @@ html {
|
||||
letter-spacing: -0.64px;
|
||||
}
|
||||
|
||||
@media (min-width: 1540px) {
|
||||
.homepage1-body .header-area.homepage1 .header-elements .main-menu ul li a {
|
||||
font-family: var(--grotesk) !important;
|
||||
font-size: var(--ztc-font-size-font-s18);
|
||||
font-weight: var(--ztc-weight-medium);
|
||||
color: #fff;
|
||||
display: block;
|
||||
transition: all 0.4s;
|
||||
padding: 0px 13px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1360px) {
|
||||
.homepage1-body .header-area.homepage1 .header-elements .main-menu ul li a {
|
||||
font-family: var(--grotesk) !important;
|
||||
font-size: var(--ztc-font-size-font-s18);
|
||||
font-weight: var(--ztc-weight-medium);
|
||||
color: #fff;
|
||||
display: block;
|
||||
transition: all 0.4s;
|
||||
padding: 0px 10px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@media (max-width: 767px) {
|
||||
.event6-section-area .event6-widget-boxarea3 .content-area h3 {
|
||||
font-size: var(--ztc-font-size-font-s24);
|
||||
@ -28575,3 +28622,11 @@ h2.custom-text.aos-init.aos-animate {
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 425px) {
|
||||
.annual-membership {
|
||||
width: 100%;
|
||||
height: 1272px;
|
||||
border: 0px;
|
||||
}
|
||||
}
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 54 KiB After Width: | Height: | Size: 179 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 9.5 KiB After Width: | Height: | Size: 410 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 17 KiB After Width: | Height: | Size: 342 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 16 KiB After Width: | Height: | Size: 271 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 9.5 KiB After Width: | Height: | Size: 238 KiB |
BIN
public/assets/img/all-images/about/kanth-kathir.jpeg
Normal file
BIN
public/assets/img/all-images/about/kanth-kathir.jpeg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 66 KiB |
BIN
public/assets/img/all-images/about/shobha.jpeg
Normal file
BIN
public/assets/img/all-images/about/shobha.jpeg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 136 KiB |
BIN
public/assets/img/all-images/about/srinivasan-raja.jpeg
Normal file
BIN
public/assets/img/all-images/about/srinivasan-raja.jpeg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 153 KiB |
BIN
public/assets/img/all-images/about/sumalatha-stephen.jpeg
Normal file
BIN
public/assets/img/all-images/about/sumalatha-stephen.jpeg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 260 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 164 KiB After Width: | Height: | Size: 142 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 33 KiB After Width: | Height: | Size: 166 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 22 KiB After Width: | Height: | Size: 115 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 118 KiB After Width: | Height: | Size: 170 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 25 KiB After Width: | Height: | Size: 172 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 30 KiB After Width: | Height: | Size: 166 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 129 KiB After Width: | Height: | Size: 177 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 106 KiB After Width: | Height: | Size: 144 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 152 KiB After Width: | Height: | Size: 113 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 122 KiB After Width: | Height: | Size: 172 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 117 KiB After Width: | Height: | Size: 252 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 135 KiB After Width: | Height: | Size: 158 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 53 KiB After Width: | Height: | Size: 146 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 33 KiB After Width: | Height: | Size: 126 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 311 KiB After Width: | Height: | Size: 248 KiB |
Some files were not shown because too many files have changed in this diff Show More
Loading…
x
Reference in New Issue
Block a user