Upgrading to bootstrap

This commit is contained in:
Denis-Cosmin Nutiu 2017-04-13 22:38:22 +03:00
parent c47ba2a2fa
commit 8312d92a63
3 changed files with 90 additions and 50 deletions

View file

@ -16,27 +16,39 @@
along with scoreboard-benchmark . If not, see <http://www.gnu.org/licenses/>.
*/
header {
text-align: center;
/* Sticky footer styles
-------------------------------------------------- */
html {
position: relative;
min-height: 100%;
}
footer {
text-align: center;
body {
/* Margin bottom by footer height */
margin-bottom: 60px;
}
main table {
font-family: arial, sans-serif;
border-collapse: collapse;
.footer {
position: absolute;
bottom: 0;
width: 100%;
/* Set the fixed height of the footer here */
height: 60px;
line-height: 60px; /* Vertically center the text there */
background-color: #f5f5f5;
}
main td, main th {
border: 1px solid #dddddd;
text-align: left;
padding: 8px;
/* Custom page CSS
-------------------------------------------------- */
body > .container {
padding: 60px 15px 0;
}
main tr:nth-child(even) {
background-color: #dddddd;
.footer > .container {
padding-right: 15px;
padding-left: 15px;
}
code {
font-size: 80%;
}

View file

@ -1,35 +1,34 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="author" content="Metonymy">
<meta name="description" content="The scoreboard for the benchmarks!">
<meta name="keywords" content="flask python metonymyqt benchmark scoreboard">
<link rel="stylesheet" href="{{ url_for('static', filename='style.css')}}">
<title>Scoreboard!</title>
</head>
<body>
<header>
<h1>The Scoreboard!</h1>
</header>
<main>
<table>
{% extends "mybase.html" %}
{% block main %}
{{ super() }}
<div class="panel panel-default">
<!-- Default panel contents -->
<div class="panel-heading">Scoreboard</div>
<div class="panel-body">
<p>The results are send here via JSON from the java app.</p>
</div>
<!-- Table -->
<table class="table">
<thead>
<tr>
<th>Text</th>
<th>GPU</th>
<th>CPU</th>
<th>Score</th>
<th>Information</th>
<th>Details</th>
</tr>
</thead>
<tbody>
{% for item in results %}
<tr>
<td>{{ item.text }}</td>
<td>{{ item.gpu }}</td>
<td>{{ item.cpu }}</td>
<td>{{ item.score }}</td>
<td><a href="{{ url_for('scoreboard.entry', id=item.id) }}">See more</a></td>
</tr>
{% endfor %}
</tbody>
</table>
</main>
<footer>
Copyright 2017 Fellowship of the Bits
</footer>
</body>
</html>
</div>
{% endblock %}

View file

@ -7,16 +7,45 @@
<meta name="keywords" content="flask python metonymyqt benchmark scoreboard">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
{% endblock %}
{% block styles %}
{{super()}}
<link rel="stylesheet"
href="{{url_for('static', filename='style.css')}}">
{% endblock %}
{% block content %}
<div class="navbar navbar-default" role="navigation">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle"
data-toggle="collapse" data-target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="/">FOTB</a> </div>
<div class="navbar-collapse collapse"> <ul class="nav navbar-nav">
<li><a href="/">Home</a></li> </ul>
</div>
</div>
</div>
<header>
{% block header %}
{% endblock %}
<div class="alert alert-info" role="alert">
<strong>Heads up!</strong> This application is not complete! If you find any bugs please report them to:
<a href="mailto:metonymy@fedoraproject.com">Metonymy</a>
</div>
</header>
<main>
<div class="container" role="main">
{% block main %}
{% endblock %}
</main>
<footer>
Copyright 2017 Fellowship of the Bits
</div>
<footer class="footer">
<div class="container">
<span class="text-muted">Copyright © 2017 Fellowship of the Bits</span>
</div>
</footer>
{% endblock %}