Merge pull request #867 from Edwinliby/old-dev

Pathway page updated, but not responsive

src/App.js

@@ -49,6 +49,7 @@ import MaveliPortfolio from "./Pages/Events/MaveliPortfolio/MaveliPortfolio";
 import Level1 from "./Pages/CapTF/Level1";
 import Spiderman from "./Pages/CapTF/Spiderman";
 import Submission from "./Pages/CapTF/Submission";
+import Pathway from "./Pages/Pathway/Pathway";
 function App() {
   const [redirects, setRedirects] = useState([]);
   const [isLoaded, setIsLoaded] = useState(false);
@@ -143,6 +144,7 @@ function App() {
             />
             <Route path="/yipredirect" element={<YipForm />} />
             <Route path="/journey" element={<Journey />} />
+            <Route path="/pathway" element={<Pathway />} />
           </Route>
 
           <Route path="/level1" element={<Level1 />} />

src/Pages/Pathway/Pathway.jsx

@@ -0,0 +1,23 @@
+import React from 'react'
+import styles from './Pathway.module.css'
+import Navbar from './components/Navbar/menubar'
+import Mainpage from './components/HeroSection/mainpage'
+import Whatispathway from './components/About/About'
+import CourseOverview from './components/course Overview/CourseOverview'
+import Whoshouldattend from './components/WhoShouldAttend/WhoShouldAttend'
+import Contact from './components/contact/Contact'
+
+export default function Pathway() {
+    return (
+        <>
+            <Navbar />
+            <Mainpage />
+            <div className={styles.pathway}>
+                <CourseOverview />
+                <Whoshouldattend />
+                <Whatispathway />
+            </div>
+            <Contact />
+        </>
+    )
+}

src/Pages/Pathway/Pathway.module.css

@@ -0,0 +1,10 @@
+.pathway {
+    padding: 0 4rem;
+    background-color: #F5F5F5;
+}
+
+@media(width<=820px) {
+    .pathway {
+        padding: 0 1rem;
+    }
+}

src/Pages/Pathway/components/About/About.jsx

@@ -0,0 +1,34 @@
+import React from "react"
+import styles from './About.module.css'
+import img3 from "../../assets/img3.webp";
+
+export default function About() {
+    return (
+        <div id="about" className={styles.About}>
+            <div class={styles.Overview_container_head}>
+                <hr />
+                <p>What is Pathway</p>
+            </div>
+            <div class={styles.WhatIsPathway_main}>
+                <div class={styles.WhatIsPathway_img}>
+                    <img src={img3} alt="" />
+                </div>
+                <div class={styles.WhatIsPathway_desc}>
+                    <p>
+                        <span>Pathway</span> is an open framework for high-throughput and low-latency
+                        <span>real-time data processing</span>. It is used to create Python code which seamlessly combines
+                        <span>batch processing, streaming, and real-time API's</span>
+                        for LLM apps. Pathway's distributed runtime (🦀-🐍) provides
+                        <span>fresh results of your data pipelines</span>
+                        whenever new inputs and requests are received.
+                    </p>
+                    <br />
+                    <p>Pathway provides a high-level programming interface in Python for defining data transformations, aggregations, and other
+                        <span>operations on data streams</span>. With Pathway, you can effortlessly <span>design and deploy sophisticated data workflows</span>
+                        that efficiently handle high volumes of data in real time.
+                    </p>
+                </div>
+            </div>
+        </div>
+    )
+}

src/Pages/Pathway/components/About/About.module.css

@@ -0,0 +1,56 @@
+.About{
+    padding: 1rem 0;
+}
+
+.Overview_container_head {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    padding: 5rem;
+    gap: 2rem;
+    position: relative;
+}
+
+.Overview_container_head hr {
+    width: 100%;
+    background-color: #1C1CF0;
+    height: .25rem;
+}
+
+.Overview_container_head p {
+    position: absolute;
+    background-color: #F5F5F5;
+    padding: 0 1.5rem;
+    color: #000;
+    font-size: 3rem;
+    font-weight: 900;
+    width: max-content;
+}
+
+.WhatIsPathway_main {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    padding-left: 3rem;
+    padding-right: 8rem;
+    margin: 3rem;
+}
+
+.WhatIsPathway_img img {
+    width: 60%;
+}
+
+.WhatIsPathway_img {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+}
+
+.WhatIsPathway_desc {
+    width: 80%;
+    font-size: 1.2rem;
+}
+
+.WhatIsPathway_desc span {
+    font-weight: 800;
+}

src/Pages/Pathway/components/HeroSection/mainpage.jsx

@@ -0,0 +1,40 @@
+import React from "react"
+import styles from "./mainpage.module.css"
+import img2 from "../../assets/img2.webp";
+import pre from "../../assets/pre.png";
+
+export default function mainpage() {
+    return (
+        <div id="heroSection" className={styles.mainpage}>
+            <section className={styles.First}>
+                <div className={styles.Container}>
+                    <div className={styles.Container_image_one}>
+                        <img src={img2} />
+                    </div>
+                    <div className={styles.Container_desc}>
+                        <div className={styles.Container_head}>
+                            Breaking into <br />
+                            <span className={styles.Head_two}>Artificial<br />Intelligence</span>
+                        </div>
+                        <div className={styles.Container_img_two}>
+                            A µLearn x <span style={{ color: "#39D3F4", backgroundColor: "transparent" }}>Pathway</span> Initiative.
+                        </div>
+                        <div className={styles.Container_button}>
+                            <button className={styles.Container_button_one}>
+                                <img src={pre} alt="" /> Pre apply
+                            </button>
+                            <button className={styles.Container_button_two}>Explore Beta</button>
+                        </div>
+                    </div>
+                </div>
+                <p className={styles.desc}>
+                    Join us on an exciting adventure into the world of <b>Artificial Intelligence (AI)</b> through our collaborative <br />
+                    initiative with Pathway. In this comprehensive course.
+                </p>
+            </section>
+            <p className={styles.Lower_red}>
+                Only <b> 20 individuals </b> will be selected for the <b> beta cohort,</b> while the remaining applicants will be placed on a waiting list.
+            </p>
+        </div>
+    )
+}