navbar styled bug fix

src/components/NavBar.js

@@ -5,6 +5,8 @@ import UserContext from "../context/UserContext";
 import styled,{ css } from 'styled-components';
 
 const Header = styled.header`
+
+@import url('https://fonts.googleapis.com/css?family=Montserrat|Ubuntu');
   background: #66bfbf;
   position: fixed;
   top: 0;
@@ -39,14 +41,37 @@ const Header = styled.header`
   transition: 0.6s;
 
    }
+`;
+const ListElement = styled.li`
+
+`;
+const Anchor = styled.a`
+
+
 `;
 const List = styled.ul`
   ${Header};
-  & li {
+
+  position: relative;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  & ${ListElement} {
   position: relative;
   list-style:none;
 
   }
+  & ${ListElement} ${Anchor} {
+    position: relative;
+    margin: 5px 15px;
+    text-transform: uppercase;
+    color: #fff;
+    letter-spacing: 2px;
+    font-weight: 500px;
+    padding: 3px 0;
+    transition: 0.6s;
+
+  }
   
 
 `;
@@ -83,7 +108,6 @@ export default function NavBar() {
   return (
     <div className="navbar">
       <Header sticky = {scrolled} >
-        <input type="checkbox" id="check" />
        
         <a href="/" className="logo">locaft</a>
         <ul>

src/components/PricingPlan.js

@@ -67,7 +67,7 @@ const Pricing = styled.section`
 
 
     }
-    ${props => props.pricing_id == props.pricing_plan ? css`
+    ${props => props.pricing_id === props.pricing_plan ? css`
         box-shadow: 0 0 15px rgba(0,0,0,0.4);
         transform: scale(1.05);
 

src/navbar.css

@@ -1,4 +1,3 @@
-@import url('https://fonts.googleapis.com/css?family=Montserrat|Ubuntu');
 * {
 
   box-sizing: border-box;
@@ -68,7 +67,7 @@ header ul li a  {
 
 
 }
-header ul li a button:before{
+header ul li a {
   position: absolute;
   content: '';
   left:0;