Add standard status header
One of the requests we got during Summit was to make OpenStack Health look more like other status pages. This commit includes the status header. Change-Id: Id96ee1688e66445c3b42222bad088211f4e19437
This commit is contained in:
parent
d8220ad139
commit
64fac72af3
Binary file not shown.
After Width: | Height: | Size: 47 B |
Binary file not shown.
After Width: | Height: | Size: 2.8 KiB |
Binary file not shown.
After Width: | Height: | Size: 3.6 KiB |
|
@ -11,15 +11,55 @@
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body class="ng-cloak" ng-controller="MainController">
|
<body class="ng-cloak" ng-controller="MainController">
|
||||||
<header class="navbar navbar-default navbar-fixed-top navbar-inner">
|
<div id="header" class="container">
|
||||||
<div class="container">
|
<div class="row">
|
||||||
<div class="navbar-header">
|
<div class="col-lg-2">
|
||||||
<a class="navbar-brand" ui-sref="home">OpenStack Health</a>
|
<h1 id="logo"><a href="http://status.openstack.org/">OpenStack</a></h1>
|
||||||
|
</div>
|
||||||
|
<div class="col-lg-10">
|
||||||
|
<div id="navigation">
|
||||||
|
<ul id="Menu1">
|
||||||
|
<li>
|
||||||
|
<a id="menu-Status" href="http://status.openstack.org/">
|
||||||
|
Status
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a id="menu-Zuul" href="http://status.openstack.org/zuul/">
|
||||||
|
Zuul
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a id="menu-Rechecks" href="http://status.openstack.org/elastic-recheck/">
|
||||||
|
Rechecks
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a id="menu-Release" href="http://status.openstack.org/release/">
|
||||||
|
Release
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a id="menu-Reviews" href="http://status.openstack.org/reviews/">
|
||||||
|
Reviews
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a id="menu-Bugday" href="http://status.openstack.org/bugday/">
|
||||||
|
Bugday
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a id="menu-Bugday" href="http://status.openstack.org/openstack-health/"
|
||||||
|
class="current">
|
||||||
|
OpenStack Health
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<nav ng-include="'menu.html'"></nav>
|
|
||||||
</div>
|
</div>
|
||||||
</header>
|
</div>
|
||||||
|
|
||||||
<div role="main" ui-view></div>
|
<div role="main" ui-view></div>
|
||||||
|
|
||||||
|
|
|
@ -0,0 +1,94 @@
|
||||||
|
/* @group Navigation */
|
||||||
|
|
||||||
|
#navigation {
|
||||||
|
display: block;
|
||||||
|
background: url(../images/header-line.gif) repeat-x 0 bottom;
|
||||||
|
padding-top: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#navigation * {
|
||||||
|
padding: 0;
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
#navigation ul {
|
||||||
|
display: block;
|
||||||
|
margin: 0 auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
#navigation li {
|
||||||
|
display: block;
|
||||||
|
float: left;
|
||||||
|
margin-right: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#navigation li a {
|
||||||
|
display: block;
|
||||||
|
font-weight: normal;
|
||||||
|
text-decoration: none;
|
||||||
|
background-position: 50% 0;
|
||||||
|
padding: 20px 0 5px;
|
||||||
|
color: #353535;
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#navigation li a.current, #navigation li a.section {
|
||||||
|
border-bottom: 3px solid #cf2f19;
|
||||||
|
color: #cf2f19;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
/* @group Auto-clearing */
|
||||||
|
|
||||||
|
#navigation:after, #navigation ul:after, #header:after {
|
||||||
|
content: ".";
|
||||||
|
display: block;
|
||||||
|
height: 0;
|
||||||
|
clear: both;
|
||||||
|
visibility: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
#navigation, #navigation ul, #header:after {
|
||||||
|
display: inline-block
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Hides from IE-mac \*/
|
||||||
|
* html #navigation, * html #navigation ul {
|
||||||
|
height: 1%
|
||||||
|
}
|
||||||
|
#navigation, #navigation ul, #header:after {
|
||||||
|
display: block
|
||||||
|
}
|
||||||
|
/* End hide from IE-mac */
|
||||||
|
|
||||||
|
/* @end */
|
||||||
|
|
||||||
|
/* @group Logo */
|
||||||
|
|
||||||
|
#logo a {
|
||||||
|
display: block;
|
||||||
|
margin-top: 8px;
|
||||||
|
text-indent: -1000em;
|
||||||
|
background: url(../images/open-stack-cloud-computing-logo-2.png) no-repeat left center;
|
||||||
|
height: 54px;
|
||||||
|
width: 177px;
|
||||||
|
margin-left: -10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* @end */
|
||||||
|
|
||||||
|
/* @group Header */
|
||||||
|
|
||||||
|
body.ng-scope {
|
||||||
|
background: white url(../images/openstack-page-bkg.jpg) no-repeat scroll 0px 0px;
|
||||||
|
border-top: 3px solid #255e6e;
|
||||||
|
color: #535353;
|
||||||
|
padding-top: 0px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#header {
|
||||||
|
margin-bottom: 0px;
|
||||||
|
margin-top: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* @end */
|
|
@ -4,3 +4,4 @@
|
||||||
@import 'font-awesome/font-awesome';
|
@import 'font-awesome/font-awesome';
|
||||||
@import 'sb-admin-2';
|
@import 'sb-admin-2';
|
||||||
@import 'nv.d3';
|
@import 'nv.d3';
|
||||||
|
@import 'header';
|
||||||
|
|
|
@ -21,6 +21,11 @@ module.exports = {
|
||||||
'dest': 'build/fonts'
|
'dest': 'build/fonts'
|
||||||
},
|
},
|
||||||
|
|
||||||
|
'images': {
|
||||||
|
'src': 'app/images/**/*.{gif,jpg,png}',
|
||||||
|
'dest': 'build/images'
|
||||||
|
},
|
||||||
|
|
||||||
'views': {
|
'views': {
|
||||||
'watch': [
|
'watch': [
|
||||||
'app/index.html',
|
'app/index.html',
|
||||||
|
|
|
@ -10,7 +10,7 @@ gulp.task('dev', ['clean'], function(cb) {
|
||||||
global.isProd = false;
|
global.isProd = false;
|
||||||
|
|
||||||
runSequence(
|
runSequence(
|
||||||
['styles', 'fonts', 'data', 'vendor-js', 'views', 'browserify', 'dev-resources'],
|
['styles', 'fonts', 'images', 'data', 'vendor-js', 'views', 'browserify', 'dev-resources'],
|
||||||
'watch', cb);
|
'watch', cb);
|
||||||
|
|
||||||
});
|
});
|
||||||
|
|
|
@ -0,0 +1,15 @@
|
||||||
|
'use strict';
|
||||||
|
|
||||||
|
var config = require('../config');
|
||||||
|
var changed = require('gulp-changed');
|
||||||
|
var gulp = require('gulp');
|
||||||
|
var browserSync = require('browser-sync');
|
||||||
|
|
||||||
|
gulp.task('images', function() {
|
||||||
|
|
||||||
|
return gulp.src(config.images.src)
|
||||||
|
.pipe(changed(config.images.dest)) // Ignore unchanged files
|
||||||
|
.pipe(gulp.dest(config.images.dest))
|
||||||
|
.pipe(browserSync.reload({ stream: true, once: true }));
|
||||||
|
|
||||||
|
});
|
|
@ -8,6 +8,7 @@ gulp.task('watch', ['browserSync', 'server'], function() {
|
||||||
// Scripts are automatically watched and rebundled by Watchify inside Browserify task
|
// Scripts are automatically watched and rebundled by Watchify inside Browserify task
|
||||||
gulp.watch(config.styles.src, ['styles']);
|
gulp.watch(config.styles.src, ['styles']);
|
||||||
gulp.watch(config.fonts.src, ['fonts']);
|
gulp.watch(config.fonts.src, ['fonts']);
|
||||||
|
gulp.watch(config.images.src, ['images']);
|
||||||
gulp.watch(config.data.src, ['data']);
|
gulp.watch(config.data.src, ['data']);
|
||||||
gulp.watch(config.devResources.src, ['dev-resources']);
|
gulp.watch(config.devResources.src, ['dev-resources']);
|
||||||
gulp.watch(config.vendorJs.src, ['vendor-js']);
|
gulp.watch(config.vendorJs.src, ['vendor-js']);
|
||||||
|
|
Loading…
Reference in New Issue