From 69b785161c1058f73c17af6e119c7081e1a6f78d Mon Sep 17 00:00:00 2001 From: Manurbhav Date: Sun, 21 Apr 2024 20:25:13 +0530 Subject: navbar, reusable components Made hamburger navbar, responsiveness part has some bug, will fix tomorrow and made the components data stored in a variable to easily modify when needed --- src/components/Carousel.astro | 208 ++++++++++++++++++++++++++++---------- src/components/Footer.astro | 1 - src/components/Header.astro | 18 +++- src/components/HomeBody.astro | 166 ++++++++++++++++++++++-------- src/components/IconBar.astro | 16 ++- src/components/Navbar.astro | 189 +++++++++++++++++++++++++++++++--- src/components/ScheduleBody.astro | 107 +++++++++++++------- src/components/TopBar.astro | 9 +- src/pages/index.astro | 1 + 9 files changed, 560 insertions(+), 155 deletions(-) diff --git a/src/components/Carousel.astro b/src/components/Carousel.astro index c0be475..07f7441 100644 --- a/src/components/Carousel.astro +++ b/src/components/Carousel.astro @@ -1,68 +1,174 @@ --- -import { Carousel } from 'astro-bootstrap'; -import type { CarouselSlideType } from 'astro-bootstrap'; +const props = Astro.props +interface Carousel{ + img: string; + alt: string; + link?: string; +} -const slides: CarouselSlideType[] = [ +const carouselSlide: Carousel[] = [ + { + img: 'https://iitb-fossee-mapathon.fossee.in/static/cms/uploads/images/iitb-logo.png', + alt: 'IITB' , + link:'http://iitb.ac.in/' + }, + { + img: 'https://iitb-fossee-mapathon.fossee.in/static/cms/uploads/images/fossee-logo.png', + alt: 'FOSSEE' , + link:'https://fossee.in/' + }, + { + img: 'https://iitb-fossee-mapathon.fossee.in/static/cms/uploads/images/st-logo.png', + alt: 'Spoken Tutorial' , + link:'https://spoken-tutorial.org/' + }, + { + img: 'https://iot-gis-hackathon.fossee.in/static/cms/uploads/images/icfoss-logo.png', + alt: 'icfoss' + }, { img: 'https://iitb-fossee-mapathon.fossee.in/static/cms/uploads/images/rudra-logo.png', - alt: 'Rudra', - active:true, + alt: 'Rudra', link : 'http://www.rudra.iitb.ac.in/', }, - { img: 'https://iot-gis-hackathon.fossee.in/static/cms/uploads/images/icfoss-logo.png', alt: 'icfoss', active: true }, - { img: 'https://iot-gis-hackathon.fossee.org/static/cms/uploads/images/NM-ICPS-logo1.png', alt: 'NMICPS' ,active:true, link:'https://nmicps.in/'}, - { img: 'https://iitb-fossee-mapathon.fossee.in/static/cms/uploads/images/navavishkaar.png', alt: 'IITTNiF' ,active:true, link:'https://iittnif.com/'}, - { img: 'https://iitb-fossee-mapathon.fossee.in/static/cms/uploads/images/iit-tirupati.png', alt: 'IIT Tirupati' ,active:true, link:'https://www.iittp.ac.in/'}, - { img: 'https://iitb-fossee-mapathon.fossee.in/static/cms/uploads/images/iitb-logo.png', alt: 'IITB' ,active:true, link:'http://iitb.ac.in/'}, - { img: 'https://iitb-fossee-mapathon.fossee.in/static/cms/uploads/images/fossee-logo.png', alt: 'FOSSEE' ,active:true, link:'https://fossee.in/'}, - { img: 'https://iitb-fossee-mapathon.fossee.in/static/cms/uploads/images/st-logo.png', alt: 'Spoken Tutorial' ,active:true, link:'https://spoken-tutorial.org/'}, + { + img: 'https://iitb-fossee-mapathon.fossee.in/static/cms/uploads/images/iit-tirupati.png', + alt: 'IIT Tirupati' , + link:'https://www.iittp.ac.in/' + }, + { + img: 'https://iitb-fossee-mapathon.fossee.in/static/cms/uploads/images/navavishkaar.png', + alt: 'IITTNiF' , + link:'https://iittnif.com/' + }, + { + img: 'https://iot-gis-hackathon.fossee.org/static/cms/uploads/images/NM-ICPS-logo1.png', + alt: 'NMICPS' , + link:'https://nmicps.in/' + }, ]; -const id = 'carouselExampleBasic'; ---- - - - - - { - slides.map((slide) => ( - - - {slide.alt} - - - )) +--- +
+ + + +
+
{ + carouselSlide.slice(0, 4).map((slide) => { + return ( + + + {slide.alt} + + + ); + }) + }
+
{ + carouselSlide.slice(4).map((slide) => { + return ( + + + {slide.alt} + + + ); + }) } - - - - +
+
+ + + +
+ + + + \ No newline at end of file diff --git a/src/components/Footer.astro b/src/components/Footer.astro index 600f61f..aaa2f51 100644 --- a/src/components/Footer.astro +++ b/src/components/Footer.astro @@ -1,5 +1,4 @@ --- -// import 'bootstrap/dist/css/bootstrap.css' ---
diff --git a/src/components/Header.astro b/src/components/Header.astro index a21a969..d251d8a 100644 --- a/src/components/Header.astro +++ b/src/components/Header.astro @@ -23,7 +23,7 @@ import 'bootstrap/dist/css/bootstrap.css' height: 80vh; padding: 1vh; background-color: rgb(252, 230, 188); - animation: zoomIn 1.5s; + animation: zoomIn 3s; z-index: 10; } .map img { @@ -108,6 +108,22 @@ import 'bootstrap/dist/css/bootstrap.css' } } + @media screen and (max-width: 982px) { + .head{ + margin-top: 9vh; + } + } + + @media screen and (max-width: 602px){ + .head{ + margin-top: 9vh; + } + .nav{ + margin: 1vh; + } + } + + diff --git a/src/components/HomeBody.astro b/src/components/HomeBody.astro index 71698cd..2a973bd 100644 --- a/src/components/HomeBody.astro +++ b/src/components/HomeBody.astro @@ -3,34 +3,118 @@ import 'bootstrap/dist/css/bootstrap.css' import Carousel from './Carousel.astro' const props = Astro.props +interface CoreTeam{ + name : string; + position : string[]; + institute : string; +} + +interface Significance{ + intro : string; + point: string[]; + end: string; +} + +const signifance : Significance[] = [ + { + intro: "In a world where technology shapes our daily lives, the significance of this hackathon cannot be overstated. Here, participants have the opportunity to redefine the boundaries of what's possible. By merging open source principles with cutting-edge technologies, we aim to:", + point: [ + "Solve Real-World Problems: Tackle critical issues such as environmental sustainability, disaster management, precision agriculture, and more. Your solutions can change lives and protect our planet.", + "Foster Innovation: Innovation thrives when knowledge is shared openly. By promoting open source hardware and IoT, we empower you to push the boundaries of creativity and discovery.", + "Create Collaborative Communities: Through this hackathon, we build communities of like-minded individuals passionate about making a difference. Together, we can achieve more than any one of us can alone.", + "Empower Future Leaders: Whether you're a student, a professional, or an enthusiast, this hackathon is a launchpad for your ideas. It's a chance to develop your skills, showcase your talents, and make your mark on the world." + ], + end: "Join us on this extraordinary journey, where innovation knows no bounds. Together, let's turn ideas into actions and make a lasting impact on society and the environment. The Open Source Hardware IoT GIS Hackathon is your stage to shine, and the world is waiting to witness your brilliance." + } +] + +const purpose: string[] = [ + + "This hackathon is more than just a competition; it's a platform for innovators, creators, and visionaries to come together and pioneer solutions for a brighter future. Our purpose is to harness the power of open source hardware, the Internet of Things (IoT), and Geographic Information Systems (GIS) to address some of the world's most pressing challenges.", + + "The FOSSEE project, IIT Bombay promotes the use of Free/ Libre Open Source Software in academia and Industry. The FOSSEE project is funded through the National Mission on Education through ICT (NMEICT), Ministry of Education, Government of India. The FOSSEE-GIS team manages the overall coordination of the 'IIT Bombay FOSSEE GIS Internship in Geospatial Dashboard Design and Implementation'." +] + +const coreteam: CoreTeam[] = [ + { + name: "Prof. Kannan Moudgalya", + position: ["P.I., FOSSEE"], + institute: "Indian Institute of Technology Bombay" + }, + { + name: "Prof. Pennan Chinnasamy", + position: ["Co.P.I., FOSSEE & PiC, The Rural Data Research & Analysis (RuDRA) Lab, IIT Bombay"], + institute: "Indian Institute of Technology Bombay" + }, + { + name: "Prof. Roshan Srivastav", + position: ["Project Director, IIT Tirupati Navavishkar I-Hub Foundation (NM-ICPS, DST)"], + institute: "Indian Institute of Technology Tirupati" + }, + { + name: "Mr. Rajesh Kushalkar", + position: ["Senior Manager, FOSSEE-Open Hardware"], + institute: "Indian Institute of Technology Bombay" + }, + { + name: "Mr. Mohamed Kasim Khan", + position: ["National Coordinator, FOSSEE-GIS", "National Mission on Education through ICT, Ministry of Education, Government of India"], + institute: "Indian Institute of Technology Bombay", + } +] + --- +

Introducing the Hackathon: Unlocking Innovation for a Better World

-

Welcome to the Open Source Hardware IoT GIS Hackathon!

Welcome to the National Level Open Hardware-IoT Geospatial Hackathon, a stage where innovation knows no boundaries. This premier event brings together visionaries, tech enthusiasts, and problem solvers from across the nation to harness the power of open hardware, the Internet of Things (IoT), and geospatial technology. Get ready to explore uncharted possibilities, collaborate on real-world challenges, and make a significant impact on our world.

-

Significance:

-
    -

    In a world where technology shapes our daily lives, the significance of this hackathon cannot be overstated. Here, participants have the opportunity to redefine the boundaries of what's possible. By merging open source principles with cutting-edge technologies, we aim to:

    -
  • Solve Real-World Problems: Tackle critical issues such as environmental sustainability, disaster management, precision agriculture, and more. Your solutions can change lives and protect our planet.
    • -
  • Foster Innovation: Innovation thrives when knowledge is shared openly. By promoting open source hardware and IoT, we empower you to push the boundaries of creativity and discovery.
    • -
  • Create Collaborative Communities: Through this hackathon, we build communities of like-minded individuals passionate about making a difference. Together, we can achieve more than any one of us can alone.
    • -
  • Empower Future Leaders: Whether you're a student, a professional, or an enthusiast, this hackathon is a launchpad for your ideas. It's a chance to develop your skills, showcase your talents, and make your mark on the world.
    • -
-

Join us on this extraordinary journey, where innovation knows no bounds. Together, let's turn ideas into actions and make a lasting impact on society and the environment. The Open Source Hardware IoT GIS Hackathon is your stage to shine, and the world is waiting to witness your brilliance.

+

Significance:

{ + signifance.map((point) => { + return ( +
    +

    {point.intro}

    + { + point.point.map((p) => { + return ( +
  • {p}
    • + ) + }) + } +
+

{point.end}

+ ) + }) + }
+ + + +
-

Purpose

-

This hackathon is more than just a competition; it's a platform for innovators, creators, and visionaries to come together and pioneer solutions for a brighter future. Our purpose is to harness the power of open source hardware, the Internet of Things (IoT), and Geographic Information Systems (GIS) to address some of the world's most pressing challenges..

-

The FOSSEE project, IIT Bombay promotes the use of Free/ Libre Open Source Software in academia and Industry. The FOSSEE project is funded through the National Mission on Education through ICT (NMEICT), Ministry of Education, Government of India. The FOSSEE-GIS team manages the overall coordination of the "IIT Bombay FOSSEE GIS Internship in Geospatial Dashboard Design and Implementation".

+

Purpose

{ + purpose.map((point) => { + return ( +

{point}

+ ) + }) + }
+ + + +

Registration

Please click on the following button to register yourself for the Hackathon

+ + + +

Partner and Organisers

@@ -43,53 +127,47 @@ const props = Astro.props

Organizing Partner: - The IIT Tirupati Navavishkar I-Hub Foundation is the Technology Innovation Hub specializing in Positioning and Precision Technologies, funded through the National Mission on Interdisciplinary Cyber-Physical System (NM-ICPS), Department of Science and Technology, Government of India. + The IIT Tirupati Navavishkar I-Hub Foundation is the Technology Innovation Hub specializing in Positioning and Precision Technologies, funded through the National Mission on Interdisciplinary Cyber-Physical System (NM-ICPS), Department of Science and Technology, Government of India.

+ + +

Core Team and Contact Us

-
-
-

Prof. Kannan Moudgalya

-

P.I., FOSSEE

-

Indian Institute of Technology Bombay

-
-
-

Prof. Pennan Chinnasamy

-

Co.P.I., FOSSEE & PiC, The Rural Data Research & Analysis (RuDRA) Lab, IIT Bombay

-

Indian Institute of Technology Bombay

-
-
-

Prof. Roshan Srivastav

-

Project Director, IIT Tirupati Navavishkar I-Hub Foundation (NM-ICPS, DST)

-

Indian Institute of Technology Tirupati

-
-
-

Mr. Rajesh Kushalkar

-

Senior Manager, FOSSEE-Open Hardware

-

Indian Institute of Technology Bombay

-
-
-

Mr. Mohamed Kasim Khan

-

National Coordinator, FOSSEE-GIS

-

National Mission on Education through ICT, Ministry of Education, Government of India

-

Indian Institute of Technology Bombay

-
+
{ + coreteam.map((member) => { + return ( +
+

{member.name}

+ {member.position.map((pos) => { + return ( +

{pos}

+ ) + })} +

{member.institute}

+
+ ) + }) + }

- Please write to us in case of any queries regarding the Hackathon at:

+ + + + diff --git a/src/components/ScheduleBody.astro b/src/components/ScheduleBody.astro index 64e1331..a143cbe 100644 --- a/src/components/ScheduleBody.astro +++ b/src/components/ScheduleBody.astro @@ -1,50 +1,81 @@ --- import 'bootstrap/dist/css/bootstrap.css' +interface ScheduleItem{ + heading : string; + events : string[]; +} + +const scheduleItems : ScheduleItem[] = [ + { + heading : "Week 1: Kickoff and Orientation [March 01 to 07, 2024]", + events : [ + "Working Day 1: Registration and Welcome Ceremony", + "Working Day 2: Opening Keynote and Theme Announcement", + "Working Day 3: Workshop 1 - Introduction to Open Hardware and IoT", + "Working Day 4: Workshop 2 - Geospatial Technology Fundamentals", + "Working Day 5: Team Formation and Ideation Session", + "Working Day 6-7: Self-Study and Project Brainstorming" + ] + }, + { + heading : "Week 2: Deep Dive into IoT and GIS [March 08 to 14, 2024]", + events : [ + "Working Day 8: Workshop 3 - IoT Sensors and Data Collection", + "Working Day 9: Workshop 4 - Advanced GIS Applications", + "Working Day 10: Hacking Session Begins", + "Working Day 11-14: Guided Hacking, Team Check-Ins, and Progress Reports" + ] + }, + { + heading : "Week 3: Prototyping and Development [March 15 to 21, 2024]", + events : [ + "Working Day 15: Workshop 5 - Data Visualization with GIS", + "Working Day 16: Workshop 6 - Open Source Hardware Prototyping", + "Working Day 17-21: Dedicated Hacking and Prototype Development" + ] + }, + { + heading : "Week 4: Final Touches and Presentations [March 22 to April 05, 2024]", + events : [ + "Working Day 22: Workshop 7 - IoT Data Analysis", + "Working Day 23-25: Final Project Development and Testing", + "Working Day 26: Project Submissions", + "Working Day 27-28: Team Rehearsals and Presentation Prep" + ] + }, + { + heading : "Week 5: Grand Finale and Awards", + events : [ + "Working Day 29: Presentations by Hackathon Teams", + "April 12, 2023 (tentative): Judging and Results Declaration", + "Date to be announced: Awards Ceremony and Celebration" + ] + } +] --- +

National Level Open Hardware-IoT Geospatial Hackathon

-
-

Week 1: Kickoff and Orientation [March 01 to 07, 2024]

-
-

Working Day 1: Registration and Welcome Ceremony

-

Working Day 2: Opening Keynote and Theme Announcement

-

Working Day 3: Workshop 1 - Introduction to Open Hardware and IoT

-

Working Day 4: Workshop 2 - Geospatial Technology Fundamentals

-

Working Day 5: Team Formation and Ideation Session

-

Working Day 6-7: Self-Study and Project Brainstorming

-
-

Week 2: Deep Dive into IoT and GIS [March 08 to 14, 2024]

-
-

Working Day 8: Workshop 3 - IoT Sensors and Data Collection

-

Working Day 9: Workshop 4 - Advanced GIS Applications

-

Working Day 10: Hacking Session Begins

-

Working Day 11-14: Guided Hacking, Team Check-Ins, and Progress Reports

-
-

Week 3: Prototyping and Development [March 15 to 21, 2024]

-
-

Working Day 15: Workshop 5 - Data Visualization with GIS

-

Working Day 16: Workshop 6 - Open Source Hardware Prototyping

-

Working Day 17-21: Dedicated Hacking and Prototype Development

-
-

Week 4: Final Touches and Presentations [March 22 to April 05, 2024]

-
-

Working Day 22: Workshop 7 - IoT Data Analysis

-

Working Day 23-25: Final Project Development and Testing

-

Working Day 26: Project Submissions

-

Working Day 27-28: Team Rehearsals and Presentation Prep

-
-

Week 5: Grand Finale and Awards

-
-

Working Day 29: Presentations by Hackathon Teams

-

April 12, 2023 (tentative): Judging and Results Declaration

-

Date to be announced: Awards Ceremony and Celebration

-
+
{ + scheduleItems.map((item)=>( +

{item.heading}

+
+ { + item.events.map((event)=>( +

{event}

+ )) + } +
+ )) + }
+ + diff --git a/src/pages/index.astro b/src/pages/index.astro index 95d8b7b..96c1f83 100644 --- a/src/pages/index.astro +++ b/src/pages/index.astro @@ -22,4 +22,5 @@ import IconBar from '../components/IconBar.astro'; -- cgit