Show the logo in the header on smaller screens

This commit is contained in:
hyddeos 2022-11-19 20:01:46 +01:00
parent 0bdd4b0763
commit 2e40bace47
2 changed files with 13 additions and 1 deletions

View file

@ -63,6 +63,12 @@
/* Small devices (landscape phones, less than 48em) */
@media (max-width: 768px) {
.navbar-brand-block{
position: absolute;
margin-top: -40px;
right: 10px;
}
.beeware-logo {
display: block;
margin: 15px 0 35px;
@ -88,6 +94,12 @@
/* Extra small devices (portrait phones, less than 34em) */
@media (max-width: 544px) {
.navbar-brand-block{
position: absolute;
margin-top: -40px;
right: 10px;
}
.beeware-logo {
display: block;
margin: 15px auto 35px;

View file

@ -76,9 +76,9 @@
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarsDefault" aria-controls="navbarsDefault" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="navbar-brand-block"><a class="navbar-brand" href="{{ '/'|url(alt=this.alt) }}">BeeWare</a></div>
</div>
<div class="collapse navbar-collapse" id="navbarsDefault">
<div class="navbar-brand-block"><a class="navbar-brand" href="{{ '/'|url(alt=this.alt) }}">BeeWare</a></div>
<ul class="navbar-nav mr-auto">
{{ menu_item('project') }}
{{ menu_item('news') }}