IterRoboticsClub · Ashis-007 · Mar 31, 2020 · Mar 31, 2020 · Apr 2, 2020 · Apr 25, 2020
diff --git a/.gitignore b/.gitignore
@@ -0,0 +1,4 @@
+imageURL.txt
+node_modules
+.vscode
+package-lock.json
diff --git a/about.html b/about.html
@@ -0,0 +1,108 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>About Us | ITER ROBOTICS CLUB</title>
+    <link rel="stylesheet" href="./assets/css/style.css" />
+    <link rel="stylesheet" href="./assets/css/about.css" />
+    <link
+      href="https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700&display=swap"
+      rel="stylesheet"
+    />
+  </head>
+  <body>
+    <header>
+      <nav>
+        <div class="brand">
+          <a href="./index.html"
+            ><img
+              class="logo"
+              src="https://static.wixstatic.com/media/fcb8e7_e1093d7e7fe6430a9b8c0184805d177d~mv2.png/v1/crop/x_322,y_0,w_606,h_629/fill/w_99,h_81,al_c,q_85,usm_0.66_1.00_0.01/IRC_1.webp
+                      "
+              alt="logo"
+          /></a>
+          <a href="./index.html">
+            <h2 class="brand-title">ITER Robotics Club</h2>
+          </a>
+        </div>
+
+        <div class="burger">
+          <img src="./assets/images/ham.svg" alt="Hamburger menu" />
+        </div>
+
+        <div class="nav-items">
+          <ul class="nav-links hide-mobile show-desktop">
+            <li class="nav-link">
+              <img src="./assets/images/close.svg" alt="" class="close-btn" />
+            </li>
+            <li><a href="./index.html">HOME</a></li>
+            <li><a href="#">GALLERY</a></li>
+            <li><a href="./support.html">SUPPORT</a></li>
+            <li><a href="#">HELP</a></li>
+            <li><a href="./about.html">ABOUT US</a></li>
+          </ul>
+        </div>
+      </nav>
+    </header>
+
+    <main>
+      <div class="container">
+        <h3 class="heading">About Us</h3>
+        <p>
+          The need for a technical club which would incorporate the principles
+          of all engineering branches onto a common platform was felt by the
+          dynamic students of the college, as a result of which the iter
+          robotics club was initiated in the year <strong>2007</strong>.
+        </p>
+
+        <p>
+          It is an <strong>open club</strong>, co-ordinated by the students,
+          functioning in the interest of students of the institution wishing to
+          have a practical application of their knowledge base, gained from the
+          classrooms.
+        </p>
+        <p>
+          We at iter robotics club constantly have been working for the
+          spreading of technical awareness in the field of robotics .
+        </p>
+        <p>
+          We beileve in creating local hotpots of technical knowledge for the
+          proper access to technology to the engineering fraternity. We believe
+          in putting theories into practice in day to day life making process
+          easier for humans
+        </p>
+        <p>
+          The worldwide developments in the field of robotics today has
+          obviously encouraged whooping number of students taking ‘robotics’
+          into something more than just a hobby.
+        </p>
+
+        <p>
+          Presently, the IRC has more than <strong>100+</strong> registered
+          student members from various branches who have shown their excellence
+          by winning robotics competitions throughout the nation.
+        </p>
+      </div>
+    </main>
+
+    <footer class="footer">
+      <div class="social-icons">
+        <a href="https://www.facebook.com/IterRoboticsClub"
+          ><img class="fb" src="./assets/images/facebook.svg" alt=""
+        /></a>
+        <a href="https://twitter.com/IRC_ITER"
+          ><img src="./assets/images/twitter.svg" alt=""
+        /></a>
+        <a href="https://www.youtube.com/channel/UC6g_TZYUIqhkAgU7KS6SB4Q"
+          ><img src="./assets/images/youtube.svg" alt=""
+        /></a>
+        <a href="https://www.instagram.com/iter_robotics_club/"
+          ><img src="./assets/images/instagram.svg" alt=""
+        /></a>
+      </div>
+    </footer>
+
+    <script src="./assets/js/app.js"></script>
+  </body>
+</html>
diff --git a/app.js b/app.js
@@ -0,0 +1,31 @@
+const express = require("express"),
+  app = express(),
+  mongoose = require("mongoose"),
+  bodyParser = require("body-parser"),
+  methodOverride = require("method-override"),
+  expressSanitizer = require("express-sanitizer");
+
+const blogRoutes = require("./routes/blog");
+
+app.set("view engine", "ejs");
+app.use(express.static("public"));
+app.use(bodyParser.urlencoded({ extended: true }));
+app.use(expressSanitizer());
+app.use(methodOverride("_method"));
+
+app.use("/blogs", blogRoutes);
+
+mongoose
+  .connect("mongodb://localhost/irc_blog", {
+    useNewUrlParser: true,
+    useUnifiedTopology: true,
+    useFindAndModify: true,
+  })
+  .then(() => {
+    console.log("===DB Connected===");
+  })
+  .catch((err) => {
+    console.log(err);
+  });
+
+app.listen(5000);
diff --git a/assets/css/about.css b/assets/css/about.css
@@ -0,0 +1,23 @@
+.container {
+  width: 100vw;
+  padding: 2em;
+  background-color: #f6f6f6;
+}
+
+.heading {
+  font-size: 3rem;
+  padding-bottom: 1.5rem;
+}
+
+.container p {
+  font-size: 1.8rem;
+  padding-bottom: 2rem;
+}
+
+@media (min-width: 900px) {
+  .container {
+    width: 80%;
+    margin: 0 auto;
+    height: 80vh;
+  }
+}
diff --git a/assets/css/gallery.css b/assets/css/gallery.css
@@ -0,0 +1,52 @@
+.container {
+  width: 100%;
+  margin: 2em auto;
+  text-align: center;
+}
+
+.container img {
+  width: 90vw;
+}
+
+@media (min-width: 900px) {
+  .container {
+    width: 80%;
+  }
+
+  .container img {
+    width: 30%;
+    cursor: pointer;
+  }
+
+  .fade {
+    display: inline-block;
+    position: relative;
+    width: 30%;
+    height: auto;
+  }
+
+  .fade img {
+    width: 100%;
+  }
+
+  .fade::after {
+    content: "Senior instructing juniors";
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    color: white;
+    font-size: 2rem;
+    position: absolute;
+    top: 0;
+    left: 0;
+    height: 100%;
+    width: 100%;
+    background: #000;
+    opacity: 0;
+    transition: all 0.5s ease;
+  }
+
+  .fade:hover::after {
+    opacity: 0.5;
+  }
+}
diff --git a/assets/css/index.css b/assets/css/index.css
@@ -0,0 +1,122 @@
+/* body */
+
+.container {
+  max-width: 100%;
+  height: auto;
+  margin: 2em auto;
+  text-align: center;
+}
+
+.back-image img {
+  width: 100vw;
+  margin-bottom: 2rem;
+}
+
+.tagline {
+  margin-bottom: 2rem;
+}
+
+.tagline h2 {
+  font-size: 1.6rem;
+  color: #2b2a29;
+}
+
+.club-register {
+  margin-top: 6rem;
+}
+
+.club-register h3 {
+  font-size: 1.8rem;
+  padding-bottom: 0.5rem;
+}
+
+.btn.register {
+  padding: 0.5rem 4rem;
+  border-radius: 3em;
+  background-color: #0084ff;
+}
+
+.btn.register a {
+  color: white;
+  font-size: 2.4rem;
+}
+
+.other-info {
+  margin: 6rem auto;
+}
+
+.other-info .btn {
+  border: 2px solid #0084ff;
+  padding: 1rem 3rem;
+  border-radius: 1.7rem;
+}
+
+.other-info a {
+  font-size: 2.3rem;
+  font-weight: 600;
+}
+
+.other-info p {
+  font-size: 1.8rem;
+}
+
+.other-info .btn:hover {
+  cursor: pointer;
+  background-color: #0084ff;
+}
+
+/* desktop version */
+
+@media (min-width: 950px) {
+  .container {
+    width: 85%;
+    margin: 0 auto;
+  }
+
+  .back-image img {
+    width: 100%;
+    margin: 2em auto;
+  }
+
+  .tagline h2 {
+    font-size: 4rem;
+    color: rgba(30, 30, 30, 0.9);
+  }
+
+  .club-register h3 {
+    font-size: 3rem;
+  }
+
+  .btn.register {
+    width: 25%;
+    height: auto;
+    padding: 3em auto;
+  }
+
+  .btn.register a {
+    letter-spacing: 0.2rem;
+    color: white;
+    font-size: 2.7rem;
+  }
+
+  .btn.register:hover {
+    box-shadow: 0px 3px 5px #979797;
+    cursor: pointer;
+  }
+
+  .other-info a {
+    font-size: 3rem;
+    font-weight: 600;
+    letter-spacing: 0.3rem;
+  }
+
+  .other-info p {
+    font-size: 2.3rem;
+    letter-spacing: 0.2rem;
+  }
+
+  .other-info .btn {
+    width: 30%;
+    margin: 3em auto;
+  }
+}