Merge pull request #38 from One-Click-Auth/revert-37-navbar

Revert "made navbar non sticky and fixed blur bug"
One-Click-Auth · Oct 15, 2023 · 4e6088c · 4e6088c
2 parents cc5177c + c73d54f
commit 4e6088c
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 16 deletions.
diff --git a/src/components/Navbar.tsx b/src/components/Navbar.tsx
@@ -56,7 +56,7 @@ const ExternalLinks = () => (
 function Navbar() {
   return (
     <>
-      <div className="  flex w-full justify-between  bg-[#000000]  px-14 text-white   md:py-[18px]">
+      <div className="fixed z-[1000] flex w-full justify-between border-b-[0.5px] border-[#696C70] bg-[#00000068] px-6 text-white mix-blend-luminosity backdrop-blur-[75px] md:py-3">
         {/*Internal Links*/}
         <div className="flex items-center gap-7">
           <TrustAuthXLogo />
@@ -66,7 +66,7 @@ function Navbar() {
                 target={link.name === "Pricing" ? "" : "_blank"}
                 href={link.link}
                 key={link.name}
-                className="font-medium "
+                className="font-medium mix-blend-exclusion"
               >
                 {link.name}
               </Link>

diff --git a/src/styles/globals.css b/src/styles/globals.css
@@ -141,8 +141,7 @@
 
   .showcase-4 {
     background: linear-gradient(47deg, #0e2bfd 0%, #0cf 100%);
-    box-shadow:
-      0px 10px 50px -2.5px rgba(0, 0, 0, 0.1),
+    box-shadow: 0px 10px 50px -2.5px rgba(0, 0, 0, 0.1),
       0px 2.28853px 11.4427px -1.66667px rgba(0, 0, 0, 0.1),
       0px 0.60219px 3.01094px -0.83333px rgba(0, 0, 0, 0.1);
   }
@@ -165,8 +164,7 @@
 
   .showcase-9 {
     background: linear-gradient(302deg, #00f6ff 0%, #2b00ff 100%);
-    box-shadow:
-      0px 10px 50px -2.5px rgba(0, 0, 0, 0.1),
+    box-shadow: 0px 10px 50px -2.5px rgba(0, 0, 0, 0.1),
       0px 2.28853px 11.4427px -1.66667px rgba(0, 0, 0, 0.1),
       0px 0.60219px 3.01094px -0.83333px rgba(0, 0, 0, 0.1);
   }
@@ -180,16 +178,14 @@
   }
 
   .showcase-6-shadow {
-    box-shadow:
-      0px 10px 50px -3.75px rgba(0, 0, 0, 0.01),
+    box-shadow: 0px 10px 50px -3.75px rgba(0, 0, 0, 0.01),
       0px 2.28853px 11.4427px -2.5px rgba(0, 0, 0, 0.03),
       0px 0.60219px 3.01094px -1.25px rgba(0, 0, 0, 0.04);
   }
 
   .showcase-7 {
     background: linear-gradient(133deg, #00aeff 0%, #00ff6e 100%);
-    box-shadow:
-      0px 10px 50px -2.5px rgba(0, 0, 0, 0.1),
+    box-shadow: 0px 10px 50px -2.5px rgba(0, 0, 0, 0.1),
       0px 2.28853px 11.4427px -1.66667px rgba(0, 0, 0, 0.1),
       0px 0.60219px 3.01094px -0.83333px rgba(0, 0, 0, 0.1);
   }
@@ -200,16 +196,14 @@
       #c499e6 0%,
       rgba(255, 255, 255, 0.4) 100%
     );
-    box-shadow:
-      0px 10px 50px -2.5px rgba(0, 0, 0, 0.1),
+    box-shadow: 0px 10px 50px -2.5px rgba(0, 0, 0, 0.1),
       0px 2.28853px 11.4427px -1.66667px rgba(0, 0, 0, 0.1),
       0px 0.60219px 3.01094px -0.83333px rgba(0, 0, 0, 0.1);
   }
 
   .showcase-3 {
     background: linear-gradient(233deg, #faffc6 -19.83%, #e00 84.46%);
-    box-shadow:
-      0px 10px 50px -2.5px rgba(0, 0, 0, 0.1),
+    box-shadow: 0px 10px 50px -2.5px rgba(0, 0, 0, 0.1),
       0px 2.28853px 11.4427px -1.66667px rgba(0, 0, 0, 0.1),
       0px 0.60219px 3.01094px -0.83333px rgba(0, 0, 0, 0.1);
   }
@@ -219,8 +213,7 @@
     background: linear-gradient(238deg, #60f 0%, #f700ff 100%);
 
     background-size: cover;
-    box-shadow:
-      0px 10px 50px -2.5px rgba(0, 0, 0, 0.1),
+    box-shadow: 0px 10px 50px -2.5px rgba(0, 0, 0, 0.1),
       0px 2.28853px 11.4427px -1.66667px rgba(0, 0, 0, 0.1),
       0px 0.60219px 3.01094px -0.83333px rgba(0, 0, 0, 0.1);
   }