advanced-css-course
advanced-css-course copied to clipboard
Natours project issue with navigation Links
The header links or navigation bar links in the Natours project are not visible since the opacity is 0 however they can still be clicked without opening the header by clicking at the left side of the form. To fix this problem you should add the following pieces of code to the _navigation.scss:
&__link { &:link, &:visited { display: inline-block;
//add this visibility visibility: hidden;
font-size: 3rem;
font-weight: 300;
padding: 1rem 2rem;
color: $color-white;
text-decoration: none;
text-transform: uppercase;
background-image: linear-gradient(120deg, transparent 0%, transparent 50%, $color-white 50%);
background-size: 230%;
transition: all 0.4s;
span {
margin-right: 1.5rem;
display: inline-block;
}
}
&__checkbox:checked ~ &__nav &__link {
visibility: visible;
}
@Richard-Younes If it would be possible then can you assign me to this issue I want to resolve this would be my first contribution