Change navbar behavior on mobile devices to lower its height
| | |
| | | font-size: 21px; |
| | | } |
| | | |
| | | /* Change navbar behavior for low media width */ |
| | | .navbar-nav { |
| | | float: left; |
| | | margin: 0; |
| | | } |
| | | .nav > li { |
| | | float: left; |
| | | } |
| | | .navbar-nav > li > a { |
| | | padding-top: 15px; |
| | | padding-bottom: 15px; |
| | | } |
| | | .navbar-left { |
| | | float: left !important; |
| | | } |
| | | .navbar-form { |
| | | width: auto; |
| | | padding-top: 0; |
| | | padding-bottom: 0; |
| | | margin-right: 0; |
| | | margin-left: 0; |
| | | border: 0; |
| | | -webkit-box-shadow: none; |
| | | box-shadow: none; |
| | | } |
| | | |
| | | /* Loading animation */ |
| | | nav.loading { |
| | | background-image: -webkit-linear-gradient(45deg,rgba(0,0,0,.1) 25%,transparent 25%,transparent 50%,rgba(0,0,0,.1) 50%,rgba(0,0,0,.1) 75%,transparent 75%,transparent); |
| | | background-image: -o-linear-gradient(45deg,rgba(0,0,0,.1) 25%,transparent 25%,transparent 50%,rgba(0,0,0,.1) 50%,rgba(0,0,0,.1) 75%,transparent 75%,transparent); |
| | |
| | | <body> |
| | | <nav class="navbar navbar-default"> |
| | | <div class="container-fluid"> |
| | | <div class="navbar-header"> |
| | | <a class="navbar-brand" style="display:inline-block" href="#" data-translate="page_name">TTSS Kraków</a> |
| | | </div> |
| | | <ul class="nav navbar-nav"> |
| | | <li class="navbar-header"> |
| | | <a class="navbar-brand" href="" data-translate="page_name">TTSS Kraków</a> |
| | | </li> |
| | | <li> |
| | | <form class="navbar-form navbar-left"> |
| | | <select class="form-control" id="lang-select"> |
| | | <option value="en">EN</option> |
| | | <option value="pl">PL</option> |
| | | </select> |
| | | </form> |
| | | </li> |
| | | </ul> |
| | | |
| | | <form class="navbar-form navbar-left"> |
| | | <select class="form-control" id="lang-select"> |
| | | <option value="en">EN</option> |
| | | <option value="pl">PL</option> |
| | | </select> |
| | | </form> |
| | | |
| | | <form class="navbar-form navbar-left"> |
| | | <div class="input-group"> |