Merge pull request #27 from fluencelabs/stake_notification

chore: add staking bar
fluencelabs · Aug 2, 2024 · 34972ce · 34972ce
2 parents 2e086ac + cea4ef2
commit 34972ce
Show file tree

Hide file tree

Showing 3 changed files with 46 additions and 16 deletions.
diff --git a/web/src/components/Header/Header.js b/web/src/components/Header/Header.js
@@ -30,22 +30,28 @@ const Header = ({ button = false }) => {
     };
   }, []);
   return (
-    <header className={styles.header}>
-      <div className={styles["header__flex-container"]}>
-        <Link to="/fluence">
-          <img
-            src={logo}
-            alt="fluence logotype"
-            className={styles.header__logo}
-          />
-        </Link>
-
-        <MainNavigation width={currentWidthWindow} />
+    <>
+      <div className={styles["header__top_notification"]}>
+        Join the FLT Stake Race • 1 million FLT in prizes
+        <a href="https://race.fluence.network/" target="_blank" className={styles["header__top_link"]}>Learn more</a>
       </div>
-      {button && currentWidthWindow > 768 && (
-        <Button type="default" text="Start building" callback={handleClick} />
-      )}
-    </header>
+      <header className={styles.header}>
+        <div className={styles["header__flex-container"]}>
+          <Link to="/fluence">
+            <img
+              src={logo}
+              alt="fluence logotype"
+              className={styles.header__logo}
+            />
+          </Link>
+
+          <MainNavigation width={currentWidthWindow} />
+        </div>
+        {button && currentWidthWindow > 768 && (
+          <Button type="default" text="Start building" callback={handleClick} />
+        )}
+      </header>
+    </>
   );
 };
 

diff --git a/web/src/components/Header/Header.module.css b/web/src/components/Header/Header.module.css
@@ -11,6 +11,30 @@
   align-items: center;
 }
 
+.header__top_notification {
+  position: relative;
+  top: 0px;
+  width: 100vw;
+  text-align: center;
+  padding-top: 0;
+  margin-top: -30px;
+  padding-top: 24px;
+  padding-bottom: 20px;
+  margin-bottom: 20px;
+  letter-spacing: .1px;
+  font-size: 19px;
+  font-weight: 700;
+  line-height: 131.25%;
+  background-color: #cfffc4;
+  z-index: 9999999;
+  font-family: Hauora, sans-serif;
+}
+
+.header__top_link {
+  margin-left: 16px;
+  color: #000000;
+}
+
 .header__logo {
   width: 118px;
   height: 32px;

diff --git a/web/src/pages/begin-page/begin-page.module.css b/web/src/pages/begin-page/begin-page.module.css
@@ -1,5 +1,5 @@
 .background {
-  padding-top: 54px;
+  padding-top: 30px;
 
   background: rgba(177, 169, 153, 1);
   background-image: url("../../images/Rectangle 76.21553159.webp");