From 467f2396cad46f4a8f080cc4202e148d198dba06 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E2=80=9DNyymix=E2=80=9D?= <nyymix@gmail.com>
Date: Sun, 2 Feb 2025 19:48:55 +0200
Subject: [PATCH] Add dark template

---
 gallery/templates/gallery/album_detail.html   |  2 +-
 gallery/templates/gallery/album_list.html     |  9 +-
 gallery/templates/gallery/main.html           |  4 +-
 .../gallery/partials/pagination.html          | 10 +--
 gallery/templates/gallery/photo_detail.html   |  4 +-
 gallery/templates/gallery/photo_list.html     |  4 +-
 static/css/muistox.css                        |  4 +
 templates/base_dark.html                      | 89 +++++++++++++++++++
 8 files changed, 108 insertions(+), 18 deletions(-)
 create mode 100644 templates/base_dark.html

diff --git a/gallery/templates/gallery/album_detail.html b/gallery/templates/gallery/album_detail.html
index 4e107bd..24c9d70 100644
--- a/gallery/templates/gallery/album_detail.html
+++ b/gallery/templates/gallery/album_detail.html
@@ -1,4 +1,4 @@
-{% extends "base.html" %}
+{% extends "base_dark.html" %}
 {% load static %}
 
 
diff --git a/gallery/templates/gallery/album_list.html b/gallery/templates/gallery/album_list.html
index 72d1e60..2d1b405 100644
--- a/gallery/templates/gallery/album_list.html
+++ b/gallery/templates/gallery/album_list.html
@@ -1,4 +1,4 @@
-{% extends "base.html" %}
+{% extends "base_dark.html" %}
 {% load static %}
 
 <!-- Title -->
@@ -8,7 +8,6 @@
 <!-- Content -->
 {% block content %}
 
-
 <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 %}
     <div>
@@ -25,10 +24,8 @@
         </div>
     </div>
     {% endfor %}
-    </div>
-
-
-    {% include "./partials/pagination.html" %}
+</div>
 
+{% include "./partials/pagination.html" %}
 
 {% endblock %}
\ No newline at end of file
diff --git a/gallery/templates/gallery/main.html b/gallery/templates/gallery/main.html
index 125753a..691afed 100644
--- a/gallery/templates/gallery/main.html
+++ b/gallery/templates/gallery/main.html
@@ -1,7 +1,7 @@
-{% extends "base.html" %}
+{% extends "base_dark.html" %}
 
 <!-- Title -->
-{% block title %} Galleria {% endblock %}
+{% block title %} Gallery {% endblock %}
 
 <!-- Content -->
 {% block content %}
diff --git a/gallery/templates/gallery/partials/pagination.html b/gallery/templates/gallery/partials/pagination.html
index 5f63a44..1d1c226 100644
--- a/gallery/templates/gallery/partials/pagination.html
+++ b/gallery/templates/gallery/partials/pagination.html
@@ -1,13 +1,13 @@
 {% load link_tags %}
 
 {% 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">
          
     {% 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 %}
-      <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 %}
   
     {% if page_obj.number|add:'-3' > 1 %}
@@ -33,9 +33,9 @@
     {% endif %}
   
     {% 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 %}
-      <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 %}
   
   </ul>
diff --git a/gallery/templates/gallery/photo_detail.html b/gallery/templates/gallery/photo_detail.html
index f8cf95d..0842948 100644
--- a/gallery/templates/gallery/photo_detail.html
+++ b/gallery/templates/gallery/photo_detail.html
@@ -1,7 +1,7 @@
-{% extends "base.html" %}
+{% extends "base_dark.html" %}
 
 <!-- Title -->
-{% block title %} Gallery : Photo {% endblock %}
+{% block title %} Gallery : Photo : {{ photo.slug }} {% endblock %}
 
 
 <!-- Content -->
diff --git a/gallery/templates/gallery/photo_list.html b/gallery/templates/gallery/photo_list.html
index 56a00b8..44ef8b1 100644
--- a/gallery/templates/gallery/photo_list.html
+++ b/gallery/templates/gallery/photo_list.html
@@ -1,4 +1,4 @@
-{% extends "base.html" %}
+{% extends "base_dark.html" %}
 
 
 <!-- Title -->
@@ -8,7 +8,7 @@
 {% block content %}
 
 {% 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 == '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>
diff --git a/static/css/muistox.css b/static/css/muistox.css
index 4bec60f..19430c7 100644
--- a/static/css/muistox.css
+++ b/static/css/muistox.css
@@ -6,6 +6,10 @@ body {
 	min-height: 50px;
 }
 
+header {
+	margin-bottom: 0px;
+}
+
 .uk-breadcrumb>:nth-child(n+2):not(.uk-first-column)::before {
     margin: 0 10px 0 calc(10px - 4px);
 }
\ No newline at end of file
diff --git a/templates/base_dark.html b/templates/base_dark.html
new file mode 100644
index 0000000..1e72e9c
--- /dev/null
+++ b/templates/base_dark.html
@@ -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>
\ No newline at end of file