Enhancement: support custom logo / title on login page (#6775)

2025-04-02 13:45:10 -05:00 · 2024-05-20 09:40:19 -07:00 · 2024-05-20 09:40:19 -07:00 · 2a0c03eda0
commit 2a0c03eda0
parent 3061c59c06
5 changed files with 273 additions and 200 deletions
--- a/src/documents/context_processors.py
+++ b/src/documents/context_processors.py
@ -1,11 +1,28 @@
 from django.conf import settings as django_settings

+from paperless.config import GeneralConfig
+

 def settings(request):
+    general_config = GeneralConfig()
+
+    app_title = (
+        django_settings.APP_TITLE
+        if general_config.app_title is None or len(general_config.app_title) == 0
+        else general_config.app_title
+    )
+    app_logo = (
+        django_settings.APP_LOGO
+        if general_config.app_logo is None or len(general_config.app_logo) == 0
+        else general_config.app_logo
+    )
+
    return {
        "EMAIL_ENABLED": django_settings.EMAIL_HOST != "localhost"
        or django_settings.EMAIL_HOST_USER != "",
        "DISABLE_REGULAR_LOGIN": django_settings.DISABLE_REGULAR_LOGIN,
        "ACCOUNT_ALLOW_SIGNUPS": django_settings.ACCOUNT_ALLOW_SIGNUPS,
        "domain": getattr(django_settings, "PAPERLESS_URL", request.get_host()),
+        "APP_TITLE": app_title,
+        "APP_LOGO": app_logo,
    }
--- a/src/documents/static/accounts.css
+++ b/src/documents/static/accounts.css
@ -7,6 +7,19 @@ body {
  --pngx-primary-active: #0c2c10;
 }

+.logo {
+  height: auto;
+}
+
+.byline {
+  font-size: 0.6rem;
+  letter-spacing: 0.1rem;
+}
+
+.text-primary {
+  color: var(--pngx-primary) !important;
+}
+
 .form-control {
  --bs-body-bg: #fff;
 }
@ -28,6 +41,7 @@ body {

 .form-accounts {
  max-width: 330px;
+  min-width: 300px;
 }

 .form-stacked-top input {
@ -74,4 +88,8 @@ body {
  svg.logo .text {
    fill: #abb2bf !important;
  }
+
+  .byline {
+    color: #abb2bf;
+  }
 }
--- a/src/documents/templates/paperless-ngx/base.html
+++ b/src/documents/templates/paperless-ngx/base.html
@ -13,14 +13,31 @@
            {% endblock head_title %}
        </title>
        <link href="{% static 'bootstrap.min.css' %}" rel="stylesheet">
-        <link href="{% static 'accounts.css' %}" rel="stylesheet">
+        <link href="{% static 'base.css' %}" rel="stylesheet">
    </head>

    <body class="text-center">
        <div class="position-absolute top-50 start-50 translate-middle">
            <form class="form-accounts" method="post">
                {% csrf_token %}
-                {% include "paperless-ngx/snippets/svg_logo.html" with extra_attrs="width='300' class='logo mb-4'" %}
+                {% if not APP_LOGO and not APP_TITLE %}
+                    {% include "paperless-ngx/snippets/svg_logo.html" with extra_attrs="width='300' class='logo mb-4'" %}
+                {% else %}
+                    {% if APP_LOGO %}
+                        <img src="{{APP_LOGO}}" width="300" class="logo mb-1" />
+                        <div class="d-flex flex-column align-items-end mb-4">
+                            <span class="byline text-uppercase font-monospace">by Paperless-ngx</span>
+                        </div>
+                    {% else %}
+                        <h1 class="font-weight-normal text-primary mb-1 d-flex justify-content-center align-items-start">
+                            {% include "paperless-ngx/snippets/svg_leaf.html" with extra_attrs="width='30' class='mt-2'" %}
+                            <div class="d-flex flex-column align-items-end mb-4">
+                                <span class="ms-2">{{ APP_TITLE }}</span>
+                                <span class="byline text-uppercase font-monospace">by Paperless-ngx</span>
+                            </div>
+                        </h1>
+                    {% endif %}
+                {% endif %}
                {% for message in messages %}
                    <div class="alert alert-{{ message.level_tag }}" role="alert">
                    {{ message }}
--- a/src/documents/templates/paperless-ngx/snippets/svg_leaf.html
+++ b/src/documents/templates/paperless-ngx/snippets/svg_leaf.html
@ -0,0 +1,5 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 198.43 238.91" {{ extra_attrs }} fill="currentColor">
+    <path
+        d="M194.7,0C164.22,70.94,17.64,79.74,64.55,194.06c.58,1.47-10.85,17-18.47,29.9-1.76-6.45-3.81-13.48-3.52-14.07,38.11-45.14-27.26-70.65-30.78-107.58C-4.64,131.62-10.5,182.92,39,212.53c.3,0,2.64,11.14,3.81,16.71a58.55,58.55,0,0,0-2.93,6.45c-1.17,2.93,7.62,2.64,7.62,3.22.88-.29,21.7-36.93,22.28-37.23C187.67,174.72,208.48,68.6,194.7,0ZM134.61,74.75C79.5,124,70.12,160.64,71.88,178.53,53.41,134.85,107.64,86.77,134.61,74.75ZM28.2,145.11c10.55,9.67,28.14,39.28,13.19,56.57C44.91,193.77,46.08,175.89,28.2,145.11Z"
+        transform="translate(0 0)" />
+</svg>
--- a/src/locale/en_US/LC_MESSAGES/django.po
+++ b/src/locale/en_US/LC_MESSAGES/django.po