GDSC-ZHCET · Ujjwal-v19 · Jul 9, 2023 · Jul 11, 2023 · Jul 12, 2023 · Jul 13, 2023
diff --git a/package-lock.json b/package-lock.json
diff --git a/public/index.html b/public/index.html
@@ -4,28 +4,10 @@
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width, initial-scale=1">
     <link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico">
-    <!--
-      Notice the use of %PUBLIC_URL% in the tag above.
-      It will be replaced with the URL of the `public` folder during the build.
-      Only files inside the `public` folder can be referenced from the HTML.
-
-      Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
-      work correctly both with client-side routing and a non-root public URL.
-      Learn how to configure a non-root public URL by running `npm run build`.
-    -->
+
     <title>React App</title>
   </head>
   <body>
     <div id="root"></div>
-    <!--
-      This HTML file is a template.
-      If you open it directly in the browser, you will see an empty page.
-
-      You can add webfonts, meta tags, or analytics to this file.
-      The build step will place the bundled scripts into the <body> tag.
-
-      To begin the development, run `npm start`.
-      To create a production bundle, use `npm run build`.
-    -->
   </body>
 </html>
diff --git a/src/App.css b/src/App.css
@@ -1,24 +0,0 @@
-.App {
-  text-align: center;
-}
-
-.App-logo {
-  animation: App-logo-spin infinite 20s linear;
-  height: 80px;
-}
-
-.App-header {
-  background-color: #222;
-  height: 150px;
-  padding: 20px;
-  color: white;
-}
-
-.App-intro {
-  font-size: large;
-}
-
-@keyframes App-logo-spin {
-  from { transform: rotate(0deg); }
-  to { transform: rotate(360deg); }
-}

diff --git a/src/App.js b/src/App.js
@@ -1,18 +1,14 @@
 import React, { Component } from 'react';
-import logo from './logo.svg';
 import './App.css';
-
+import Footer from './Footer';
+import './footer.css';
+import Discription from './Discription';
 class App extends Component {
   render() {
     return (
       <div className="App">
-        <div className="App-header">
-          <img src={logo} className="App-logo" alt="logo" />
-          <h2>Welcome to React</h2>
-        </div>
-        <p className="App-intro">
-          To get started, edit <code>src/App.js</code> and save to reload.
-        </p>
+       <Discription/>
+       <Footer/>
       </div>
     );
   }

diff --git a/src/Discription.js b/src/Discription.js
@@ -0,0 +1,43 @@
+import React from "react";
+import './discription.css';
+function Discription() {
+  return (
+    <div className="disc">
+      <h1 className="disc-heading">Discription about Website</h1>
+      <h2 className="disc-heading2">Introduction</h2>
+      <div className="disc-para">
+        <p className="para1">
+          Welcome to Developer Library, the premier platform for college
+          students to store and share their projects. Explore an extensive
+          collection of innovative creations from aspiring developers, spanning
+          software applications, web development, mobile apps, and hardware
+          prototypes. With our user-friendly interface, finding and showcasing
+          projects has never been easier. Join our vibrant community to
+          collaborate, exchange ideas, and receive valuable feedback. Whether
+          you're a coding enthusiast or a computer science major, Developer
+          Library is your go-to destination for building a stellar portfolio and
+          gaining recognition for your talents. Discover, learn, and be inspired
+          at the Developer Library, where the future of technology is written by
+          college students like you.
+        </p>
+        <h2 className="overview">Overview</h2>
+        <p className="para2">
+          The Developer Library containing user projects is a platform where
+          users can showcase their work and share their ideas with a wider
+          audience. It serves as a hub for creativity, innovation, and
+          collaboration among students from various backgrounds. Users can
+          engage with each other by leaving comments, asking questions, or
+          providing feedback on the projects. This fosters a collaborative
+          environment where users can receive constructive input, suggestions,
+          and encouragement from their peers which boosts their confidence.
+          Overall, the Developer Library acts as a digital showcase for user's
+          projects, promoting creativity, knowledge sharing, and collaboration
+          among users. It serves as a valuable platform for users to gain
+          recognition for their work, inspire others, and contribute to the
+          broader professional community.
+        </p>
+      </div>
+    </div>
+  );
+}
+export default Discription;
diff --git a/src/Footer.js b/src/Footer.js
@@ -0,0 +1,42 @@
+import React from "react";
+import "./App.css";
+
+function Footer() {
+    return (
+    <footer class="page-footer">
+        <div class="container footer-top">
+            <div class="col-md-4 left logo-footer-column">
+                <a class="footer-brand footer-brand-svg" href="https://developers.google.com/community">
+                    <img src="https://res.cloudinary.com/startup-grind/image/upload/dpr_2.0,fl_sanitize/v1/gcs/platform-data-dsc/contentbuilder/logo_dark_stacked_5giak2X.svg" class="svg" alt="Google Developer Student Clubs logo" />
+                </a>
+                <div class="footer-description"></div>
+            </div>
+            <div class="col-md-4 left quick-links"><h5>Quick Links</h5><ul><li><a href="/chapters/" class="None">Chapters</a></li><li><a href="/events/" class="None">Upcoming events</a></li><li><a href="https://developers.google.com/community/dsc/" class="None">About GDSC</a></li><li><a href="https://docs.google.com/document/d/1e5nldTEybLG0ih3vgJQCiwH1-3QZnuFs4iwUiUerca8/view" class="None" target="_blank">Lead Terms</a></li><li><a href="/participation-terms/" class="None">Participation Terms</a></li><li><a href="https://policies.google.com/privacy" class="None">Privacy</a></li><li><a href="https://policies.google.com/terms" class="None">Terms</a></li></ul></div>
+            <div class="col-md-4 left">
+                <h5>Social</h5>
+                <ul class="social-links">
+                <li><a class="social-button icon-facebook" href="https://www.facebook.com/Google-Developers-967415219957038/" target="_blank" rel="noopener noreferrer" title="Facebook"></a></li>                    <li><a class="social-button icon-facebook" href="https://www.facebook.com/Google-Developers-967415219957038/" target="_blank" rel="noopener noreferrer" title="Facebook"></a></li>
+                    <li><a class="social-button icon-instagram" href="https://www.instagram.com/googledevs/" target="_blank" rel="noopener noreferrer" title="Instagram"></a></li>
+                    <li><a class="social-button icon-linkedin" href="https://www.linkedin.com/company/googledevelopers/" target="_blank" rel="noopener noreferrer" title="LinkedIn"></a></li>
+                    <li><a class="social-button icon-youtube" href="https://www.youtube.com/googledevelopers" target="_blank" rel="noopener noreferrer" title="YouTube"></a></li>
+                </ul>
+            </div>
+        </div>
+        <div class="footer-bottom">
+            <div class="container">
+                <div class="row">
+                    <div class="site-info">
+                        <div class="copyright">
+                            © 2023
+                            Google
+                        </div>
+                        <a href="https://www.bevy.com" class="powered_by_bevy">Powered by
+                            <img class="powered_by_bevy_image" src="/static/images/powered_by_bevy.svg" alt="Bevy logo" />
+                        </a>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </footer>)
+}
+export default Footer
diff --git a/src/discription.css b/src/discription.css
@@ -0,0 +1,47 @@
+@import url('https://fonts.googleapis.com/css2?family=Merriweather:wght@700&display=swap');
+@import url("https://fonts.googleapis.com/css2?family=Inter&display=swap");
+* {
+  margin: 0;
+  box-sizing: border-box;
+  padding: 0;
+}
+body {
+  background-color: rgb(255, 255, 255);
+}
+.disc {
+  padding: 10px 40px;
+}
+.disc-heading {
+  margin: 1% 20%;
+  padding: 20px 5px;
+  color: rgb(255, 255, 255);
+  text-transform: uppercase;
+  background-color: rgb(71, 70, 70);
+  border-style: solid;
+  border-width: 3px;
+  border-color: black;
+  border-radius: 20px;
+  text-shadow: 1px 4px 2px rgb(0, 0, 0);
+  text-align: center;
+  font-family: 'Merriweather', serif;}
+.disc-heading2 {
+  margin: 20px 0px 5px 0px;
+  padding: 5px 0px;
+  text-transform: uppercase;
+  font-family: 'Merriweather', serif; 
+}
+.para1 {
+  text-align: justify;
+  font-family: "Inter", sans-serif; 
+}
+.overview {
+  margin: 20px 0px 5px 0px;
+  padding: 5px 0px;
+  text-transform: uppercase;
+  font-family: 'Merriweather', serif;
+}
+.para2 {
+  text-align: justify;
+  font-family: "Inter", sans-serif; 
+
+}
diff --git a/src/footer.css b/src/footer.css
@@ -0,0 +1,152 @@
+/* Footer */
+/* Footer */
+/* ------ */
+footer.page-footer {
+    background-color: #fff !important;
+
+    color: #202124 !important;
+
+    border-top-color: #dadce0 !important;
+
+  border-top-width: 0 !important;
+    border-top-style: solid;
+    border-top-width: 1px !important;
+
+
+  border-bottom-width: 0 !important;
+  }
+
+  footer.page-footer .footer-brand.footer-brand-svg img {
+    height: 65px;
+  }
+
+  footer.page-footer .footer-brand.footer-brand-png img {
+    max-height: 65px;
+  }
+
+  footer.page-footer .footer-bottom {
+    background-color: #fff !important;
+
+
+  border-top-width: 0 !important;
+  }
+
+  footer.page-footer .footer-top h5,
+  footer.page-footer .join-community .follow-community {
+    font-size: 16px !important;
+
+  text-transform: none !important;
+
+  font-weight: 400 !important;
+
+  color: #676c72 !important;
+  }
+
+  footer.page-footer a {
+    color: #202124 !important;
+
+    color: #202124 !important;
+  }
+
+  footer.page-footer a:not(.social-button):not(.powered_by_bevy):not(.btn):not(.footer-copyright) {
+  font-size: 14px !important;
+
+  text-transform: none;
+
+  font-weight: normal;
+  font-weight: normal !important;
+  }
+
+  @media (min-width: 992px) {
+  footer.page-footer a:hover {
+      color: #1a73e8 !important;
+  }
+
+  footer.page-footer a:not(.social-button):hover {
+    text-decoration: none !important;
+
+  }
+  }
+
+  footer.page-footer .footer-bottom .site-info,
+  footer.page-footer .footer-bottom .site-info .footer-copyright,
+  footer.page-footer .footer-bottom .site-info a {
+    color: #202124 !important;
+
+    font-size: 14px !important;
+
+  text-transform: none !important;
+
+  font-weight: normal;
+    font-weight: normal !important;
+
+    color: #202124 !important;
+  }
+
+  footer.page-footer a.social-button {
+    color: #676c72 !important;
+  }
+
+  footer.page-footer ul.social-links li {
+    background-color: #fff !important;
+
+  }
+
+  @media (min-width: 992px) {
+  footer.page-footer ul.social-links li:hover a.social-button {
+    color: #1a73e8 !important;
+  }
+
+  footer.page-footer ul.social-links li:hover {
+    background-color: #fff !important;
+
+  }
+  }
+
+  footer.page-footer {
+    padding: 50px 0 0;
+    margin-top: -1px;
+  }
+
+  footer.page-footer hr {
+    border-top-color: #dadce0;
+    margin-top: 45px;
+  }
+
+  footer.page-footer .footer-bottom {
+    padding: 20px 0 20px;
+  }
+  @media (max-width: 992px) {
+    footer.page-footer {
+        text-align:left
+    }
+  }
+  footer.page-footer {
+    border-top: 1px solid #D7D7D7!important
+  }
+  footer.page-footer {
+    font-size: 13px;
+    height: auto
+  }
+
+  footer.page-footer .join-community .submit {
+    padding: 0;
+    height: 43px;
+    line-height: 43px
+  }
+
+  footer.page-footer .join-community .follow-sub-title {
+    color: #E5E5E5;
+    font-size: 13px
+  }
+
+  footer.page-footer h2 {
+    margin-bottom: 30px;
+    margin-top: 15px
+  }
+
+  footer.page-footer .site-info {
+    margin: 0 30px
+  }
+
+    /* end Footer */