Fix mobile navbar menu contrast
This commit is contained in:
32
css/ncue.css
32
css/ncue.css
@@ -71,11 +71,43 @@ a:hover, a:focus{ color: var(--ncue-primary-dark); }
|
||||
font-weight: 700;
|
||||
letter-spacing: -0.2px;
|
||||
}
|
||||
.navbar-default .navbar-nav>li>a,
|
||||
.navbar .nav>li>a{
|
||||
/* Ensure readable nav text on the template's white navbar + mobile collapse */
|
||||
color: rgba(15, 23, 42, 0.92) !important;
|
||||
}
|
||||
.navbar .nav>li>a:hover,
|
||||
.navbar .nav>li>a:focus{
|
||||
color: var(--ncue-primary);
|
||||
}
|
||||
|
||||
/* Active nav item: overwrite.css makes this white, which becomes invisible on white backgrounds */
|
||||
.navbar-default .navbar-nav>.active>a,
|
||||
.navbar-default .navbar-nav>.active>a:hover,
|
||||
.navbar-default .navbar-nav>.active>a:focus,
|
||||
.navbar .nav>.active>a,
|
||||
.navbar .nav>.active>a:hover,
|
||||
.navbar .nav>.active>a:focus{
|
||||
color: rgba(15, 23, 42, 0.96) !important;
|
||||
background: rgba(37, 99, 235, 0.10) !important;
|
||||
}
|
||||
|
||||
@media (max-width: 767px){
|
||||
/* Mobile collapse menu readability */
|
||||
.navbar-default .navbar-collapse{
|
||||
background: #ffffff;
|
||||
border-top: 1px solid rgba(15, 23, 42, 0.08);
|
||||
}
|
||||
.navbar-default .navbar-nav>li>a{
|
||||
padding: 12px 16px;
|
||||
border-bottom: 1px solid rgba(15, 23, 42, 0.08);
|
||||
}
|
||||
.navbar-default .navbar-nav>li>a:hover,
|
||||
.navbar-default .navbar-nav>li>a:focus{
|
||||
background: rgba(37, 99, 235, 0.08);
|
||||
}
|
||||
}
|
||||
|
||||
/* Buttons */
|
||||
.btn, .btn:focus{
|
||||
border-radius: 999px;
|
||||
|
||||
Reference in New Issue
Block a user