Add dark template

This commit is contained in:
Nyymix 2025-02-02 19:48:55 +02:00
parent 7c7eb0061d
commit 467f2396ca
8 changed files with 108 additions and 18 deletions

View file

@ -1,4 +1,4 @@
{% extends "base.html" %} {% extends "base_dark.html" %}
{% load static %} {% load static %}

View file

@ -1,4 +1,4 @@
{% extends "base.html" %} {% extends "base_dark.html" %}
{% load static %} {% load static %}
<!-- Title --> <!-- Title -->
@ -8,7 +8,6 @@
<!-- Content --> <!-- Content -->
{% block content %} {% block content %}
<div class="uk-grid-small uk-child-width-1-2@s uk-child-width-1-3@m" uk-grid="masonry: true"> <div class="uk-grid-small uk-child-width-1-2@s uk-child-width-1-3@m" uk-grid="masonry: true">
{% for album in album_list %} {% for album in album_list %}
<div> <div>
@ -25,10 +24,8 @@
</div> </div>
</div> </div>
{% endfor %} {% endfor %}
</div> </div>
{% include "./partials/pagination.html" %}
{% include "./partials/pagination.html" %}
{% endblock %} {% endblock %}

View file

@ -1,7 +1,7 @@
{% extends "base.html" %} {% extends "base_dark.html" %}
<!-- Title --> <!-- Title -->
{% block title %} Galleria {% endblock %} {% block title %} Gallery {% endblock %}
<!-- Content --> <!-- Content -->
{% block content %} {% block content %}

View file

@ -1,13 +1,13 @@
{% load link_tags %} {% load link_tags %}
{% if page_obj.has_other_pages %} {% if page_obj.has_other_pages %}
<div class="uk-margin"> <div class="uk-margin uk-background-muted uk-text-uppercase">
<ul class="uk-pagination uk-flex-center"> <ul class="uk-pagination uk-flex-center">
{% if page_obj.has_previous %} {% if page_obj.has_previous %}
<li><a href="{% paginator_link page_obj.previous_page_number request.GET %}"><span class="uk-margin-small-right" uk-pagination-previous></span> Previous</a></li> <li><a href="{% paginator_link page_obj.previous_page_number request.GET %}">&laquo; Previous</a></li>
{% else %} {% else %}
<li class="uk-disabled"><a href="#"><span class="uk-margin-small-right" uk-pagination-previous></span> Previous</a></li> <li class="uk-disabled"><a href="#">&laquo; Previous</a></li>
{% endif %} {% endif %}
{% if page_obj.number|add:'-3' > 1 %} {% if page_obj.number|add:'-3' > 1 %}
@ -33,9 +33,9 @@
{% endif %} {% endif %}
{% if page_obj.has_next %} {% if page_obj.has_next %}
<li><a href="{% paginator_link page_obj.next_page_number request.GET %}">Next <span uk-pagination-next></span></a></li> <li><a href="{% paginator_link page_obj.next_page_number request.GET %}">Next &raquo;</a></li>
{% else %} {% else %}
<li class="uk-disabled"><a href="#">Next <span class="uk-margin-small-left" uk-pagination-next></span></a></li> <li class="uk-disabled"><a href="#">Next &raquo;</a></li>
{% endif %} {% endif %}
</ul> </ul>

View file

@ -1,7 +1,7 @@
{% extends "base.html" %} {% extends "base_dark.html" %}
<!-- Title --> <!-- Title -->
{% block title %} Gallery : Photo {% endblock %} {% block title %} Gallery : Photo : {{ photo.slug }} {% endblock %}
<!-- Content --> <!-- Content -->

View file

@ -1,4 +1,4 @@
{% extends "base.html" %} {% extends "base_dark.html" %}
<!-- Title --> <!-- Title -->
@ -8,7 +8,7 @@
{% block content %} {% block content %}
{% load link_tags %} {% load link_tags %}
<ul class="uk-tab uk-flex-right"> <ul class="uk-tab uk-flex-left uk-margin-remove-top">
<li {% if order == 'latest' %}class="uk-active" {% endif %}><a href="{% search_link 'latest' request.GET %}">Latest</a></li> <li {% if order == 'latest' %}class="uk-active" {% endif %}><a href="{% search_link 'latest' request.GET %}">Latest</a></li>
<li {% if order == 'liked' %}class="uk-active" {% endif %}><a href="{% search_link 'liked' request.GET %}">Top Liked</a></li> <li {% if order == 'liked' %}class="uk-active" {% endif %}><a href="{% search_link 'liked' request.GET %}">Top Liked</a></li>
<li {% if order == 'popular' %}class="uk-active" {% endif %}><a href="{% search_link 'popular' request.GET %}">Popular</a></li> <li {% if order == 'popular' %}class="uk-active" {% endif %}><a href="{% search_link 'popular' request.GET %}">Popular</a></li>

View file

@ -6,6 +6,10 @@ body {
min-height: 50px; min-height: 50px;
} }
header {
margin-bottom: 0px;
}
.uk-breadcrumb>:nth-child(n+2):not(.uk-first-column)::before { .uk-breadcrumb>:nth-child(n+2):not(.uk-first-column)::before {
margin: 0 10px 0 calc(10px - 4px); margin: 0 10px 0 calc(10px - 4px);
} }

89
templates/base_dark.html Normal file
View file

@ -0,0 +1,89 @@
<!DOCTYPE html>
<html lang="en">
<head>
{% load static %}
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Nyymix.net Photo Gallery">
<title>{% block title %}Gallery{% endblock %}</title>
<!-- UIkit CSS -->
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/uikit/dist/css/uikit.min.css" />
<!-- Muistox CSS -->
<link rel="stylesheet" type="text/css" href="{% static 'css/muistox.css' %}">
<link rel="shortcut icon" type="image/png" href="{% static 'favicon.ico' %}" />
</head>
<body>
<!-- Header -->
<header class="uk-align-center uk-container-large">
<!-- Parallax -->
{% block parallax %}{% endblock %}
<!-- Navbar -->
{% block navbar %}
<div uk-sticky="sel-target: .uk-navbar-container; cls-active: uk-navbar-sticky;">
<nav class="uk-background-secondary uk-light" uk-navbar>
<div class="uk-navbar-left uk-margin-left">
<ul class="uk-navbar-nav">
<li><a href="{% url 'gallery:main_url' %}"><span uk-icon="camera"></span></a></li>
<li class="uk-visible@m"><a href="{% url 'gallery:albums_url' %}">Albums</a></li>
<li class="uk-visible@m"><a href="{% url 'gallery:photos_url' %}">Photostream</a></li>
</ul>
</div>
<div class="uk-navbar-right uk-margin-right">
<ul class="uk-navbar-nav">
<li class="uk-visible@m"><a href="#">Contact</a></li>
{% if user.is_authenticated %}
<li class="uk-visible@m"><a href="{% url 'admin:index' %}">Admin</a></li>
{% endif %}
<li class="uk-hidden@m"><a class="uk-navbar-toggle" uk-navbar-toggle-icon uk-toggle="target: #offcanvas-nav"></a></li>
</ul>
</div>
</nav>
</div>
<!-- Navbar mobile -->
<div id="offcanvas-nav" uk-offcanvas="flip: true; overlay: true">
<div class="uk-offcanvas-bar">
<button class="uk-offcanvas-close" type="button" uk-close></button>
<ul class="uk-nav uk-nav-default">
<li><a href="{% url 'gallery:main_url' %}">Home</a></li>
<li><a href="{% url 'gallery:albums_url' %}">Albums</a></li>
<li><a href="{% url 'gallery:photos_url' %}">Photostream</a></li>
<li><a href="#">Contact</a></li>
{% if user.is_authenticated %}
<li><a href="{% url 'admin:index' %}">Admin</a></li>
{% endif %}
</ul>
</div>
</div>
{% endblock %}
</header>
<!-- Main -->
<main class="uk-align-center uk-container-large">
{% block content %} No Content {% endblock %}
</main>
<!-- Footer -->
<footer class="uk-align-center uk-container-large">
<div class="uk-background-secondary uk-padding-small uk-light uk-text-center uk-text-light">
&copy; {% now "Y" %} Nyymix, powered by <a href="https://git.hakkeri.net/nyymix/muistox">muistox</a>.
</div>
</footer>
<!-- UIkit JS -->
<script src="https://cdn.jsdelivr.net/npm/uikit/dist/js/uikit.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/uikit/dist/js/uikit-icons.min.js"></script>
<!-- Muistox JS -->
<script src="{% static 'js/muistox.js' %}"></script>
</body>
</html>