Skip to content

changes #51

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
khushveermalviya wants to merge 6 commits into
base: main
Choose a base branch
from
Open

changes #51

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
e222fa7
changes
khushveermalviya Jun 19, 2024
46944c9
hee
khushveermalviya Jul 6, 2024
034b635
Resolved merge conflicts while merging main into you
khushveermalviya Jul 6, 2024
ee54341
ca
khushveermalviya Jul 9, 2024
20b8271
d
khushveermalviya Jul 9, 2024
e076207
final
khushveermalviya Jul 9, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
16 changes: 2 additions & 14 deletions components/Campus/Banner.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,20 +2,8 @@ import React from 'react';

const Banner = () => {
return (
<div className="flex flex-col items-center p-6 bg-gray-100 sm:p-12">
<div className="w-full max-w-md p-6 text-center bg-white shadow-md rounded-lg">
<h2 className="mb-4 text-2xl font-bold text-blue-600">Become a MujHackx Campus Ambassador today!</h2>
<a className="px-4 py-2 mt-4 text-white bg-blue-600 rounded hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-opacity-50"
role="button"
target="_blank"
rel="noopener noreferrer"

href='https://forms.gle/WgQjJWdB7bgGH6fw5'
>
Apply now
</a>
</div>

<div>
<img src='hackx2.png' className='w-full h-100 object-cover pt-20 pb-24 sm:pb-7 md:pb-6 lg:pb-10 ' alt='banner image' />
</div>
);
}
Expand Down
23 changes: 23 additions & 0 deletions components/Campus/Become.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,23 @@

export default function Become() {
return(
<div className="w-full h-full flex justify-center p-36 " >
<div className="flex flex-col lg:flex-row justify-center border-solid border drop-shadow-2xl h-full border-indigo-500/100 p-10 lg:p-10" style={{ backgroundColor: '#000' }}>
<div className="flex flex-col justify-center items-center w-full h-full lg:w-1/2 gap-8 font-mono">
<h1 className="font-mono text-4xl text-white text-center">Become a Campus Ambassador</h1>
<p className="text-center text-white">Becoming a campus ambassador offers networking, skill
development, exclusive perks, leadership opportunities,
resume enhancement, and unique experiences, making
college life exciting.</p>
</div>
<div className="w-full lg:w-1/2 justify-center flex items-center pt-3">
<a href="https://docs.google.com/forms/d/e/1FAIpQLSfss23Obg5nU9yuWBPXFOPvXrLfmb43mCBFU9hyZjhbxtjWTg/viewform" target="_blank" rel="noreferrer">
<button className=" bg-violet-600 text-white w-auto rounded-full p-1 lg:pl-10 lg:pr-7">Apply Now. Registration closes soon.</button>
</a>
</div>
</div>

</div>

)
}
100 changes: 100 additions & 0 deletions components/Campus/Carousels.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,100 @@
import React, { useEffect, useRef } from 'react';

const Carousel1 = [
{
title: "Internship Eligibility",
img: "internship_icon.svg"
},
{
title: "HackX Spotlight",
img: "Spotlight.svg"
},
{
title: "Certificates & LoRs",
img: "Certificates.svg"
},
{
title: "Milestone Incentives",
img: "Milestone.svg"
}
];

const Carousel2 = [
{
title: "Networking",
img: "Networking.svg"
},
{
title: "Development",
img: "Development.svg"
},
{
title: "MUJ Experience Center",
img: "MUJExperience.svg"
},
{
title: "Lots of Goodies",
img: "Goodies.svg"
}
];

export default function Carousels() {
const sectionRef = useRef(null);

useEffect(() => {
const observer = new IntersectionObserver((entries) => {
entries.forEach((entry) => {
if (entry.isIntersecting) {
entry.target.classList.add('animate-slide-in');
}
});
}, { threshold: 0.1 });

const section = sectionRef.current;
const elements = section.querySelectorAll('.animate-from-left, .animate-from-right');

elements.forEach((el) => observer.observe(el));

return () => {
elements.forEach((el) => observer.unobserve(el));
};
}, []);

return (
<div ref={sectionRef} className="flex justify-center flex-col w-full h-full gap-6 py-20 lg:py-10 font-mono ">

<div className='flex w-full text-4xl justify-center mt-16 mb-7'>
<h1 className='text-center' style={{ textShadow: '0 0 1px #FFF, 0 0 3px #FFF, 0 0 8px #FFF, 0 0 6px #FFF' }}>
PERKS YOU WILL BE BENEFITTED WITH
</h1>
</div>

<div className="md:flex justify-center w-full h-full grid grid-flow-col-2 md:flex-col items-center lg:flex-row gap-6 lg:px-36 md:px-28">
{Carousel1.map((item, index) => (
<div
key={index}
className={`w-full lg:w-1/4 h-80 flex flex-col justify-center items-center border-2 rounded-lg p-4 bg-black px-7 transition-transform transform hover:scale-105 animate-from-left hover:text-white`}
>
<img src={item.img} alt="icon" className="w-24 h-24 mb-4 mt-6" />
<div className="flex justify-center items-end align-bottom h-1/2 w-full">
<p className="text-xl text-center w-full h-10 bg-black text-white">{item.title}</p>
</div>
</div>
))}
</div>
<div className="md:flex justify-center w-full h-full grid grid-flow-col-2 md:flex-col items-center lg:flex-row gap-6 lg:px-36 md:px-28">
{Carousel2.map((item, index) => (
<div
key={index}
className={`w-full lg:w-1/4 h-80 flex flex-col justify-center items-center border-2 rounded-lg p-4 bg-black px-7 transition-transform transform hover:scale-105 animate-from-right`}
>
<img src={item.img} alt="icon" className="w-24 h-24 mb-4 mt-6" />
<div className="flex justify-center items-end align-bottom h-1/2 w-full">
<p className="text-xl text-center w-full h-10 bg-black text-white transition-transform">{item.title}</p>
</div>
</div>
))}
</div>
</div>
);
}
2 changes: 2 additions & 0 deletions components/Campus/Contect.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,9 @@ const Contact = ({ name, contact, socialIcons }) => {

return (
<motion.section

className="flex flex-col items-center justify-center mb-7 mt-6 mx-4 h-50 w-72 p-6 rounded-lg bg-gradient-to-b from-gray-800 to-gray-900 shadow-lg"

initial={{ opacity: 0, y: 50 }}
animate={{ opacity: 1, y: 0 }}
transition={{ duration: 0.6 }}
Expand Down
7 changes: 0 additions & 7 deletions components/Campus/Count.jsx
View file
Open in desktop

This file was deleted.

75 changes: 54 additions & 21 deletions components/Campus/FAQSection.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -31,31 +31,64 @@ const FAQSection = () => {
];

return (
<div className="p-6 bg-gray-50 sm:p-12">
<h2 className="mb-6 text-3xl font-bold text-center text-blue-600">Frequently Asked Questions</h2>
<div className="w-full max-w-2xl mx-auto">
{faqs.map((faq, index) => (
<div key={index} className="mb-4 bg-white rounded-lg shadow-md">
<button
onClick={() => toggle(index)}
className="w-full px-4 py-4 text-left text-lg font-medium text-blue-700 transition-colors duration-200 ease-in-out bg-blue-100 rounded-t-lg hover:bg-blue-200 focus:outline-none focus:ring-2 focus:ring-blue-500"
>
{faq.question}
<span className={`float-right transition-transform ${open === index ? 'rotate-180' : 'rotate-0'}`}>
<svg className="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M19 9l-7 7-7-7"></path>
</svg>
</span>
</button>
<section className="py-24">
<div className="mx-auto max-w-7xl px-4 sm:px-6 lg:px-8">
<div className="mb-16">
<h6 className="text-lg text-indigo-600 font-medium text-center mb-2">
FAQs
</h6>
<h2 className="text-4xl font-manrope text-center font-bold leading-[3.25rem]">
Frequently asked questions
</h2>
</div>

<div className="accordion-group" data-accordion="default-accordion">
{faqs.map((faq, index) => (
<div
className={`px-4 py-4 overflow-hidden transition-all duration-300 ease-in-out bg-white rounded-b-lg ${open === index ? 'max-h-screen' : 'max-h-0'}`}
key={index}
className="accordion py-8 px-6 border-b border-solid border-gray-200 transition-all duration-500 rounded-2xl accordion-active:bg-indigo-50"
id={`basic-heading-${index}`}
>
<p className={`text-gray-700 ${open === index ? 'block' : 'hidden'}`}>{faq.answer}</p>
<button
className="accordion-toggle group inline-flex items-center justify-between leading-8 w-full transition duration-500 text-left hover:text-indigo-600 accordion-active:font-medium accordion-active:text-indigo-600"
aria-controls={`basic-collapse-${index}`}
onClick={() => toggle(index)}
>
<h5>{faq.question}</h5>
<svg
className={`text-gray-500 transition duration-500 group-hover:text-indigo-600 accordion-active:text-indigo-600 ${
open === index ? 'rotate-180' : ''
}`}
width="22"
height="22"
viewBox="0 0 22 22"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M16.5 8.25L12.4142 12.3358C11.7475 13.0025 11.4142 13.3358 11 13.3358C10.5858 13.3358 10.2525 13.0025 9.58579 12.3358L5.5 8.25"
stroke="currentColor"
strokeWidth="1.6"
strokeLinecap="round"
strokeLinejoin="round"
></path>
</svg>
</button>
<div
id={`basic-collapse-${index}`}
className={`accordion-content w-full px-0 overflow-hidden transition-max-height duration-500 ${
open === index ? 'max-h-96' : 'max-h-0'
}`}
aria-labelledby={`basic-heading-${index}`}
style={{ maxHeight: open === index ? '250px' : '0px' }}
>
<p className="text-base leading-6">{faq.answer}</p>
</div>
</div>
</div>
))}
))}
</div>
</div>
</div>
</section>
);
};

Expand Down
6 changes: 3 additions & 3 deletions components/Campus/Footer.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -29,11 +29,11 @@ export default function Footer() {
}, []);

return (
<div>
<div >
<hr className="border-0 h-[1px] bg-gradient-to-r from-transparent via-gray-700 to-transparent mt-10 " />

<div className="flex items-center flex-col w-full h-full bg-hack footer-list p-16 lg:p-10 lg:pt-16 lg:pb-8">
<ul className="hidden items-center gap-5 xl:gap-10 text-base-1xl flex-col lg:flex-row footer-list lg:flex mb-4 space-x-5">
<div className="flex items-center flex-col w-full h-full bg-hack footer-list p-16 lg:p-10 lg:pt-16 lg:pb-8" style={{backgroundColor: '#261B4B'}}>
<ul className="hidden items-center gap-5 xl:gap-10 text-base-1xl flex-col lg:flex-row footer-list lg:flex mb-4 space-x-5" style={{backgroundColor: '#261B4B'}}>
{navData.map((item, index) => (
<li key={index}>
<Link href={item.path}>
Expand Down
45 changes: 29 additions & 16 deletions components/Campus/Main.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,24 +1,37 @@
import React from 'react';
import RotatingText from 'react-rotating-text';

const Main = () => {
const words = ["representative", "ambassador", "leader", "advocate"];
return (
<section className="relative bg-cover bg-center h-screen" style={{ backgroundImage: "url('/meeting.jpg')" }}>
<div className="absolute inset-0 bg-black bg-opacity-50"></div>
<div className="relative z-10 flex items-center justify-center h-full">
<div className="text-center px-4 sm:px-6 lg:px-8">
<h1 className="text-white text-3xl sm:text-4xl lg:text-5xl font-bold mb-4 bg-gradient-to-r from-amber-200 via-amber-200 to-amber-400 bg-clip-text text-transparent ">Campus Ambassador <span className='bg-gradient-to-r from-violet-600 to-indigo-600 bg-clip-text text-transparent' >MujHackx</span></h1>
<p className="text-white text-lg sm:text-xl lg:text-2xl mb-8">
Be the <RotatingText items={words} /> of your campus!
</p><a className="bg-gradient-to-r from-violet-600 to-indigo-600 text-white py-2 px-4 rounded-lg hover:bg-blue-800 transition duration-300"
href="https://forms.gle/WgQjJWdB7bgGH6fw5"
role="button"
target="_blank"
rel="noopener noreferrer"
>Apply Now</a>
<div className='h-full w-full font-mono mt-16 mb-20 lg:mt-4 ' s>
<div className='flex justify-center flex-col w-full items-start h-screen gap-24'>
<div className='flex justify-center lg:flex-row flex-col gap-10'>
<h1 className='text-6xl lg:w-1/3 text-center'>About us</h1>
<p className='w-50 lg:w-1/2 text-center transition-transform'>
Our Campus Ambassador program is an incredible opportunity for
students to represent our College and help us spread the word about
our mission. As a Campus Ambassador, you will gain valuable experience,
enhance your leadership skills, and connect with like-minded individuals.

You will be the face of our hackathon on your campus, organizing
events, sharing our story, and promoting our values. This role is perfect
for proactive, enthusiastic, and passionate students who want to make
a difference.
</p>
</div>
<div className='flex justify-center lg:flex-row flex-col gap-10 pt-10'>
<h1 className='text-3xl lg:w-1/3 text-center'>Why choose our Campus Ambassador Program</h1>
<p className='w-50 lg:w-1/2 text-center'>
Becoming a Campus Ambassador offers a unique opportunity to develop
your professional skills, network with industry leaders, and gain
invaluable experience that will set you apart in the job market.

You will also receive exclusive training and mentorship, have the chance
to earn rewards and recognition, and be part of a dynamic and
supportive community.
</p>
</div>
</div>
</section>
</div>
);
};

Expand Down
58 changes: 0 additions & 58 deletions components/Campus/Nav.jsx
View file
Open in desktop

This file was deleted.

Loading