replaced the optronic polar flipper

KaiDevrim · Jan 18, 2022 · 1373f9f · 1373f9f
1 parent c49d530
commit 1373f9f
Show file tree

Hide file tree

Showing 9 changed files with 114 additions and 183 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -13,7 +13,7 @@
     "react-dom": "^17.0.2",
     "react-icons": "^4.3.1",
     "react-scripts": "5.0.0",
-    "styles": "link:@mui/core/styles",
+    "styles": "file:@mui/core/styles",
     "web-vitals": "^2.1.3"
   },
   "scripts": {

diff --git a/src/App.css b/src/App.css
@@ -1,16 +1,18 @@
+@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;800&display=swap');
+
 * {
-    box-sizing: border-box;
-    padding: 0;
-    margin: 0;
-    scroll-behavior: smooth;
+  box-sizing: border-box;
+  padding: 0;
+  margin: 0;
+  scroll-behavior: smooth;
 }
 
 body {
-    background: var(--color-bg);
+  background: var(--color-bg);
 }
 
 a {
-    color: unset;
+  color: unset;
 }
 
 a,
@@ -19,85 +21,85 @@ a:visited,
 a:focus,
 a:hover,
 a:active {
-    text-decoration: none;
+  text-decoration: none;
 }
 
-.gradient_bg {
-    /* ff 3.6+ */
-    background: -moz-radial-gradient(circle at 3% 25%, rgba(137, 141, 196, 1) 0%, rgba(39, 40, 56, 1) 100%);
-
-    /* safari 5.1+,chrome 10+ */
-    background: -webkit-radial-gradient(circle at 3% 25%, rgba(137, 141, 196, 1) 0%, rgba(39, 40, 56, 1) 100%);
-
-    /* opera 11.10+ */
-    background: -o-radial-gradient(circle at 3% 25%, rgba(137, 141, 196, 1) 0%, rgba(39, 40, 56, 1) 100%);
-
-    /* ie 10+ */
-    background: -ms-radial-gradient(circle at 3% 25%, rgba(137, 141, 196, 1) 0%, rgba(39, 40, 56, 1) 100%);
+.app_bg {
+  /* ff 3.6+ */
+  background-color: #272838;
+}
 
-    /* global 92%+ browsers support */
-    background: radial-gradient(circle at 3% 25%, rgba(137, 141, 196, 1) 0%, rgba(39, 40, 56, 1) 100%);
+.theta_header-text {
+  color: white;
+  font-weight: 800;
 }
 
-.gradient_text {
-    background: var(--gradient--text);
-    -webkit-background-clip: text;
+.theta_header-desc {
+    color: var(--color-subtext);
     background-clip: text;
+    font-weight: 500;
 }
 
+.theta_header-text-span {
+    color: var(--color-subtext);
+}
+
+
 .section_padding {
-    padding: 1rem 6rem;
+  padding: 1rem 6rem;
+  margin-top: 60px;
 }
 
 .section_margin {
-    margin: 4rem 6rem;
+  margin: 4rem 6rem;
 }
 
 .scale-up-center {
-    -webkit-animation: scale-up-center 0.4s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
-    animation: scale-up-center 0.4s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
+  -webkit-animation: scale-up-center 0.4s cubic-bezier(0.39, 0.575, 0.565, 1)
+    both;
+  animation: scale-up-center 0.4s cubic-bezier(0.39, 0.575, 0.565, 1) both;
 }
 
 @-webkit-keyframes scale-up-center {
-    0% {
-        -webkit-transform: scale(0.5);
-        transform: scale(0.5);
-    }
-
-    100% {
-        -webkit-transform: scale(1);
-        transform: scale(1);
-    }
+  0% {
+    -webkit-transform: scale(0.5);
+    transform: scale(0.5);
+  }
+
+  100% {
+    -webkit-transform: scale(1);
+    transform: scale(1);
+  }
 }
 
 @keyframes scale-up-center {
-    0% {
-        -webkit-transform: scale(0.5);
-        transform: scale(0.5);
-    }
-
-    100% {
-        -webkit-transform: scale(1);
-        transform: scale(1);
-    }
+  0% {
+    -webkit-transform: scale(0.5);
+    transform: scale(0.5);
+  }
+
+  100% {
+    -webkit-transform: scale(1);
+    transform: scale(1);
+  }
 }
 
 @media screen and (max-width: 700px) {
-    .section_padding {
-        padding: 4rem
-    }
+  .section_padding {
+    padding: 4rem;
+  }
 
-    .section_margin {
-        margin: 4rem
-    }
+  .section_margin {
+    margin: 4rem;
+  }
 }
 
 @media screen and (max-width: 550px) {
-    .section_padding {
-        padding: 4rem 2rem;
-    }
-
-    .section_margin {
-        margin: 4rem 2rem;
-    }
-}
+  .section_padding {
+    padding: 4rem 2rem;
+  }
+
+  .section_margin {
+    margin: 4rem 2rem;
+  }
+}
diff --git a/src/App.js b/src/App.js
@@ -15,7 +15,7 @@ import {
 } from "./containers";
 const App = () => (
   <div className="App">
-    <div className="gradient_bg">
+    <div className="app_bg">
       <Navbar />
       <Header />
       <Accomplishments />

diff --git a/src/components/navbar/Navbar.jsx b/src/components/navbar/Navbar.jsx
@@ -6,20 +6,11 @@ import "./navbar.css";
 const Menu = () => (
   <>
     <p>
-      <a href="#home">Home</a>
-    </p>
-    <p>
-      <a href="#accomplishments">Accomplishments</a>
+      <a href="#about">About</a>
     </p>
     <p>
       <a href="#schedule">Schedule</a>
     </p>
-    <p>
-      <a href="#merch">Merch</a>
-    </p>
-    <p>
-      <a href="#prizes">Prizes</a>
-    </p>
     <p>
       <a href="#volunteers">Volunteers</a>
     </p>

diff --git a/src/containers/accomplishments/accomplishments.css b/src/containers/accomplishments/accomplishments.css
@@ -2,6 +2,7 @@
     width: 100%;
 }
 
+
 .theta_accomplishments-heading h1 {
     font-family: var(--font-family);
     color: #fff;

diff --git a/src/containers/header/Header.jsx b/src/containers/header/Header.jsx
@@ -5,18 +5,9 @@ export const Header = () => {
   return (
     <div className="theta_header section_padding" id="home">
       <div className="theta_header-content">
-        <h1 className="gradient_text">
-          ThetaHacks II will return this April for an even bigger and better
-          Hackathon.
-        </h1>
-        <p>
-          Excepteur est et culpa do eu incididunt aute esse. Minim laborum do
-          sit sint dolor culpa qui ut laborum incididunt excepteur. Do voluptate
-          nulla tempor duis veniam mollit do aute et est consectetur do. Mollit
-          qui eiusmod exercitation nostrud nisi voluptate tempor officia ipsum.
-          Adipisicing exercitation excepteur qui deserunt aute ullamco officia
-          voluptate pariatur. Consectetur qui reprehenderit reprehenderit magna
-          adipisicing elit eu velit. Amet tempor ad culpa minim.
+        <h1 className="theta_header-text">ThetaHacks II <span className="theta_header-text-span">is here.</span></h1>
+        <p className="theta_header-desc">
+          36 hours. $20k in prizes. What will you build?
         </p>
 
         <div className="theta_header-content_input">
@@ -28,14 +19,6 @@ export const Header = () => {
               Discord
             </a>
           </div>
-          <div className="theta_header-content_input-email">
-            <form class="email-form" action="/subscribe" method="POST">
-              <input type="text" class="subscribe-input" placeholder="Email" />
-              <a href="" class="subscribe-button">
-                Subscribe
-              </a>
-            </form>
-          </div>
         </div>
       </div>