diff --git a/funwithphysics/public/Images-public/svgs/Rocket.svg b/funwithphysics/public/Images-public/svgs/Rocket.svg
new file mode 100644
index 000000000..dd222a76b
--- /dev/null
+++ b/funwithphysics/public/Images-public/svgs/Rocket.svg
@@ -0,0 +1,14 @@
+<svg width="133" height="1448" viewBox="0 0 133 1448" fill="none" xmlns="http://www.w3.org/2000/svg">
+<ellipse cx="67" cy="183.93" rx="39" ry="33.945" fill="#F3703B"/>
+<ellipse cx="67" cy="183.93" rx="25" ry="21.6871" fill="#FFD303"/>
+<rect x="48" y="210" width="37" height="1238" fill="#F3703B"/>
+<rect x="57" y="184" width="17" height="1264" fill="#FFD303"/>
+<path d="M65.9715 42.1924V1.20551C38.1941 15.6715 30.4781 34.5576 30.0923 42.1924H65.9715Z" fill="#F8A497"/>
+<path d="M128.471 121.755L113.425 113.317C113.425 125.854 106.48 150.687 103.008 161.537C114.119 167.323 119.983 184.843 121.526 192.88C138.193 168.77 133.1 135.418 128.471 121.755Z" fill="#DFDCDC"/>
+<path d="M4.52917 121.755L19.5753 113.317C19.5753 125.854 26.5197 150.687 29.9919 161.537C18.8809 167.323 13.0167 184.843 11.4735 192.88C-5.19294 168.77 -0.100403 135.418 4.52917 121.755Z" fill="#DFDCDC"/>
+<path d="M88.9544 171.181H36.8717C1.6869 125.854 16.8102 62.2841 28.7699 36.165H95.8988C121.824 94.9933 102.072 150.687 88.9544 171.181Z" fill="#F37763"/>
+<path d="M65.9715 171.181V0C85.9794 14.466 98.3918 32.5484 102.097 39.7814C130.997 82.215 114.139 145.062 102.097 171.181H65.9715Z" fill="#E94833"/>
+<path d="M65.9715 42.1924V3.61646C93.749 17.2315 101.465 35.0067 101.851 42.1924H65.9715Z" fill="#F8A497"/>
+<ellipse cx="65.9715" cy="78.9601" rx="21.9905" ry="24.7127" fill="#E94833"/>
+<ellipse cx="67.1289" cy="78.3574" rx="17.3609" ry="19.288" fill="#40C8F4"/>
+</svg>
diff --git a/funwithphysics/public/Images-public/svgs/cloud.png b/funwithphysics/public/Images-public/svgs/cloud.png
new file mode 100644
index 000000000..7f4beb3c3
Binary files /dev/null and b/funwithphysics/public/Images-public/svgs/cloud.png differ
diff --git a/funwithphysics/src/Components/Home/Home.css b/funwithphysics/src/Components/Home/Home.css
index 80cb6c0ba..d9fa5237f 100644
--- a/funwithphysics/src/Components/Home/Home.css
+++ b/funwithphysics/src/Components/Home/Home.css
@@ -45,9 +45,146 @@ h2 {
}
.banner_button {
+ width: 50vw;
+ display: flex;
+ gap: 5%;
padding: 5px;
}
+.Roadmap{
+ padding: 10% 0%;
+ text-align: center;
+}
+.Roadmap>h1{
+ margin-bottom: 5%;
+}
+.btn-exams{
+ background-color: #ffffff;
+ color: #000;
+ border:0.1rem solid #000;
+ width: 20vw;
+ padding: 0% 5%;
+ text-align: center;
+ margin: 0%;
+}
+.btn-exams:hover{
+ background-color: #2c2b30;
+ color: #ffffff;
+}
+.roadmap-underline{
+ border: 0.1rem solid #F3703B;
+ background-color: #F3703B;
+ width: 15vw;
+ margin: 0% 42%;
+ margin-bottom: 5%;
+}
+.Roadmap-title{
+ width: 20vw;
+ margin: 10% 40% ;
+ position: absolute;
+ color: #000;
+}
+.Roadmap-title>h3{
+ border-radius: 0.5rem;
+ margin: 60% 0%;
+ padding: 5% ;
+}
+.Roadmap-title>h3:active{
+ font-size:1.5rem;
+ width: 18vw;
+ margin-left: 5%;
+}
+.svg-rocket{
+
+}
+a{
+ color: #000;
+}
+a:hover{
+ color: blue;
+ text-decoration: none;
+}
+.svg-cloud{
+ z-index: 10;
+ width: 100vw;
+ margin-top: -20%;
+ margin-left: 0%;
+}
+.left-top-B{
+ position: absolute;
+ font-size: 7rem;
+ margin-top: 30%;
+ right: 12rem;
+ color: rgb(73, 73, 73);
+}
+.left-B{
+ position: absolute;
+ font-size: 7rem;
+ margin-top: -30%;
+ color: rgb(73, 73, 73);
+ right: 12rem;
+}
+.right-B{
+ position: absolute;
+ font-size: 7rem;
+ margin-top: -115%;
+ color: rgb(73, 73, 73);
+ left: 12rem;
+}
+.C1{
+ background-color: #F3703B;
+}
+.C2{
+ background-color: #FFD303;
+}
+.left-top-T{
+ position: absolute;
+ right:17rem;
+ margin-top: 36%;
+}
+.left-top-T>h5{
+ margin: 5% 0%;
+ width: 30vw;
+ padding: 0.5% 0%;
+ background-color: turquoise;
+}
+.left-top-T>h5:active{
+ font-size: 1.2rem;
+ width: 29vw;
+ margin-left: 2%;
+}
+.left-T{
+ position: absolute;
+ right:17rem;
+ margin-top: -20%;
+}
+.left-T>h5{
+ margin: 5% 0%;
+ padding: 0.5% 0%;
+ width: 30vw;
+ background-color: turquoise;
+}
+.left-T>h5:active{
+ font-size: 1.2rem;
+ width: 29vw;
+ margin-left: 2%;
+}
+.right-T{
+ position: absolute;
+ left:17rem;
+ margin-top: -110%;
+}
+.right-T>h5{
+ margin: 5% 0%;
+ width: 30vw;
+ padding: 0.5% 0%;
+ background-color: turquoise;
+}
+.right-T>h5:active{
+ width: 29vw;
+ font-size: 1.2rem;
+ margin-left: 2%;
+}
/*---Feature Section---*/
#fh5co-course-categories,
@@ -64,7 +201,93 @@ h2 {
padding: 7em 0;
clear: both;
}
-
+@media screen and (min-width:1200px){
+ .banner_button{
+ gap: 2%;
+ }
+ .btn-exams{
+ width: 11vw;
+ }
+ .Roadmap>h1{
+ margin-bottom: 2%;
+ }
+ .Roadmap-title>h3:active{
+ font-size:1.4rem;
+ width: 8vw;
+ margin-left:25%;
+ }
+ .roadmap-underline{
+ width: 10vw;
+ margin: 0% 45% 5%;
+ }
+ .left-top-B{
+ position: absolute;
+ font-size: 7rem;
+ margin-top: 12%;
+ right:19rem;
+ color: rgb(73, 73, 73);
+ }
+ .left-B{
+ position: absolute;
+ font-size: 7rem;
+ margin-top: -13%;
+ color: rgb(73, 73, 73);
+ right: 19rem;
+ }
+ .right-B{
+ position: absolute;
+ font-size: 7rem;
+ margin-top: -55%;
+ color: rgb(73, 73, 73);
+ left: 17rem;
+ }
+ .Roadmap-title{
+ margin: 6% 41%;
+ }
+ .Roadmap-title>h3{
+ width: 10vw;
+ font-size: 1.5rem;
+ border-radius: 0.5rem;
+ margin:25% 20%;
+ padding: 5% ;
+ }
+ .left-top-T{
+ right: 27rem;
+ margin-top: 13%;
+ }
+ .left-top-T>h5:active{
+ width: 18vw;
+ font-size: 1.2rem;
+ margin-left: 5%;
+ }
+ .left-top-T>h5{
+ width: 20vw;
+ }
+ .left-T{
+ right: 27rem;
+ margin: -10% 0%;
+ }
+ .left-T>h5{
+ width: 20vw;
+ }
+ .left-T>h5:active{
+ width: 18vw;
+ font-size: 1.2rem;
+ margin-left: 5%;
+ }
+ .right-T{
+ left:25rem;
+ margin: -55% 0%;
+ }
+ .right-T>h5{
+ width: 20vw;
+ }
+ .right-T>h5:active{
+ width: 18vw;
+ font-size: 1.2rem;
+ margin-left: 5%;
+ }
+}
@media screen and (max-width: 768px) {
#fh5co-course-categories,
#fh5co-counter,
diff --git a/funwithphysics/src/Components/Home/Home.js b/funwithphysics/src/Components/Home/Home.js
index 867a688f9..b1626723b 100644
--- a/funwithphysics/src/Components/Home/Home.js
+++ b/funwithphysics/src/Components/Home/Home.js
@@ -12,6 +12,7 @@ const Home = () => {
const backToTopRef=useRef(null)
const [loading, setloading] = useState(true);
const { dispatch } = useContext(Context);
+ const [RoadMap,showRoadMap]=useState(false);
useEffect(() => {
setTimeout(() => {
setloading(false);
@@ -40,6 +41,16 @@ const bookReaderStyle = {
backToTopRef.current!==null&&(backToTopRef.current.style.display = 'none')
else backToTopRef.current!==null&&(backToTopRef.current.style.display = 'block')
}
+ function changeRoadMapState(){
+ if(RoadMap==true){
+ showRoadMap(false);
+ }else{
+ showRoadMap(true);
+ window.scrollTo(0,1050);
+ }
+ }
+ const l="}";
+ const r="{";
useEffect(() => {
window.addEventListener('scroll', handleScroll, { passive: true })
@@ -92,11 +103,121 @@ const bookReaderStyle = {
{' '}
Learn
<i style={bookReaderStyle} className='fas fa-book-reader'></i>
- </Button>
+ </Button>0
+ <button className="btn-exams" onClick={changeRoadMapState}>Competitive Exams</button>
</div>
</div>
</div>
<div>
+ {RoadMap && <div className="Roadmap">
+ <h1>RoadMap</h1>
+ <hr className="roadmap-underline"></hr>
+ <div className="Roadmap-title">
+ {/* Competitive Exam-1 */}
+ <div className="left-top-T">
+ <h5><a href="https://jeemainonline.in/2-year-study-plan-for-jee-main-advanced/" target="_blank">Study Plan for 2 Years</a></h5>
+ <h5><a href="https://dlp.allen.ac.in/study-material/study-material-jee-main-advanced.asp" target="_blank">JEE Advanced Study Material</a></h5>
+ <h5><a href="https://www.physicsgalaxy.com/lectures/15/86/296/6022/Checklist-01-Motion-in-One-Dimension?state=all" target="_blank">Physics Galaxy Video Lectures</a></h5>
+ </div>
+ <h1 className="left-top-B">{l}</h1>
+ <h3 className="C1"><a href="https://jeemain.nta.nic.in/" target="_blank">JEE</a></h3>
+ <h1 className="right-B">{r}</h1>
+
+ <div className="right-T">
+ <h5><a href="https://byjus.com/jee/jee-main-syllabus/" target="_blank">JEE Mains syllabus & Marks Weightage</a></h5>
+ <h5><a href="https://www.physicsgalaxy.com/lectures/22/99/397/6446/Heat-&-Thermodynamics?state=all" target="_blank">JEE Advanced checklist</a></h5>
+ <h5><a href="https://mystudycart.com/best-books-for-iit-jee-preparation" target="_blank">Best Preparation Books</a></h5>
+ </div>
+ {/* Competitive Exam-1 */}
+ <div className="left-T">
+ <h5><a href="https://www.wileyindia.com/bitsat-study-guide.html" target="_blank">BITSAT Study Guide</a></h5>
+ <h5><a href="https://www.examrace.com/BITSAT/BITSAT-Study-Material/" target="_blank">Study Materials for BITSAT</a></h5>
+ <h5><a href="https://www.google.com/url?sa=t&rct=j&q=&esrc=s&source=web&cd=&cad=rja&uact=8&ved=2ahUKEwjB39-1wPD5AhWuzTgGHazAAHwQtwJ6BAgDEAI&url=https%3A%2F%2Fwww.youtube.com%2Fwatch%3Fv%3DbKcm7oS17d0&usg=AOvVaw3mXfNrFl0IG6A-mjwo9nvg" target="_blank">BITSAT Video Lectures</a></h5>
+ </div>
+ <h1 className="left-B">{l}</h1>
+ <h3 className="C2"><a href="https://www.bitsadmission.com/" target="_blank">BITSAT</a></h3>
+ <h1 className="right-B">{r}</h1>
+ <div className="right-T">
+ <h5><a href="https://www.bitsadmission.com/bitsat/2022/BITSAT2022MAR14.pdf" target="_blank">BITSAT Syllabus & Instructions</a></h5>
+ <h5><a href="https://www.pw.live/bitsat-previous-year-papers" target="_blank">BITSAT Previous Year</a></h5>
+ <h5><a href="https://mystudycart.com/bitsat-books" target="_blank">Best Preparation Books</a></h5>
+ </div>
+ {/* Competitive Exam-1 */}
+ <div className="left-T">
+ <h5><a href="https://androbose.in/neet-study-material/" target="_blank">NEET books PDF</a></h5>
+ <h5><a href="https://unacademy.com/content/neet-ug/study-material/" target="_blank">NEET study Material</a></h5>
+ <h5><a href="https://neelabakoretutorials.in/" target="_blank">Neela Bakhore Tutorials for NEET</a></h5>
+ </div>
+ <h1 className="left-B">{l}</h1>
+ <h3 className="C1"><a href="https://www.nta.ac.in//" target="_blank">NEET</a></h3>
+ <h1 className="right-B">{r}</h1>
+ <div className="right-T">
+ <h5><a href="https://byjus.com/neet/neet-syllabus/" target="_blank">NEET syllabus & Marks Weightage</a></h5>
+ <h5><a href="https://medicine.careers360.com/articles/neet-preparation-tips" target="_blank">NEET preparation Tips</a></h5>
+ <h5><a href="https://mystudycart.com/best-book-for-aipmt-preparation" target="_blank">Best Preparation Books</a></h5>
+ </div>
+ {/* Competitive Exam-1 */}
+ <div className="left-T">
+ <h5><a href="https://www.jeebooks.in/2020/08/pdf-download-kvpy-sa-materials-by.html" target="_blank">KVPY Books PDF</a></h5>
+ <h5><a href="https://www.examrace.com/KVPY/KVPY-Study-Material/" target="_blank">KVPY Study Material</a></h5>
+ <h5><a href="https://www.youtube.com/c/VedantuJEEEnthuseEnglish/playlists?view=50&sort=dd&shelf_id=7" target="_blank">KVPY Video Lecture</a></h5>
+ </div>
+ <h1 className="left-B">{l}</h1>
+ <h3 className="C2"><a href="http://kvpy.iisc.ac.in/main/index.htm" target="_blank">KVPY</a></h3>
+ <h1 className="right-B">{r}</h1>
+ <div className="right-T">
+ <h5><a href="https://byjus.com/jee/kvpy-syllabus/" target="_blank">KVPY Syllabus</a></h5>
+ <h5><a href="https://www.google.com/url?sa=t&rct=j&q=&esrc=s&source=web&cd=&cad=rja&uact=8&ved=2ahUKEwjPpf_cxPD5AhWM-TgGHbOqCFsQFnoECAYQAQ&url=https%3A%2F%2Fwww.quora.com%2FWhat-are-some-tips-and-tricks-to-appear-for-the-KVPY-online&usg=AOvVaw313e17LwO0n5Qmr3hdvSJ3" target="_blank">KVPY Tips and Tricks</a></h5>
+ <h5><a href="https://school.careers360.com/articles/kvpy-books-know-best-books-for-preparation" target="_blank">Best preparation Books & Marks Weightage</a></h5>
+ </div>
+ {/* Competitive Exam-1 */}
+ <div className="left-T">
+ <h5><a href="https://www.youtube.com/watch?v=r3B3dgdL2aw" target="_blank">Self Preparation Guide</a></h5>
+ <h5><a href="https://www.examrace.com/NEST/NEST-Free-Study-Material/" target="_blank">NEST Study Material</a></h5>
+ <h5><a href="https://www.examrace.com/NEST/NEST-Practice-Tests/" target="_blank">NEST Mock Test</a></h5>
+ </div>
+ <h1 className="left-B">{l}</h1>
+ <h3 className="C1"><a href="https://www.nestexam.in/" target="_blank">NEST</a></h3>
+ <h1 className="right-B">{r}</h1>
+ <div className="right-T">
+ <h5><a href="https://www.nestexam.in/docs/22/NEST2022-Syllabus.pdf" target="_blank">NEST Syllabus</a></h5>
+ <h5><a href="https://www.nestexam.in/qnsans/NEST-09.pdf" target="_blank">NEST Previous Year Paper</a></h5>
+ <h5><a href="https://www.getmyuni.com/exams/nest-reference-books" target="_blank">NEST Preparation Books</a></h5>
+ </div>
+ {/* Competitive Exam-1 */}
+ <div className="left-T">
+ <h5><a href="https://www.youtube.com/watch?v=eAkfBH4urx4" target="_blank">Self Preparation Guide</a></h5>
+ <h5><a href="https://www.youtube.com/watch?v=eAkfBH4urx4" target="_blank">Latest Study material</a></h5>
+ <h5><a href="https://www.youtube.com/watch?v=fGPhya5_wVM" target="_blank">NATA Video Lecture</a></h5>
+ </div>
+ <h1 className="left-B">{l}</h1>
+ <h3 className="C2"><a href="https://www.nata.in/" target="_blank">NATA</a></h3>
+ <h1 className="right-B">{r}</h1>
+ <div className="right-T">
+ <h5><a href="https://www.embibe.com/exams/nata-syllabus/" target="_blank">NATA syllabus</a></h5>
+ <h5><a href="https://www.embibe.com/exams/nata-previous-year-question-papers/" target="_blank">NATA Previous Year Paper,</a></h5>
+ <h5><a href="https://www.toprankers.com/nata-books" target="_blank">Best Preparation Books</a></h5>
+ </div>
+ {/* Competitive Exam-1 */}
+ <div className="left-T">
+ <h5><a href="https://www.youtube.com/playlist?list=PLqjFFrfKcY5zyoqqz7Gp1RAzU_XkaGqDA" target="_blank">NDA Video Lecture</a></h5>
+ <h5><a href="https://byjusexamprep.com/nda-na-exams/nda-exam-study-material" target="_blank">NDA Study Material</a></h5>
+ <h5><a href="https://www.upsc.gov.in/examinations/previous-question-papers/archives?field_exam_name_value=National%20Defence%20Academy" target="_blank">NDA & NA Previous Year Paper</a></h5>
+ </div>
+ <h1 className="left-B">{l}</h1>
+ <h3 className="C1"><a href="https://www.upsc.gov.in/" target="_blank">NDA & NA</a></h3>
+ <h1 className="right-B">{r}</h1>
+ <div className="right-T">
+ <h5><a href="https://www.vedantu.com/exams/nda-syllabus" target="_blank">NDA Syllabus & Marks Weightage</a></h5>
+ <h5><a href="https://www.shiksha.com/exams/nda-exam-preparation" target="_blank">NDA Preparation Tips</a></h5>
+ <h5><a href="https://recruitmentresult.com/nda-preparation-books/" target="_blank">NDA & NA Preparation Books</a></h5>
+ </div>
+ </div>
+
+ <img src="Images-public/svgs/Rocket.svg" className="svg-rocket"/>
+ <img src="Images-public/svgs/cloud.png" className="svg-cloud"/>
+ </div>
+ }
<h3 className='learn-header' id='learn'>
Learn
</h3>
@@ -105,6 +226,7 @@ const bookReaderStyle = {
</center>
</div>
<LearnMore />
+
<Footer />
{/* <!-- Back to top button --> */}