Added blue div for active link

This commit is contained in:
cyril lopez 2017-07-28 14:38:17 +02:00
parent 4a91cd0e73
commit 1228e27a4e
3 changed files with 13 additions and 1 deletions

View File

@ -23,6 +23,7 @@ class HeaderNav extends React.Component { // eslint-disable-line react/prefer-st
const notifActive = link.active ? <div className={styles.notifPoint} /> : '';
return (
<Link key={key} className={styles.headerLink} to={`${baseUrl}/${link.name}`} activeClassName={styles.linkActive}>
<div></div>
<div className={`${styles.linkText} text-center`}>
{link.name}
{notifActive}

View File

@ -9,6 +9,7 @@
}
.headerLink {
position: relative;
display: flex;
flex: 1 100%;
height: 4rem;
@ -25,6 +26,16 @@
background-color: #FFFFFF;
font-weight: bold;
text-decoration: none !important;
> div {
&:first-child {
position: absolute;
height: 0.3rem;
top: 0rem;
width: 100%;
background-color: #1C5DE7;
}
}
}
.linkText {

View File

@ -4,7 +4,7 @@
background: #fff !important;
}
.baseline {
// display: none;
display: none;
z-index: 100001;
opacity: .2;
position: absolute;