Add header and navigation on all pages
This commit is contained in:
Hannes Verschore
Родитель
eeeb9fce5e
Коммит
787677fd13
|
|
@ -6,6 +6,7 @@
|
|||
<title>ARE WE FAST YET?</title>
|
||||
<link rel="stylesheet" title="Default Stylesheet" type="text/css" href="style.css">
|
||||
<link rel="shortcut icon" href="http://www.arewefastyet.com/awfy_favicon.png">
|
||||
<link href='http://fonts.googleapis.com/css?family=Lato' rel='stylesheet' type='text/css'>
|
||||
<script type="text/javascript" src="jquery/jquery-1.8.3.min.js"></script>
|
||||
<script type="text/javascript" src="jquery/jquery.ba-hashchange.min.js"></script>
|
||||
<script type="text/javascript" src="flot/jquery.flot.js"></script>
|
||||
|
|
@ -29,6 +30,24 @@
|
|||
AWFY.startup();
|
||||
});
|
||||
</script>
|
||||
<header>
|
||||
<div class='container'>
|
||||
<h1><a href='#'>AreWeFastYet</a></h1>
|
||||
<div class='rightSide'>
|
||||
<div><a href="http://h4writer.com"><span>Blog</span></a></div>
|
||||
<div><a href="/overview"><span>Overview</span></a></div>
|
||||
<div><a href="/regressions"><span>Regressions</span></a></div>
|
||||
<!--
|
||||
<div class='userMenu'>
|
||||
<a href="javascript:doPersonaLogin()" ng-if="!currentUser"><span>Login</span></a>
|
||||
<a href="javascript:doPersonaLogout()" ng-if='currentUser'><span>Logout</span></a>
|
||||
</div>
|
||||
-->
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<div class='content'>
|
||||
<div class="graph-row">
|
||||
<div id="message"></div>
|
||||
<div id="navcontainer">
|
||||
|
|
@ -133,6 +152,7 @@
|
|||
</ul>
|
||||
</div>
|
||||
<br>
|
||||
</div>
|
||||
<script>
|
||||
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
|
||||
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
|
||||
|
|
|
|||
|
|
@ -7,7 +7,7 @@ session_start();
|
|||
|
||||
function init_database()
|
||||
{
|
||||
mysql_connect("localhost", "awfy", "LFQZdX6Ca57QcwhE") or die("ERROR: " . mysql_error());
|
||||
mysql_connect("localhost", "awfy", "8xM7iTjepje4omA") or die("ERROR: " . mysql_error());
|
||||
mysql_select_db("awfy") or die("ERROR: " . mysql_error());
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -249,8 +249,8 @@ header {
|
|||
vertical-align: middle; }
|
||||
header .rightSide {
|
||||
text-align: right; }
|
||||
header .query {
|
||||
margin-right: 24px; }
|
||||
header .rightSide div {
|
||||
margin-left: 24px; }
|
||||
header a {
|
||||
text-decoration: none;
|
||||
color: white; }
|
||||
|
|
|
|||
|
|
@ -26,8 +26,9 @@
|
|||
<div class='container'>
|
||||
<h1><a href='#'>AreWeFastYet</a></h1>
|
||||
<div class='rightSide'>
|
||||
<div class='query'>
|
||||
</div>
|
||||
<div><a href="http://h4writer.com"><span>Blog</span></a></div>
|
||||
<div><a href="/"><span>Graphs</span></a></div>
|
||||
<div><a href="/regressions"><span>Regressions</span></a></div>
|
||||
<div class='userMenu'>
|
||||
<a href="javascript:doPersonaLogin()" ng-if="!currentUser"><span>Login</span></a>
|
||||
<a href="javascript:doPersonaLogout()" ng-if='currentUser'><span>Logout</span></a>
|
||||
|
|
|
|||
|
|
@ -56,10 +56,9 @@ header {
|
|||
|
||||
.rightSide {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.query {
|
||||
margin-right: $unit*4;
|
||||
div {
|
||||
margin-left: $unit*4;
|
||||
}
|
||||
}
|
||||
|
||||
a {
|
||||
|
|
@ -159,4 +158,4 @@ header {
|
|||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -157,8 +157,8 @@ header {
|
|||
vertical-align: middle; }
|
||||
header .rightSide {
|
||||
text-align: right; }
|
||||
header .query {
|
||||
margin-right: 24px; }
|
||||
header .rightSide div {
|
||||
margin-left: 24px; }
|
||||
header a {
|
||||
text-decoration: none;
|
||||
color: #f0f0f0; }
|
||||
|
|
|
|||
|
|
@ -30,6 +30,9 @@
|
|||
<div class='container'>
|
||||
<h1><a href='#'>AreWeFastYet</a></h1>
|
||||
<div class='rightSide'>
|
||||
<div><a href="http://h4writer.com"><span>Blog</span></a></div>
|
||||
<div><a href="/"><span>Graphs</span></a></div>
|
||||
<div><a href="/overview"><span>Overview</span></a></div>
|
||||
<div class='userMenu'>
|
||||
<a href="javascript:doPersonaLogin()" ng-if='!currentUser'><span>Login</span></a>
|
||||
<a href="javascript:doPersonaLogout()" ng-if='currentUser'><span>Logout</span></a>
|
||||
|
|
|
|||
|
|
@ -56,10 +56,9 @@ header {
|
|||
|
||||
.rightSide {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.query {
|
||||
margin-right: $unit*4;
|
||||
div {
|
||||
margin-left: $unit*4;
|
||||
}
|
||||
}
|
||||
|
||||
a {
|
||||
|
|
|
|||
|
|
@ -1,8 +1,10 @@
|
|||
body {
|
||||
background-color:#FFF;
|
||||
font:.6875em Verdana, sans-serif;
|
||||
color:#000;
|
||||
}
|
||||
.content {
|
||||
font:.6875em Verdana, sans-serif;
|
||||
}
|
||||
a {
|
||||
color:#000;
|
||||
text-decoration:underline;
|
||||
|
|
@ -158,3 +160,164 @@ h1 {
|
|||
filter: progid:DXImageTransform.Microsoft.Matrix(M11=0.0, M12=0.33, M21=-0.33, M22=0.0,sizingMethod='auto expand');
|
||||
}
|
||||
|
||||
|
||||
header * {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
header {
|
||||
background-color: #42637b;
|
||||
color: white;
|
||||
-webkit-box-shadow: 0px 0px 15px 0px black;
|
||||
-moz-box-shadow: 0px 0px 15px 0px black;
|
||||
box-shadow: 0px 0px 15px 0px black; }
|
||||
header .container {
|
||||
display: table; }
|
||||
header select {
|
||||
color: white;
|
||||
background-color: #42637b; }
|
||||
header #machines, header #types, header #dates {
|
||||
margin-left: 6px;
|
||||
margin-right: 6px; }
|
||||
header #machines select, header #machines input, header #machines div, header #types select, header #types input, header #types div, header #dates select, header #dates input, header #dates div {
|
||||
-moz-appearance: toolbox;
|
||||
-webkit-appearance: none;
|
||||
text-indent: 0.01px;
|
||||
text-overflow: '';
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
padding-right: 18px; }
|
||||
header #machines select::-ms-expand, header #machines input::-ms-expand, header #machines div::-ms-expand, header #types select::-ms-expand, header #types input::-ms-expand, header #types div::-ms-expand, header #dates select::-ms-expand, header #dates input::-ms-expand, header #dates div::-ms-expand {
|
||||
display: none; }
|
||||
header #machines:after, header #types:after, header #dates:after {
|
||||
position: absolute;
|
||||
content: "\e114";
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
font-family: 'Glyphicons Halflings';
|
||||
font-style: normal;
|
||||
font-weight: normal;
|
||||
font-size: 0.5em;
|
||||
height: 2.0em;
|
||||
margin-left: -12px;
|
||||
line-height: 2.0em;
|
||||
pointer-events: none; }
|
||||
header #dates:after {
|
||||
display: none; }
|
||||
header div {
|
||||
display: inline-block; }
|
||||
header h1 {
|
||||
position: relative;
|
||||
text-transform: uppercase;
|
||||
font-size: 18px; }
|
||||
body.ff header h1:after {
|
||||
background-image: url("../img/firefox.png");
|
||||
background-size: 75%;
|
||||
background-repeat: no-repeat;
|
||||
background-position: 0px -35px;
|
||||
width: 250px;
|
||||
top: -15px;
|
||||
bottom: -15px;
|
||||
content: "";
|
||||
display: block;
|
||||
left: -180px;
|
||||
position: absolute; }
|
||||
header h1, header .rightSide {
|
||||
display: table-cell;
|
||||
vertical-align: middle; }
|
||||
header .rightSide {
|
||||
text-align: right; }
|
||||
header .rightSide div {
|
||||
margin-left: 24px; }
|
||||
header a {
|
||||
text-decoration: none;
|
||||
color: white; }
|
||||
|
||||
.subheader {
|
||||
float: right;
|
||||
vertical-align: bottom;
|
||||
text-align: right; }
|
||||
.subheader .container {
|
||||
padding-top: 0px;
|
||||
padding-bottom: 0px; }
|
||||
.subheader .history {
|
||||
color: #222222;
|
||||
text-decoration: none; }
|
||||
.subheader .history:before {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
font-family: 'Glyphicons Halflings';
|
||||
font-style: normal;
|
||||
font-weight: normal;
|
||||
margin-left: 6px;
|
||||
margin-right: 6px;
|
||||
content: "\e023"; }
|
||||
.subheader .up {
|
||||
color: #222222;
|
||||
text-decoration: none; }
|
||||
.subheader .up:before {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
font-family: 'Glyphicons Halflings';
|
||||
font-style: normal;
|
||||
font-weight: normal;
|
||||
margin-left: 6px;
|
||||
margin-right: 6px;
|
||||
content: "\e113"; }
|
||||
.subheader .button {
|
||||
background-color: #f2f2f2;
|
||||
border: 1px SOLID #dddddd;
|
||||
padding: 12px 18px;
|
||||
display: inline-block;
|
||||
color: #222222;
|
||||
margin-left: 12px;
|
||||
margin-right: 12px; }
|
||||
.subheader .button:last-child {
|
||||
margin-right: 0px; }
|
||||
.subheader .button .title, .subheader .button .result {
|
||||
display: inline-block; }
|
||||
.subheader .button .title {
|
||||
text-transform: uppercase;
|
||||
font-size: 15px; }
|
||||
.subheader .button .result {
|
||||
color: #222222;
|
||||
font-weight: bold; }
|
||||
.subheader .button .result:before {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
font-family: 'Glyphicons Halflings';
|
||||
font-style: normal;
|
||||
font-weight: normal;
|
||||
margin-left: 6px;
|
||||
margin-right: 6px;
|
||||
content: "\2212";
|
||||
color: #b67525; }
|
||||
.subheader .button .result.bad:before {
|
||||
content: "\e114";
|
||||
color: #d12600; }
|
||||
.subheader .button .result.good:before {
|
||||
content: "\e113";
|
||||
color: #2f7836; }
|
||||
|
||||
@font-face {
|
||||
font-family: 'Glyphicons Halflings';
|
||||
src: url("http://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/fonts/glyphicons-halflings-regular.eot");
|
||||
src: url("http://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/fonts/glyphicons-halflings-regular.eot?#iefix") format("embedded-opentype"), url("http://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/fonts/glyphicons-halflings-regular.woff") format("woff"), url("http://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/fonts/glyphicons-halflings-regular.ttf") format("truetype"), url("http://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/fonts/glyphicons-halflings-regular.svg") format("svg"); }
|
||||
|
||||
body {
|
||||
font-family: lato;
|
||||
}
|
||||
|
||||
html, body {
|
||||
margin: 0px;
|
||||
padding: 0px; }
|
||||
|
||||
.container {
|
||||
padding: 15px;
|
||||
width: 1200px;
|
||||
margin-left: auto;
|
||||
margin-right: auto; }
|
||||
|
||||
header {
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
|
|
|
|||
Загрузка…
Ссылка в новой задаче