From ff414ea0468ec9c84f23a7a7586fcec95b2b323f Mon Sep 17 00:00:00 2001 From: Emmy D'Anello Date: Mon, 20 Feb 2023 23:02:09 +0100 Subject: [PATCH] Add dark theme based on browser preference --- .../participation/participation_detail.html | 2 +- .../participation/passage_detail.html | 4 +-- .../templates/participation/pool_detail.html | 4 +-- .../templates/participation/team_detail.html | 2 +- .../participation/tournament_detail.html | 4 +-- .../email_validation_complete.html | 2 +- .../email_validation_email_sent.html | 2 +- .../templates/registration/user_detail.html | 2 +- tfjm/static/main.js | 15 +++++++++++ tfjm/static/tfjm.svg | 12 ++++++++- tfjm/static/theme.js | 27 +++++++++++++++++++ tfjm/templates/base.html | 27 +++++-------------- tfjm/templates/index.html | 8 +++--- 13 files changed, 75 insertions(+), 36 deletions(-) create mode 100644 tfjm/static/main.js create mode 100644 tfjm/static/theme.js diff --git a/apps/participation/templates/participation/participation_detail.html b/apps/participation/templates/participation/participation_detail.html index 4764981..2ff3f59 100644 --- a/apps/participation/templates/participation/participation_detail.html +++ b/apps/participation/templates/participation/participation_detail.html @@ -4,7 +4,7 @@ {% block content %} {% trans "any" as any %} -
+

{% trans "Participation of team" %} {{ participation.team.name }} ({{ participation.team.trigram }})

diff --git a/apps/participation/templates/participation/passage_detail.html b/apps/participation/templates/participation/passage_detail.html index 7add29a..062d6a2 100644 --- a/apps/participation/templates/participation/passage_detail.html +++ b/apps/participation/templates/participation/passage_detail.html @@ -4,7 +4,7 @@ {% block content %} {% trans "any" as any %} -
+

{{ passage }}

@@ -59,7 +59,7 @@ {% render_table notes %} -
+
{% trans "Average points for the defender writing:" %}
diff --git a/apps/participation/templates/participation/pool_detail.html b/apps/participation/templates/participation/pool_detail.html index 0dcbc93..f66ea85 100644 --- a/apps/participation/templates/participation/pool_detail.html +++ b/apps/participation/templates/participation/pool_detail.html @@ -3,7 +3,7 @@ {% load django_tables2 i18n %} {% block content %} -
+

{{ pool }}

@@ -36,7 +36,7 @@
{{ pool.bbb_url|urlize }}
-
+
{% trans "Ranking" %}
diff --git a/apps/participation/templates/participation/team_detail.html b/apps/participation/templates/participation/team_detail.html index c7314b9..45a29bb 100644 --- a/apps/participation/templates/participation/team_detail.html +++ b/apps/participation/templates/participation/team_detail.html @@ -4,7 +4,7 @@ {% load crispy_forms_filters %} {% block content %} -
+

{{ team.name }}

diff --git a/apps/participation/templates/participation/tournament_detail.html b/apps/participation/templates/participation/tournament_detail.html index 3e30171..fdba961 100644 --- a/apps/participation/templates/participation/tournament_detail.html +++ b/apps/participation/templates/participation/tournament_detail.html @@ -3,7 +3,7 @@ {% load getconfig i18n django_tables2 %} {% block content %} -
+

{{ tournament.name }}

@@ -92,7 +92,7 @@ {% if notes %}
-
+
{% trans "Ranking" %}
diff --git a/apps/registration/templates/registration/email_validation_complete.html b/apps/registration/templates/registration/email_validation_complete.html index 4039e0b..ea650c1 100644 --- a/apps/registration/templates/registration/email_validation_complete.html +++ b/apps/registration/templates/registration/email_validation_complete.html @@ -5,7 +5,7 @@ SPDX-License-Identifier: GPL-3.0-or-later {% load i18n %} {% block content %} -
+

{{ title }}

diff --git a/apps/registration/templates/registration/email_validation_email_sent.html b/apps/registration/templates/registration/email_validation_email_sent.html index adc0c02..3397980 100644 --- a/apps/registration/templates/registration/email_validation_email_sent.html +++ b/apps/registration/templates/registration/email_validation_email_sent.html @@ -5,7 +5,7 @@ SPDX-License-Identifier: GPL-3.0-or-later {% load i18n %} {% block content %} -
+

{% trans "Account activation" %}

diff --git a/apps/registration/templates/registration/user_detail.html b/apps/registration/templates/registration/user_detail.html index 9fb7975..5ae3961 100644 --- a/apps/registration/templates/registration/user_detail.html +++ b/apps/registration/templates/registration/user_detail.html @@ -5,7 +5,7 @@ {% block content %} {% trans "any" as any %} -
+

{{ user_object.first_name }} {{ user_object.last_name }}

diff --git a/tfjm/static/main.js b/tfjm/static/main.js new file mode 100644 index 0000000..906e0d4 --- /dev/null +++ b/tfjm/static/main.js @@ -0,0 +1,15 @@ +function initModal(target, url, content_id = 'form-content') { + document.querySelector('[data-bs-target="#' + target + 'Modal"]').addEventListener('click', () => { + let modalBody = document.querySelector("#" + target + "Modal div.modal-body") + + if (!modalBody.innerHTML.trim()) { + if (url instanceof Function) url = url() + + fetch(url, {headers: {'CONTENT-ONLY': '1'}}) + .then(resp => resp.text()) + .then(resp => new DOMParser().parseFromString(resp, 'text/html')) + .then(res => modalBody.innerHTML = res.getElementById(content_id).outerHTML) + .then(() => $('.selectpicker').selectpicker()) // TODO Update that when the library will be JQuery-free + } + }) +} diff --git a/tfjm/static/tfjm.svg b/tfjm/static/tfjm.svg index 699316b..5f8bf4b 100644 --- a/tfjm/static/tfjm.svg +++ b/tfjm/static/tfjm.svg @@ -14,8 +14,18 @@ sodipodi:docname="logo.svg" width="30.311995" height="9.7779999" - style="fill:black" inkscape:version="0.92.2 2405546, 2018-03-11"> + diff --git a/tfjm/static/theme.js b/tfjm/static/theme.js new file mode 100644 index 0000000..188c3b5 --- /dev/null +++ b/tfjm/static/theme.js @@ -0,0 +1,27 @@ +/*! + * Color mode toggler for Bootstrap's docs (https://getbootstrap.com/) + * Copyright 2011-2022 The Bootstrap Authors + * Licensed under the Creative Commons Attribution 3.0 Unported License. + */ + +(() => { + 'use strict' + + const getPreferredTheme = () => { + return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light' + } + + const setTheme = function (theme) { + if (theme === 'auto' && window.matchMedia('(prefers-color-scheme: dark)').matches) { + document.documentElement.setAttribute('data-bs-theme', 'dark') + } else { + document.documentElement.setAttribute('data-bs-theme', theme) + } + } + + setTheme(getPreferredTheme()) + + window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', () => { + setTheme(getPreferredTheme()) + }) +})() \ No newline at end of file diff --git a/tfjm/templates/base.html b/tfjm/templates/base.html index d12045b..319af0e 100644 --- a/tfjm/templates/base.html +++ b/tfjm/templates/base.html @@ -38,10 +38,10 @@ {% block extracss %}{% endblock %} -
@@ -174,7 +174,7 @@ {% endblock %} -