Add dark theme.

This commit is contained in:
2019-02-15 23:32:21 +01:00
parent 97fd6fcde0
commit 6a6b4015c8
12 changed files with 99 additions and 24 deletions

View File

@@ -1,3 +1,41 @@
/* Some Colors */
a {
color: #b52828
}
a:visited {
text-decoration: none;
}
a:hover {
color: #fd5454;
text-decoration: none;
}
.btn-primary {
background-color: #b52828;
border-color: #b52828;
}
.btn-primary:hover {
background-color: #fd5454;
border-color: #fd5454;
}
.btn-default {
background-color: #3b3b3b;
border-color: #3b3b3b;
}
.btn-default:hover {
background-color: #3b3b3b;
border-color: #fd5454;
}
.icon-primary{
color: #b52828
}
.brand-icon{
height: 40px;
}
.vertical-center {
min-height: 100%; /* Fallback for browsers do NOT support vh unit */
min-height: 100vh; /* These two lines are counted as one :-) */

14
static/dark_theme.css Normal file

File diff suppressed because one or more lines are too long

BIN
static/img/brand.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 258 KiB

BIN
static/img/elite.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 133 KiB

BIN
static/img/solaire.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 251 KiB

View File

@@ -5,6 +5,8 @@
{% block styles %}
{{ super() }}
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.1/css/all.css" integrity="sha384-fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr" crossorigin="anonymous">
<link rel="stylesheet" href="/static/dark_theme.css">
<link rel="stylesheet" href="/static/custom.css">
{% endblock %}
{% block navbar %}
@@ -15,21 +17,32 @@
('/drinks', 'drinks', 'Drinks', 'fas fa-beer')
]-%}
<div class="container">
<nav class="navbar navbar-expand-sm bg-dark navbar-dark">
<ul class="nav navbar-nav mr-auto">
{% for href, id, caption, icon in nav_bar %}
<li class="nav-item{% if id == active_page %} active{% endif %}">
<a class="nav-link" href="{{ href|e }}">
<i class="{{ icon|e }}"></i> {{ caption|e }}
</a>
</li>
{% endfor %}
</ul>
<ul class="nav navbar-nav ml-auto">
<li class="nav-item">
<a class="nav-link" href="/logout">Logout</a>
</li>
</ul>
<nav class="navbar navbar-expand-lg bg-dark navbar-dark">
<a class="navbar-brand">
<img class="brand-icon" alt="" src="/static/img/brand.png">
Estus Shots
</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav mr-auto">
{% for href, id, caption, icon in nav_bar %}
<li class="nav-item{% if id == active_page %} active{% endif %}">
<a class="nav-link" href="{{ href|e }}">
<i class="{{ icon|e }} icon-primary"></i> {{ caption|e }}
</a>
</li>
{% endfor %}
</ul>
<ul class="nav navbar-nav ml-auto">
<li class="nav-item">
<a class="nav-link" href="/logout">Logout</a>
</li>
</ul>
</div>
</nav>
</div>
{% endblock %}

View File

@@ -32,7 +32,7 @@
{% if g.is_editor %}
<td class="col-sm-auto text-center">
<a class="btn btn-dark" href="{{ url_for('drink_edit', drink_id = drink.id) }}">
<a class="btn btn-default" href="{{ url_for('drink_edit', drink_id = drink.id) }}">
<span class="fas fa-pencil-alt"></span>
</a>
</td>

View File

@@ -38,7 +38,7 @@
{% if g.is_editor %}
<td class="col-sm-auto text-center">
<a class="btn btn-dark" href="{{ url_for('enemy_edit', enemy_id = item.id) }}">
<a class="btn btn-default" href="{{ url_for('enemy_edit', enemy_id = item.id) }}">
<span class="fas fa-pencil-alt"></span>
</a>
</td>

View File

@@ -31,10 +31,10 @@
<td class="col-sm-auto text-center">{{ ep[prop] }}</td>
{% endfor %}
<a class="btn btn-dark" href="/episodes/{{ ep['id'] }}">Show</a>
<a class="btn btn-default" href="/episodes/{{ ep['id'] }}">Show</a>
{% if g.is_editor %}
<td class="col-sm-auto text-center">
<a class="btn btn-dark" href="/editepisode/{{ ep['id'] }}">Edit</a>
<a class="btn btn-default" href="/editepisode/{{ ep['id'] }}">Edit</a>
</td>
{% endif %}
</tr>

View File

@@ -4,14 +4,24 @@
{% block styles %}
{{ super() }}
<link rel="stylesheet" href="/static/dark_theme.css">
<link rel="stylesheet" href="/static/custom.css">
{% endblock %}
{% block body_attribs %}
style="background-image: url(/static/img/elite.png);
background-repeat: no-repeat;
background-position-x: left;
background-position-y: bottom;"
{% endblock %}
{% block content %}
<div class="container vertical-center">
<div class="card text-center mx-auto" style="width: 15rem">
<div class="card-header">Login</div>
<img src="/static/img/solaire.png" alt="Login" style="height: 15rem">
<div class="card-body">
<form method="post">
<div class="form-group">

View File

@@ -32,7 +32,7 @@
{% if g.is_editor %}
<td class="col-sm-auto text-center">
<a class="btn btn-dark" href="{{ url_for('player_edit', player_id = player.id) }}">
<a class="btn btn-default" href="{{ url_for('player_edit', player_id = player.id) }}">
<span class="fas fa-pencil-alt"></span>
</a>
</td>

View File

@@ -35,16 +35,16 @@
{% endfor %}
<td class="col-sm-auto text-center">
<a class="btn btn-dark" href="/seasons/{{ item.id }}"><span class="fas fa-eye"></span></a>
<a class="btn btn-default" href="/seasons/{{ item.id }}"><span class="fas fa-eye"></span></a>
</td>
{% if g.is_editor %}
<td class="col-sm-auto text-center">
<a class="btn btn-dark" href="{{ url_for('season_edit', season_id = item.id) }}">
<a class="btn btn-default" href="{{ url_for('season_edit', season_id = item.id) }}">
<span class="fas fa-pencil-alt"></span>
</a>
<a class="btn btn-dark" href="#">
<a class="btn btn-default" href="#">
<span class="fas fa-plus"></span> Episode
</a>
</td>