Skip to content

Commit

Permalink
feat: Event Page
Browse files Browse the repository at this point in the history
  • Loading branch information
@Nishitbaria
Nishitbaria committed Oct 25, 2023
1 parent 8fca154 commit 00b7a79
Show file tree
Hide file tree
Showing 7 changed files with 207 additions and 102 deletions.
4 changes: 2 additions & 2 deletions Technodes/src/App.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ import Projects from "./Pages/Projects";
import Team from "./Pages/Team";
import Error from "./Pages/Error";
import Navbar from "./components/Navbar";
import Events from "./Pages/Events";
import Event from "./Pages/EventPage/Event"
import Contact from "./Pages/Contact";

export default function App() {
Expand All @@ -17,7 +17,7 @@ export default function App() {
<Routes>
<Route path="/" element={<Home />}></Route>
<Route path="/Projects" element={<Projects />}></Route>
<Route path="/Event" element={<Events />}></Route>
<Route path="/Event" element={<Event />}></Route>
<Route path="/Team" element={<Team />}></Route>
<Route path="/Contact" element={<Contact />}></Route>
<Route path="/Error" element={<Error />}></Route>
Expand Down
16 changes: 16 additions & 0 deletions Technodes/src/Pages/EventPage/Event.jsx
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,16 @@
import React from 'react'
import HeroSection from '../../components/core/Eventpage/Herosection'
import EventCards from '../../components/core/Eventpage/EventCards'
import NewsLetter from "../../components/NewsLetter"
import Footer from "../../components/Footer"

export default function Event() {
return (
<div className='bg-[#141414]'>
<HeroSection/>
<EventCards/>
<NewsLetter/>
<Footer/>
</div>
)
}
17 changes: 0 additions & 17 deletions Technodes/src/components/EventCards.jsx
View file

This file was deleted.

150 changes: 67 additions & 83 deletions Technodes/src/components/Footer.jsx
View file
Original file line number Diff line number Diff line change
@@ -1,126 +1,110 @@
import React from "react";
import { Link } from "react-router-dom"
import { Link } from "react-router-dom";

export default function Footer() {
return (
<div>
<footer class="bg-primary ">
<div class="mx-auto w-full max-w-screen-xl">
<div class="grid grid-cols-2 gap-8 px-4 py-6 lg:py-8 md:grid-cols-4">
<footer className="bg-primary ">
<div className="mx-auto w-full max-w-screen-xl">
<div className="grid grid-cols-2 gap-8 px-4 py-6 lg:py-8 md:grid-cols-4">
<div>
<h2 class="mb-6 text-sm font-semibold text-textcolor uppercase">
Company
<h2 className="mb-6 text-sm font-semibold text-textcolor uppercase">
Organization
</h2>
<ul class="text-textdark font-medium">
<li class="mb-4">
<a href="#" class=" hover:underline">
<ul className="text-textdark font-medium">
<li className="mb-4">
<a href="#" className=" hover:underline">
About
</a>
</li>
<li class="mb-4">
<a href="#" class="hover:underline">
Careers
<li className="mb-4">
<a href="#" className="hover:underline">
FAQs
</a>
</li>
<li class="mb-4">
<a href="#" class="hover:underline">
Brand Center
</a>
</li>
<li class="mb-4">
<a href="#" class="hover:underline">
Blog
<li className="mb-4">
<a href="#" className="hover:underline">
NewsLetter
</a>
</li>
</ul>
</div>
<div>
<h2 class="mb-6 text-sm font-semibold text-textcolor uppercase">
Help center
<h2 className="mb-6 text-sm font-semibold text-textcolor uppercase">
Socials
</h2>
<ul class="text-textdark font-medium">
<li class="mb-4">
<a href="#" class="hover:underline">
<ul className="text-textdark font-medium">
<li className="mb-4">
<a href="#" className="hover:underline">
Discord Server
</a>
</li>
<li class="mb-4">
<a href="#" class="hover:underline">
<li className="mb-4">
<a href="#" className="hover:underline">
Twitter
</a>
</li>
<li class="mb-4">
<a href="#" class="hover:underline">
Facebook
<li className="mb-4">
<a href="#" className="hover:underline">
Youtube
</a>
</li>
<li class="mb-4">
<Link to="/Contact">Contact Us</Link>
<li className="mb-4">
<Link to="/Contact">GitHub</Link>
</li>
</ul>
</div>
<div>
<h2 class="mb-6 text-sm font-semibold text-textcolor uppercase">
Legal
<h2 className="mb-6 text-sm font-semibold text-textcolor uppercase">
Community
</h2>
<ul class="text-textdark font-medium">
<li class="mb-4">
<a href="#" class="hover:underline">
Privacy Policy
</a>
</li>
<li class="mb-4">
<a href="#" class="hover:underline">
Licensing
<ul className="text-textdark font-medium">
<li className="mb-4">
<a href="#" className="hover:underline">
Blogs
</a>
</li>
<li class="mb-4">
<a href="#" class="hover:underline">
Terms &amp; Conditions
<li className="mb-4">
<a href="#" className="hover:underline">
Events
</a>
</li>
</ul>
</div>
<div>
<h2 class="mb-6 text-sm font-semibold text-textcolor uppercase ">
Download
<h2 className="mb-6 text-sm font-semibold text-textcolor uppercase ">
Contact us
</h2>
<ul class="text-textdark font-medium">
<li class="mb-4">
<a href="#" class="hover:underline">
iOS
</a>
</li>
<li class="mb-4">
<a href="#" class="hover:underline">
Android
<ul className="text-textdark font-medium">
<li className="mb-4">
<a href="#" className="hover:underline">
[email protected]
</a>
</li>
<li class="mb-4">
<a href="#" class="hover:underline">
Windows
<li className="mb-4">
<a href="#" className="hover:underline">
Discord
</a>
</li>
<li class="mb-4">
<a href="#" class="hover:underline">
MacOS
<li className="mb-4">
<a href="#" className="hover:underline">
Telegram
</a>
</li>
</ul>
</div>
</div>
<div class="px-4 py-6 bg-gray-100 dark:bg-secondary md:flex md:items-center md:justify-between">
<span class="text-sm text-textdark dark:text-gray-300 sm:text-center">
© 2023 <a href="/">TechNodes™</a>. All Rights
Reserved.
<div className="px-4 py-6 bg-gray-100 dark:bg-secondary md:flex md:items-center md:justify-between">
<span className="text-sm text-textdark dark:text-gray-300 sm:text-center">
© 2023 <a href="/">TechNodes™</a>. All Rights Reserved.
</span>
<div class="flex mt-4 space-x-6 sm:justify-center md:mt-0">
<div className="flex mt-4 space-x-6 sm:justify-center md:mt-0">
<a
href="#"
class="text-gray-400 hover:text-gray-900 dark:hover:text-white"
className="text-gray-400 hover:text-gray-900 dark:hover:text-white"
>
<svg
class="w-5 h-5"
className="w-5 h-5"
fill="currentColor"
viewBox="0 0 24 24"
aria-hidden="true"
Expand All @@ -131,14 +115,14 @@ export default function Footer() {
clip-rule="evenodd"
/>
</svg>
<span class="sr-only">Facebook page</span>
<span className="sr-only">Facebook page</span>
</a>
<a
href="#"
class="text-gray-400 hover:text-gray-900 dark:hover:text-white"
className="text-gray-400 hover:text-gray-900 dark:hover:text-white"
>
<svg
class="w-5 h-5"
className="w-5 h-5"
fill="currentColor"
viewBox="0 0 24 24"
aria-hidden="true"
Expand All @@ -149,28 +133,28 @@ export default function Footer() {
clip-rule="evenodd"
/>
</svg>
<span class="sr-only">Instagram page</span>
<span className="sr-only">Instagram page</span>
</a>
<a
href="#"
class="text-gray-400 hover:text-gray-900 dark:hover:text-white"
className="text-gray-400 hover:text-gray-900 dark:hover:text-white"
>
<svg
class="w-5 h-5"
className="w-5 h-5"
fill="currentColor"
viewBox="0 0 24 24"
aria-hidden="true"
>
<path d="M8.29 20.251c7.547 0 11.675-6.253 11.675-11.675 0-.178 0-.355-.012-.53A8.348 8.348 0 0022 5.92a8.19 8.19 0 01-2.357.646 4.118 4.118 0 001.804-2.27 8.224 8.224 0 01-2.605.996 4.107 4.107 0 00-6.993 3.743 11.65 11.65 0 01-8.457-4.287 4.106 4.106 0 001.27 5.477A4.072 4.072 0 012.8 9.713v.052a4.105 4.105 0 003.292 4.022 4.095 4.095 0 01-1.853.07 4.108 4.108 0 003.834 2.85A8.233 8.233 0 012 18.407a11.616 11.616 0 006.29 1.84" />
</svg>
<span class="sr-only">Twitter page</span>
<span className="sr-only">Twitter page</span>
</a>
<a
href="#"
class="text-gray-400 hover:text-gray-900 dark:hover:text-white"
className="text-gray-400 hover:text-gray-900 dark:hover:text-white"
>
<svg
class="w-5 h-5"
className="w-5 h-5"
fill="currentColor"
viewBox="0 0 24 24"
aria-hidden="true"
Expand All @@ -181,14 +165,14 @@ export default function Footer() {
clip-rule="evenodd"
/>
</svg>
<span class="sr-only">GitHub account</span>
<span className="sr-only">GitHub account</span>
</a>
<a
href="#"
class="text-gray-400 hover:text-gray-900 dark:hover:text-white"
className="text-gray-400 hover:text-gray-900 dark:hover:text-white"
>
<svg
class="w-5 h-5"
className="w-5 h-5"
fill="currentColor"
viewBox="0 0 24 24"
aria-hidden="true"
Expand All @@ -199,7 +183,7 @@ export default function Footer() {
clip-rule="evenodd"
/>
</svg>
<span class="sr-only">Dribbble account</span>
<span className="sr-only">Dribbble account</span>
</a>
</div>
</div>
Expand Down
44 changes: 44 additions & 0 deletions Technodes/src/components/core/Eventpage/EventCard.jsx
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,44 @@
import { FaGithub } from "react-icons/fa";

const DetailCard = ({ image, title, description, url, btnText, git }) => {
return (
<>
<div className="overflow-hidden rounded-2xl bg-content/5 p-4 bg-[#1f1f1f]">
<img
src={image}
className="aspect-video w-full rounded-lg object-cover object-center"
alt={title + "banner"}
/>
<div className="pt-6 pb-3">
<h3>{title}</h3>
<p className="mt-2">{description}</p>
<div className="mt-4 flex gap-2">
<a
href="#_"
className="inline-flex items-center justify-center w-full px-6 py-3 mb-2 text-lg text-white bg-secondary rounded-md sm:w-auto sm:mb-0"
data-primary="green-400"
data-rounded="rounded-2xl"
data-primary-reset="{}"
>
Get Started
<svg
className="w-4 h-4 ml-1"
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 20 20"
fill="currentColor"
>
<path
fill-rule="evenodd"
d="M10.293 3.293a1 1 0 011.414 0l6 6a1 1 0 010 1.414l-6 6a1 1 0 01-1.414-1.414L14.586 11H3a1 1 0 110-2h11.586l-4.293-4.293a1 1 0 010-1.414z"
clip-rule="evenodd"
></path>
</svg>
</a>
</div>
</div>
</div>
</>
);
};

export default DetailCard;
34 changes: 34 additions & 0 deletions Technodes/src/components/core/Eventpage/EventCards.jsx
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,34 @@
import React from 'react'
import EventCard from './EventCard'

export default function EventCards() {
return (
<section id='events' className='bg-[#141414]'>
<div className='layout py-20'>
<h1 className='h1'> Events </h1>
<hr className='styled-hr my-6' />
<div className='grid grid-cols-1 gap-6 md:grid-cols-2 lg:grid-cols-3'>
{eventsData2.map((event) => (
<EventCard {...event} key={event.image} />
))}
</div>
</div>
</section>
)
}



// Event Data section for the Event Cards

const eventsData2 = [
{
title: 'Hacktoberfest 2021',
description:
'Hacktoberfest is an annual month-long celebration of open-source software run by DigitalOcean. It encourages individuals of all skill levels to engage with open-source software during the month of October and is open to everyone in our global community.',
image: "https://events.mlh.io/rails/active_storage/representations/redirect/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaHBBakVhIiwiZXhwIjpudWxsLCJwdXIiOiJibG9iX2lkIn19--ec16f7fc3d72121459ba4bcd45d5073a195ae5b4/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaDdCem9MWm05eWJXRjBTU0lJY0c1bkJqb0dSVlE2QzNKbGMybDZaVWtpRGpFeU1EQjROakF3SVFZN0JsUT0iLCJleHAiOm51bGwsInB1ciI6InZhcmlhdGlvbiJ9fQ==--bb74e2531ca3e0ee463ad8c55d04110fcf863b74/[email protected]",
url: 'https://events.mlh.io/events/10181-hack-this-fall-x-hacktoberfest-23-in-person-edition',
btnText: 'Know more',
},

];
Loading

0 comments on commit 00b7a79

Please sign in to comment.