Move header logo to sidebar and increase its height

This commit is contained in:
Eric Lippmann 2017-11-17 23:42:04 +01:00 committed by Florian Strohmaier
parent a9a4eb4eee
commit 375e62272c
4 changed files with 35 additions and 31 deletions

View File

@ -23,21 +23,21 @@ $inlineLayoutScript = $this->layout()->inlineLayout . '.phtml';
<div id="announcements" class="container"> <div id="announcements" class="container">
<?= $this->widget('announcements') ?> <?= $this->widget('announcements') ?>
</div> </div>
<div id="header-logo-container">
<?= $this->qlink(
'',
Auth::getInstance()->isAuthenticated() ? 'dashboard' : '',
null,
array(
'aria-hidden' => 'true',
'data-base-target' => '_main',
'id' => 'header-logo'
)
); ?>
</div>
</div> </div>
<?php if (! $this->layout()->isIframe): ?> <?php if (! $this->layout()->isIframe): ?>
<div id="sidebar"> <div id="sidebar">
<div id="header-logo-container">
<?= $this->qlink(
'',
Auth::getInstance()->isAuthenticated() ? 'dashboard' : '',
null,
array(
'aria-hidden' => 'true',
'data-base-target' => '_main',
'id' => 'header-logo'
)
) ?>
</div>
<?= $this->render('parts/navigation.phtml'); ?> <?= $this->render('parts/navigation.phtml'); ?>
</div> </div>
<?php endif ?> <?php endif ?>

View File

@ -6,34 +6,33 @@ html {
#layout { #layout {
height: 100%; height: 100%;
left: 0;
position: fixed;
top: 0;
width: 100%; width: 100%;
position: fixed;
left: 0;
top: 0;
} }
#header { #header {
height: 3em;
left: 0;
position: fixed;
top: 0;
width: 100%; width: 100%;
position: fixed;
left: 0;
top: 0;
} }
#sidebar { #sidebar {
width: 12em;
position: fixed;
bottom: 0; bottom: 0;
left: 0; left: 0;
position: fixed; top: 0;
top: 2.25em;
width: 12em;
} }
#main { #main {
bottom: 0;
left: 12em; left: 12em;
position: fixed; position: fixed;
bottom: 0;
right: 0; right: 0;
top: 2.25em; top: 0;
} }
.iframe { .iframe {

View File

@ -37,18 +37,19 @@
} }
#header-logo-container { #header-logo-container {
height: 2.667em; background-color: @icinga-blue;
margin: .1667em 0 .1667em .7em; height: 3em;
width: 100px; padding: 0.5em 0.125em;
} }
#header-logo { #header-logo {
background-image: url('../img/icinga-logo.svg'); background-image: url('../img/icinga-logo.svg');
background-position: left center; background-position: center center;
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: contain; background-size: contain;
display: block; display: block;
height: 100%; height: 100%;
width: 100%;
} }
#icinga-logo { #icinga-logo {
@ -149,9 +150,13 @@
background-color: @body-bg-color; background-color: @body-bg-color;
> .tabs { > .tabs {
height: 2.6em; background-color: @icinga-blue;
margin-top: -2.6em; height: 3em;
overflow: hidden; overflow: hidden;
> li {
margin-top: 0.4em;
}
} }
> .tabs-spacer { > .tabs-spacer {

View File

@ -576,7 +576,7 @@
if (typeof $container === 'undefined') { if (typeof $container === 'undefined') {
var $header = $('#header'); var $header = $('#header');
var $headerLogo = $('#header-logo'); var $headerLogo = $('#header-logo-container');
var $main = $('#main'); var $main = $('#main');
var $search = $('#search'); var $search = $('#search');
var $sidebar = $('#sidebar'); var $sidebar = $('#sidebar');