From 0916e3a295ffd4e702de5d343e199b665dc3e421 Mon Sep 17 00:00:00 2001
From: Priyatham Sai Chand <priyathamsaichand@gmail.com>
Date: Wed, 17 Mar 2021 23:16:05 +0530
Subject: [PATCH] navbar styled bug fix
---
src/components/NavBar.js | 28 ++++++++++++++++++++++++++--
src/components/PricingPlan.js | 2 +-
src/navbar.css | 3 +--
3 files changed, 28 insertions(+), 5 deletions(-)
diff --git a/src/components/NavBar.js b/src/components/NavBar.js
index 6ad7c9f..a42b3b9 100644
--- a/src/components/NavBar.js
+++ b/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>
diff --git a/src/components/PricingPlan.js b/src/components/PricingPlan.js
index 47f860e..dc218e0 100644
--- a/src/components/PricingPlan.js
+++ b/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);
diff --git a/src/navbar.css b/src/navbar.css
index 3db417a..576d412 100644
--- a/src/navbar.css
+++ b/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;