dark mode

This commit is contained in:
vabene1111 2020-02-04 22:00:47 +01:00
parent 2d70680214
commit c96159e15c
9 changed files with 180 additions and 3 deletions

File diff suppressed because one or more lines are too long

12
cookbook/static/themes/darkly.min.css vendored Normal file

File diff suppressed because one or more lines are too long

12
cookbook/static/themes/flatly.min.css vendored Normal file

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -18,11 +18,31 @@
<meta name="msapplication-TileImage" content="/mstile-144x144.png">
<!-- Bootstrap 4 -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css"
integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
<link id="id_main_css" rel="stylesheet"
href="{% static 'themes/darkly.min.css' %}">
<script src="https://code.jquery.com/jquery-3.4.1.js"
integrity="sha256-WpOohJOqMqqyKL9FccASB9O0KwACQJpFTUBLTYOVvVU="
crossorigin="anonymous"></script>
<script type="text/javascript">
function getCookieValue(a) {
let b = document.cookie.match('(^|[^;]+)\\s*' + a + '\\s*=\\s*([^;]+)');
return b ? b.pop() : '';
}
let theme_list = ['{% static 'themes/bootstrap.min.css' %}', '{% static 'themes/flatly.min.css' %}', '{% static 'themes/darkly.min.css' %}', '{% static 'themes/superhero.min.css' %}'];
let css = $('#id_main_css');
let theme = getCookieValue('theme');
if (theme !== "" && theme_list.includes(theme)) {
css.attr('href', theme);
} else {
css.attr('href', '{% static 'themes/bootstrap.min.css' %}');
}
</script>
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js"
integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo"
crossorigin="anonymous"></script>
@ -38,6 +58,7 @@
<link rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/select2-bootstrap-theme/0.1.0-beta.10/select2-bootstrap.css"
integrity="sha256-zFnNbsU+u3l0K+MaY92RvJI6AdAVAxK3/QrBApHvlH8=" crossorigin="anonymous"/>
<script type="text/javascript">
$.fn.select2.defaults.set("theme", "bootstrap");
</script>
@ -60,7 +81,7 @@
</style>
</head>
<body>
<nav class="navbar navbar-expand-lg navbar-dark bg-primary">
<nav class="navbar navbar-expand-lg navbar-dark bg-primary" id="id_main_nav">
<!--<a class="navbar-brand" href="{% url 'index' %}">{% trans 'Cookbook' %}</a>-->
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarText"
aria-controls="navbarText" aria-expanded="false" aria-label="Toggle navigation">
@ -134,6 +155,15 @@
<br/>
<br/>
<!-- Navbar theming, run before content to avoid flickering -->
<script type="text/javascript">
let nav_color = getCookieValue('color');
if (nav_color !== "") {
$('#id_main_nav').attr('class', 'navbar navbar-expand-lg navbar-dark bg-' + nav_color)
}
</script>
<div class="container">
{% for message in messages %}
@ -149,5 +179,6 @@
{% endblock %}
</div>
</body>
</html>

View File

@ -0,0 +1,96 @@
{% extends "base.html" %}
{% load i18n %}
{% load static %}
{% block title %}{% trans 'Settings' %}{% endblock %}
{% block content %}
<h3>
{% trans 'Settings' %}
</h3>
<br/>
<br/>
<h4><i class="fas fa-language"></i> {% trans 'Language' %}</h4>
<div class="row">
<div class="col-md-12">
<form action="{% url 'set_language' %}" method="post">{% csrf_token %}
<input class="form-control" name="next" type="hidden" value="{{ redirect_to }}">
<select name="language" class="form-control">
{% get_current_language as LANGUAGE_CODE %}
{% get_available_languages as LANGUAGES %}
{% get_language_info_list for LANGUAGES as languages %}
{% for language in languages %}
<option value="{{ language.code }}"{% if language.code == LANGUAGE_CODE %} selected{% endif %}>
{{ language.name_local }} ({{ language.code }})
</option>
{% endfor %}
</select>
<br/>
<input type="submit" value="{% trans 'Save' %}" class="btn btn-success">
</form>
</div>
</div>
<br/>
<br/>
<h4><i class="fas fa-palette"></i>{% trans 'Style' %}</h4>
<div class="row">
<div class="col col-md-12">
<label>
{% trans 'Choose Theme' %}
<select class="form-control" id="id_select_theme" onchange="changeTheme()">
<option value="{% static 'themes/bootstrap.min.css' %}">{% trans 'Default' %}</option>
<option value="{% static 'themes/flatly.min.css' %}">Flatly</option>
<option value="{% static 'themes/darkly.min.css' %}">Darkly</option>
<option value="{% static 'themes/superhero.min.css' %}">Superhero</option>
</select>
</label>
</div>
</div>
<div class="row">
<div class="col col-md-12">
<label>
{% trans 'Choose Navigation Color' %}
<select class="form-control" id="id_select_color" onchange="changeNavColor()">
<option value="primary">Primary</option>
<option value="secondary">Secondary</option>
<option value="info">Info</option>
<option value="success">Success</option>
<option value="warning">Warning</option>
<option value="danger">Danger</option>
</select>
</label>
</div>
</div>
<br/>
<br/>
<script type="text/javascript">
if (theme !== "") {
$('#id_select_theme').val(theme)
}
if (nav_color !== "") {
$('#id_select_color').val(nav_color)
}
function changeTheme() {
let theme = $('#id_select_theme').val();
document.cookie = "theme=" + theme + "; expires=Fri, 31 Dec 9999 23:59:59 GMT; path=/";
location.reload();
}
function changeNavColor() {
let color = $('#id_select_color').val();
document.cookie = "color=" + color + "; expires=Fri, 31 Dec 9999 23:59:59 GMT; path=/";
location.reload();
}
</script>
{% endblock %}

View File

@ -9,6 +9,7 @@ urlpatterns = [
path('books/', views.books, name='view_books'),
path('plan/', views.meal_plan, name='view_plan'),
path('shopping/', views.shopping_list, name='view_shopping'),
path('settings/', views.settings, name='view_settings'),
path('view/recipe/<int:pk>', views.recipe_view, name='view_recipe'),

View File

@ -141,3 +141,8 @@ def shopping_list(request):
ingredients.append(i)
return render(request, 'shopping_list.html', {'ingredients': ingredients, 'recipes': recipes, 'form': form})
@login_required
def settings(request):
return render(request, 'settings.html', {})

View File

@ -22,6 +22,7 @@ urlpatterns = [
path('', include('cookbook.urls')),
path('admin/', admin.site.urls),
path('accounts/', include('django.contrib.auth.urls')),
path('i18n/', include('django.conf.urls.i18n')),
]
if settings.DEBUG: