Modify application templates for proper bootstrap usage

refs #4550
This commit is contained in:
Jannis Moßhammer 2013-08-21 16:11:22 +02:00 committed by Marius Hein
parent 0ba27704ae
commit dc2aad75d1
6 changed files with 101 additions and 85 deletions

View File

@ -1,17 +1,19 @@
<?php echo $this->render('parts/topbar.phtml') ?> <?php echo $this->render('parts/topbar.phtml') ?>
<div class="main"> <div class="row">
<!-- Only required for left/right tabs --> <!-- Only required for left/right tabs -->
<div class="tabbable tabs-left "style="height:100%;"> <div class="col-md-2">
<?php echo $this->render('parts/navigation.phtml') ?> <?php echo $this->render('parts/navigation.phtml') ?>
</div>
<div class="layout-main-detail collapsed"> <div class="col-md-10">
<div id="icinga-main" container-id="icinga-main" class="icinga-container"> <div id="icingamain" class="col-md-8">
<?= $this->render('inline.phtml') ?> <?= $this->render('inline.phtml') ?>
</div> </div>
<div id="icinga-detail" class="icinga-container " container-id="icinga-detail">
</div>
<div id="icingadetail" class="col-md-2">
Details
</div>
</div> </div>
</div> </div>

View File

@ -13,14 +13,19 @@
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title></title> <title></title>
<meta name="description" content=""> <meta name="description" content="">
<meta name="viewport" content="width=device-width"> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<!-- Bootstrap and components -->
<link rel="stylesheet" href="<?= $this->baseUrl('css/vendor/bootstrap/bootstrap.min.css') ?>" media="screen">
<link rel="stylesheet" href="<?= $this->baseUrl('css/normalize.min.css') ?>">
<link rel="stylesheet" href="<?= $this->baseUrl('css/vendor/bootstrap.css') ?>">
<link rel="stylesheet" href="<?= $this->baseUrl('css/vendor/datetimepicker/bootstrap-datetimepicker.min.css') ?>">
<link rel="stylesheet" href="<?= $this->baseUrl('css/vendor/ui-lightness/jquery-ui-1.10.3.custom.min.css') ?>">
<link rel="stylesheet" href="<?= $this->baseUrl('css/main.css') ?>"> <link rel="stylesheet" href="<?= $this->baseUrl('css/main.css') ?>">
<link rel="stylesheet" href="<?= $this->baseUrl('css/vendor/jquery.qtip.min.css') ?>"> <link rel="stylesheet" href="<?= $this->baseUrl('css/vendor/bootstrap/datetimepicker.min.css') ?>">
<!--
Not used until styling is clear (see #4550)
<link rel="stylesheet" href="<?= $this->baseUrl('css.php') ?>">
-->
<script type="text/javascript"> <script type="text/javascript">
var base_url = '<?= $this->baseUrl() ?>'; var base_url = '<?= $this->baseUrl() ?>';
ICINGA_DEBUG = true; ICINGA_DEBUG = true;
@ -30,17 +35,18 @@
<? endif ?> <? endif ?>
<script src="<?php echo $this->baseUrl('js/vendor/modernizr-2.6.2.min.js') ?>"></script> <script src="<?php echo $this->baseUrl('js/vendor/modernizr-2.6.2.min.js') ?>"></script>
<link rel="stylesheet" href="<?php echo $this->baseUrl('css.php') ?>">
<link rel="stylesheet" href="<?php echo $this->baseUrl('css/vendor/bootstrap-responsive.min.css') ?>"> <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
<link rel="stylesheet" href="<?php echo $this->baseUrl('css/vendor/font-awesome.min.css') ?>"> <!--[if lt IE 9]>
<!--[if IE 7]> <script src="./js/vendor/html5shiv.js"></script>
<link rel="stylesheet" href="<?php echo $this->baseUrl('css/vendor/font-awesome-ie7.min.css') ?>"> <script src="./js/vendor/respond.min.js"></script>
<![endif]--> <![endif]-->
<script data-main="<?php echo $this->baseUrl('js/main.js')?>" <script data-main="<?php echo $this->baseUrl('js/main.js')?>"
src="<?php echo $this->baseUrl('js/vendor/require.js') ?>"></script> src="<?php echo $this->baseUrl('js/vendor/require.js') ?>"></script>
</head> </head>
<body class="cranberry"> <body class="cranberry">
<?= $this->render('just-the-body.phtml') ?> <?= $this->render('body.phtml') ?>
</body> </body>
</html> </html>

View File

@ -6,35 +6,37 @@ $currentKey = isset($this->navkey) ? $this->navkey : $url;
$item = $this->navigation->keys("menu"); $item = $this->navigation->keys("menu");
?> ?>
<?php if ($this->auth()->isAuthenticated()): ?> <?php if ($this->auth()->isAuthenticated()): ?>
<ul class="nav nav-tabs icinga-navigation" > <ul class="nav nav-stacked" >
<?php <?php
$activeSet = false; $activeSet = false;
foreach ($item as $itemName) { foreach ($item as $itemName) {
if($itemName[0] == "_") { if($itemName[0] == "_") {
?> ?>
<li class="section-end"></li> <li class="section-end"></li>
<?php <?php
continue; continue;
} }
$item = $this->navigation->menu->$itemName; $item = $this->navigation->menu->$itemName;
$active = false; $active = false;
$url = ""; $url = "";
if (is_string($item)) { if (is_string($item)) {
$active = !$activeSet && $this->baseUrl($item) == $currentKey; $active = !$activeSet && $this->baseUrl($item) == $currentKey;
$url = $this->baseUrl($item); $url = $this->baseUrl($item);
} else { } else {
$url = $this->baseUrl(isset($item->route) ? $item->route : ""); $url = $this->baseUrl(isset($item->route) ? $item->route : "");
$itemName = isset($item->title) ? $item->title : $itemName; $itemName = isset($item->title) ? $item->title : $itemName;
$active = !$activeSet && (isset($item->key) ? $item->key : $url) === $currentKey; $active = !$activeSet && (isset($item->key) ? $item->key : $url) === $currentKey;
} }
$activeSet = $activeSet || $active; $activeSet = $activeSet || $active;
?> ?>
<li class="<?= $active ? "active" : "" ?>"><a href="<?= $url ?>"><?= $itemName ?></a></li> <li class="<?= $active ? "active" : "" ?>">
<?php <a href="<?= $url ?>"><?= $itemName ?></a>
$class = ""; </li>
} <?php
?> $class = "";
</ul> }
?>
</ul>
<? endif ?> <? endif ?>

View File

@ -1,31 +1,33 @@
<div class="navbar navbar-inverse navbar-fixed-top"> <nav class="navbar navbar-default navbar-fixed-top" role="navigation">
<div class="navbar-inner "> <ul class="nav navbar-nav pull-left">
<ul class="nav pull-left"> <li>
<li style="float:left"><a href="<?= $this->baseUrl('/') ?>" class="brand" style="margin-left:0px;">Icinga</a></li> <a href="<?= $this->baseUrl('/') ?>" class="brand" style="margin-left:0px;">Icinga</a>
</ul> </li>
<?php if ($this->auth()->isAuthenticated()): ?> </ul>
<ul class="nav pull-right" > <?php if ($this->auth()->isAuthenticated()): ?>
<ul class="nav navbar-nav pull-right" >
<!-- Remove component as of #4583 since it's not working--> <!-- Remove component as of #4583 since it's not working-->
<!-- <li>--> <!-- <li>-->
<!-- <form class="navbar-search" style="padding-top:0.2em">--> <!-- <form class="navbar-search" style="padding-top:0.2em">-->
<!-- <input type="text" class="search-query" placeholder="Search" style="padding-top:0.3em">--> <!-- <input type="text" class="search-query" placeholder="Search" style="padding-top:0.3em">-->
<!-- </form>--> <!-- </form>-->
<!-- </li>--> <!-- </li>-->
<li class="dropdown"> <li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown">
<?= $this->escape($this->auth()->getUser()->getUsername()); ?> <?= $this->escape($this->auth()->getUser()->getUsername()); ?>
<i class="icon-user icon-white" style="margin-top:0.2em"></i> <i class="icon-user icon-white" style="margin-top:0.2em"></i>
<b class="caret"></b> <b class="caret"></b>
</a> </a>
<ul class="dropdown-menu"> <ul class="dropdown-menu">
<li> <li>
<a href="<?= $this->href('/preference'); ?>"><?= $this->translate('Preferences'); ?> </a> <a href="<?= $this->href('/preference'); ?>"><?= $this->translate('Preferences'); ?> </a>
</li> </li>
<li> <li>
<a href="<?= $this->href('/authentication/logout'); ?>"><?= $this->translate('Logout'); ?></a> <a href="<?= $this->href('/authentication/logout'); ?>"><?= $this->translate('Logout'); ?></a>
</ul>
</li> </li>
</ul> </ul>
<?php endif ?> </li>
</div> </ul>
</div> <?php endif ?>
</nav>

View File

@ -19,17 +19,18 @@ $title_next = sprintf(
$total $total
); );
?><div class="pagination pagination-mini" style="margin:0px"> ?>
<ul> <ul class="pagination pagination-sm">
<!-- Previous page link --> <!-- Previous page link -->
<?php if (isset($this->previous)): ?> <?php if (isset($this->previous)): ?>
<li><a href="<?= $this->url()->setParam('page', $this->previous) ?>" title="<?= $title_prev ?>">« <?= $this->translate('Back') ?></a></li> <li><a href="<?= $this->url()->setParam('page', $this->previous) ?>" title="<?= $title_prev ?>">« <?= $this->translate('Back') ?></a></li>
<?php else: ?> <?php else: ?>
<li class="disabled"><span>« <?= $this->translate('Back') ?></span></li> <li class="disabled"><span>« <?= $this->translate('Back') ?></span></li>
<?php endif ?> <?php endif ?>
<!-- Numbered page links --> <!-- Numbered page links -->
<?php <?php
foreach ($this->pagesInRange as $page): foreach ($this->pagesInRange as $page):
$start = ($page - 1) * $limit + 1; $start = ($page - 1) * $limit + 1;
@ -43,16 +44,19 @@ foreach ($this->pagesInRange as $page):
if ($page === '...'): ?> if ($page === '...'): ?>
<li class="disabled"><span>...</span></li> <li class="disabled"><span>...</span></li>
<?php else: ?> <?php else: ?>
<li<?= $class ?>><a href="<?= $this->url()->setParam('page', $page) ?>" title="<?= $title ?>"><?= $page ?></a></li> <li <?= $class ?>>
<a href="<?= $this->url()->setParam('page', $page) ?>" title="<?= $title ?>">
<?= $page ?>
</a>
</li>
<?php <?php
endif; endif;
endforeach; endforeach;
?> ?>
<!-- Next page link --> <!-- Next page link -->
<? if (isset($this->next)): ?> <? if (isset($this->next)): ?>
<li><a href="<?= $this->url()->setParam('page', $this->next) ?>" title="<?= $title_next ?>"><?= t('Next') ?> »</a></li> <li><a href="<?= $this->url()->setParam('page', $this->next) ?>" title="<?= $title_next ?>"><?= t('Next') ?> »</a></li>
<? else: ?> <? else: ?>
<li class="disabled"><span><?= t('Next') ?> »</span></li> <li class="disabled"><span><?= t('Next') ?> »</span></li>
<? endif ?> <? endif ?>
</ul> </ul>
</div>

View File

@ -223,7 +223,7 @@ class ActionController extends ZfController
if ($this->_request->isXmlHttpRequest()) { if ($this->_request->isXmlHttpRequest()) {
if ($this->replaceLayout || $this->_getParam('_render') === 'body') { if ($this->replaceLayout || $this->_getParam('_render') === 'body') {
$this->_helper->layout()->setLayout('just-the-body'); $this->_helper->layout()->setLayout('body');
header('X-Icinga-Target: body'); header('X-Icinga-Target: body');
} else { } else {
$this->_helper->layout()->setLayout('inline'); $this->_helper->layout()->setLayout('inline');