Header nav menu responsiveness improvements

4.x.x
thusithakalugamage 8 years ago
parent 7d7977cbdc
commit 909e7836ca

@ -30,13 +30,11 @@
</button> </button>
{{defineZone "navbarHeader"}} {{defineZone "navbarHeader"}}
</div> </div>
<div class="navbar-collapse collapse" aria-expanded="false"> <div id="navbar" class="navbar-collapse collapse" aria-expanded="false">
<ul class="nav navbar-nav"> <ul class="nav navbar-nav">
{{defineZone "navbarCollapsableLeftItems"}} {{defineZone "navbarCollapsableLeftItems"}}
</ul> </ul>
<ul class="nav navbar-nav navbar-right"> {{defineZone "navbarCollapsableRightItems"}}
{{defineZone "navbarCollapsableRightItems"}}
</ul>
</div> </div>
</div> </div>
{{defineZone "navbarBelow"}} {{defineZone "navbarBelow"}}

@ -3054,7 +3054,7 @@ tbody.collapse.in {
right: auto; right: auto;
} }
} }
@media (max-width : 480px) { @media (max-width : 768px) {
.navbar-right .dropdown-menu-right { .navbar-right .dropdown-menu-right {
left: auto; left: auto;
right: 0; right: 0;
@ -3901,6 +3901,33 @@ tbody.collapse.in {
margin-right: 0; margin-right: 0;
} }
} }
@media (max-width: 768px) {
.navbar-right {
margin-right: -15px;
}
.navbar-default .navbar-toggle{
}
.navbar-default .navbar-toggle .icon-bar{
background-color:#fff!important;
}
.navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus{
background-color:#526a84!important;
}
.navbar-default .navbar-toggle:hover .icon-bar, .navbar-default .navbar-toggle:focus .icon-bar{
background-color:#798EA5!important;
}
.navbar-toggle {
margin-right: 10px;
padding: 13px;
margin-top: 0px;
margin-bottom: 0px;
}
#navbar .navbar-nav{
margin:0px;
border-bottom:1px solid #798EA5;
}
}
.navbar-default { .navbar-default {
background-color: #f8f8f8; background-color: #f8f8f8;
border-color: #e7e7e7; border-color: #e7e7e7;

Loading…
Cancel
Save