added titles to the colums

This commit is contained in:
Hannes Klinckaert 2019-09-23 15:05:18 +02:00
parent 1d32b4f3f3
commit b30d160844
2 changed files with 82 additions and 48 deletions

View file

@ -1,6 +1,7 @@
body { body {
overflow: hidden; overflow: hidden;
background: #b6b6b5; background: #b6b6b5;
font-family: 'Roboto', sans-serif;
} }
h1 { h1 {
@ -26,6 +27,18 @@ h1 {
flex-direction: column; flex-direction: column;
background: #e2e1e0; background: #e2e1e0;
width: 30%; width: 30%;
position: relative;
}
.card__title {
position: absolute;
bottom: 0;
right: 0;
color: darkslategrey;
font-size: 2.5rem;
font-weight: bolder;
padding: 10px;
text-transform: uppercase;
} }
.item { .item {
@ -41,3 +54,4 @@ h1 {
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
} }

View file

@ -1,9 +1,21 @@
<html> <html>
<head> <head>
<link href="https://use.fontawesome.com/releases/v5.0.13/css/all.css" rel="stylesheet"> <link
<script data-main="{{ url_for('static', filename = 'index.js') }}" src="https://cdnjs.cloudflare.com/ajax/libs/require.js/2.3.6/require.js"></script> href="https://use.fontawesome.com/releases/v5.0.13/css/all.css"
<link rel="stylesheet" href="{{ url_for('static', filename = 'index.css') }}" /> rel="stylesheet"
/>
<script
data-main="{{ url_for('static', filename = 'index.js') }}"
src="https://cdnjs.cloudflare.com/ajax/libs/require.js/2.3.6/require.js"
></script>
<link
rel="stylesheet"
href="{{ url_for('static', filename = 'index.css') }}"
/>
<link
href="https://fonts.googleapis.com/css?family=Roboto&display=swap"
rel="stylesheet"
/>
</head> </head>
<body> <body>
@ -31,7 +43,9 @@
<i class="fas fa-check" style="color:green"></i> <i class="fas fa-check" style="color:green"></i>
</div> </div>
</div> </div>
<div class="card__title">
Links
</div>
</div> </div>
<div class="card"> <div class="card">
<div class="item"> <div class="item">
@ -45,11 +59,17 @@
max fase max fase
</div> </div>
</div> </div>
<div class="card__title">
Runs
</div> </div>
</div>
<div class="card"> <div class="card">
<div class="item">live requests</div> <div class="item">live requests</div>
<div class="card__title">
Live Requests
</div>
</div> </div>
</div> </div>
</body> </body>
</html> </html>