From 58fa2d25395f01e379956379ba8ce55d5ff2b7f7 Mon Sep 17 00:00:00 2001 From: GDWR Date: Mon, 7 Feb 2022 22:22:42 +0000 Subject: Correct typehints --- pydis_site/context_processors.py | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/pydis_site/context_processors.py b/pydis_site/context_processors.py index 6937a3db..c8549d6a 100644 --- a/pydis_site/context_processors.py +++ b/pydis_site/context_processors.py @@ -1,8 +1,8 @@ -from django.template import RequestContext +from django.http import HttpRequest from pydis_site.constants import GIT_SHA -def git_sha_processor(_: RequestContext) -> dict: +def git_sha_processor(_: HttpRequest) -> dict: """Expose the git SHA for this repo to all views.""" return {'git_sha': GIT_SHA} -- cgit v1.2.3 From c7359569b5d775553a93a7686f9ac4f21892000a Mon Sep 17 00:00:00 2001 From: GDWR Date: Mon, 7 Feb 2022 22:23:24 +0000 Subject: Add dark theme stylesheet --- pydis_site/settings.py | 9 +++++++++ pydis_site/templates/base/base.html | 2 ++ 2 files changed, 11 insertions(+) diff --git a/pydis_site/settings.py b/pydis_site/settings.py index 3b146f2c..1ba81a5c 100644 --- a/pydis_site/settings.py +++ b/pydis_site/settings.py @@ -268,6 +268,15 @@ BULMA_SETTINGS = { "footer-padding": "1rem 1.5rem 1rem", "tooltip-max-width": "30rem", }, + "dark_variables": { + "primary": "#373737", + + # Use the same sizes + "dimensions": "16 24 32 48 64 96 128 256 512", + "navbar-height": "4.75rem", + "footer-padding": "1rem 1.5rem 1rem", + "tooltip-max-width": "30rem", + }, "extensions": [ "bulma-dropdown", "bulma-navbar-burger", diff --git a/pydis_site/templates/base/base.html b/pydis_site/templates/base/base.html index b7322f12..f7dce8b0 100644 --- a/pydis_site/templates/base/base.html +++ b/pydis_site/templates/base/base.html @@ -24,6 +24,8 @@ Python Discord | {% block title %}Website{% endblock %} {% bulma %} + {% bulma 'dark' %} + {% font_awesome %} {% block head %}{% endblock %} -- cgit v1.2.3 From 04debcd2354ee8bce0674eeb548edda8897b4ed3 Mon Sep 17 00:00:00 2001 From: GDWR Date: Tue, 8 Feb 2022 00:27:05 +0000 Subject: Update dependency --- poetry.lock | 26 +++++++++++++------------- pyproject.toml | 2 +- 2 files changed, 14 insertions(+), 14 deletions(-) diff --git a/poetry.lock b/poetry.lock index 3b26c275..a0344800 100644 --- a/poetry.lock +++ b/poetry.lock @@ -173,7 +173,7 @@ prometheus-client = ">=0.7" [[package]] name = "django-simple-bulma" -version = "2.4.0" +version = "2.5.0" description = "Django application to add the Bulma CSS framework and its extensions" category = "main" optional = false @@ -375,7 +375,7 @@ tornado = ["tornado (>=0.2)"] [[package]] name = "identify" -version = "2.4.6" +version = "2.4.8" description = "File identification library for Python" category = "dev" optional = false @@ -459,7 +459,7 @@ python-versions = "*" [[package]] name = "pbr" -version = "5.8.0" +version = "5.8.1" description = "Python Build Reasonableness" category = "dev" optional = false @@ -740,7 +740,7 @@ socks = ["PySocks (>=1.5.6,!=1.5.7,<2.0)"] [[package]] name = "virtualenv" -version = "20.13.0" +version = "20.13.1" description = "Virtual Python Environment builder" category = "dev" optional = false @@ -782,7 +782,7 @@ testing = ["pytest (>=6)", "pytest-checkdocs (>=2.4)", "pytest-flake8", "pytest- [metadata] lock-version = "1.1" python-versions = "3.9.*" -content-hash = "fc9b20c33c65a289122d710844285ac20d7598e65c7f8237f8903509f5b2dea4" +content-hash = "8baf81a34be4e8bacbdc943ff03ea80af40a0e0a1df11bcc3e68f13ff8510f62" [metadata.files] asgiref = [ @@ -895,8 +895,8 @@ django-prometheus = [ {file = "django_prometheus-2.2.0-py2.py3-none-any.whl", hash = "sha256:e6616770d8820b8834762764bf1b76ec08e1b98e72a6f359d488a2e15fe3537c"}, ] django-simple-bulma = [ - {file = "django-simple-bulma-2.4.0.tar.gz", hash = "sha256:99a15261b0c61062a128af3c6a45da9c066d6a4a548c9063464e0fb7a5438aa1"}, - {file = "django_simple_bulma-2.4.0-py3-none-any.whl", hash = "sha256:95d5e26bebbf6a0184e33df844a0ff534bdfd91431e413d1a844d47a75c55fff"}, + {file = "django-simple-bulma-2.5.0.tar.gz", hash = "sha256:d4e9f6ea857954a9bdc7a4f16453834a578cd04da5c3a96b2a3241bfcfabead2"}, + {file = "django_simple_bulma-2.5.0-py3-none-any.whl", hash = "sha256:c413b031494d80f674068a782440c6ec5f20a12501ee7464d6f781a5777fa89c"}, ] djangorestframework = [ {file = "djangorestframework-3.12.4-py3-none-any.whl", hash = "sha256:6d1d59f623a5ad0509fe0d6bfe93cbdfe17b8116ebc8eda86d45f6e16e819aaf"}, @@ -960,8 +960,8 @@ gunicorn = [ {file = "gunicorn-20.0.4.tar.gz", hash = "sha256:1904bb2b8a43658807108d59c3f3d56c2b6121a701161de0ddf9ad140073c626"}, ] identify = [ - {file = "identify-2.4.6-py2.py3-none-any.whl", hash = "sha256:cf06b1639e0dca0c184b1504d8b73448c99a68e004a80524c7923b95f7b6837c"}, - {file = "identify-2.4.6.tar.gz", hash = "sha256:233679e3f61a02015d4293dbccf16aa0e4996f868bd114688b8c124f18826706"}, + {file = "identify-2.4.8-py2.py3-none-any.whl", hash = "sha256:a55bdd671b6063eb837af938c250ec00bba6e610454265133b0d2db7ae718d0f"}, + {file = "identify-2.4.8.tar.gz", hash = "sha256:97e839c1779f07011b84c92af183e1883d9745d532d83412cca1ca76d3808c1c"}, ] idna = [ {file = "idna-3.3-py3-none-any.whl", hash = "sha256:84d9dd047ffa80596e0f246e2eab0b391788b0503584e8945f2368256d2735ff"}, @@ -1000,8 +1000,8 @@ nodeenv = [ {file = "nodeenv-1.6.0.tar.gz", hash = "sha256:3ef13ff90291ba2a4a7a4ff9a979b63ffdd00a464dbe04acf0ea6471517a4c2b"}, ] pbr = [ - {file = "pbr-5.8.0-py2.py3-none-any.whl", hash = "sha256:176e8560eaf61e127817ef93d8a844803abb27a4d4637f0ff3bb783129be2e0a"}, - {file = "pbr-5.8.0.tar.gz", hash = "sha256:672d8ebee84921862110f23fcec2acea191ef58543d34dfe9ef3d9f13c31cddf"}, + {file = "pbr-5.8.1-py2.py3-none-any.whl", hash = "sha256:27108648368782d07bbf1cb468ad2e2eeef29086affd14087a6d04b7de8af4ec"}, + {file = "pbr-5.8.1.tar.gz", hash = "sha256:66bc5a34912f408bb3925bf21231cb6f59206267b7f63f3503ef865c1a292e25"}, ] pep8-naming = [ {file = "pep8-naming-0.12.1.tar.gz", hash = "sha256:bb2455947757d162aa4cad55dba4ce029005cd1692f2899a21d51d8630ca7841"}, @@ -1190,8 +1190,8 @@ urllib3 = [ {file = "urllib3-1.26.8.tar.gz", hash = "sha256:0e7c33d9a63e7ddfcb86780aac87befc2fbddf46c58dbb487e0855f7ceec283c"}, ] virtualenv = [ - {file = "virtualenv-20.13.0-py2.py3-none-any.whl", hash = "sha256:339f16c4a86b44240ba7223d0f93a7887c3ca04b5f9c8129da7958447d079b09"}, - {file = "virtualenv-20.13.0.tar.gz", hash = "sha256:d8458cf8d59d0ea495ad9b34c2599487f8a7772d796f9910858376d1600dd2dd"}, + {file = "virtualenv-20.13.1-py2.py3-none-any.whl", hash = "sha256:45e1d053cad4cd453181ae877c4ffc053546ae99e7dd049b9ff1d9be7491abf7"}, + {file = "virtualenv-20.13.1.tar.gz", hash = "sha256:e0621bcbf4160e4e1030f05065c8834b4e93f4fcc223255db2a823440aca9c14"}, ] whitenoise = [ {file = "whitenoise-5.3.0-py2.py3-none-any.whl", hash = "sha256:d963ef25639d1417e8a247be36e6aedd8c7c6f0a08adcb5a89146980a96b577c"}, diff --git a/pyproject.toml b/pyproject.toml index b350836e..be9f285a 100644 --- a/pyproject.toml +++ b/pyproject.toml @@ -12,7 +12,7 @@ django-environ = "~=0.4.5" django-filter = "~=21.1" djangorestframework = "~=3.12.0" psycopg2-binary = "~=2.8.0" -django-simple-bulma = "~=2.4" +django-simple-bulma = "~=2.5" whitenoise = "~=5.0" requests = "~=2.21" pyyaml = "~=5.1" -- cgit v1.2.3 From 01deafa5bf5b68784d434d6f361c21d72cf89069 Mon Sep 17 00:00:00 2001 From: GDWR Date: Tue, 8 Feb 2022 00:43:03 +0000 Subject: Add initial dark theme --- pydis_site/settings.py | 7 ++- pydis_site/static/css/base/navbar.css | 83 +++++++++++++++++++++++++++++++++ pydis_site/static/js/base/navbar.js | 87 +++++++++++++++++++++++++++++++++++ pydis_site/templates/base/navbar.html | 17 +++++++ 4 files changed, 193 insertions(+), 1 deletion(-) create mode 100644 pydis_site/static/css/base/navbar.css create mode 100644 pydis_site/static/js/base/navbar.js diff --git a/pydis_site/settings.py b/pydis_site/settings.py index 1ba81a5c..0d19dc10 100644 --- a/pydis_site/settings.py +++ b/pydis_site/settings.py @@ -269,7 +269,12 @@ BULMA_SETTINGS = { "tooltip-max-width": "30rem", }, "dark_variables": { - "primary": "#373737", + "primary": "#7289DA", + "white": "#22272E", + "text": "#F4F4F4", + + "link": "$primary", + # Use the same sizes "dimensions": "16 24 32 48 64 96 128 256 512", diff --git a/pydis_site/static/css/base/navbar.css b/pydis_site/static/css/base/navbar.css new file mode 100644 index 00000000..95ca36b8 --- /dev/null +++ b/pydis_site/static/css/base/navbar.css @@ -0,0 +1,83 @@ +.switch { + position: relative; + height: 3.25em; + width: 6.5em; + cursor: pointer; +} + +.switch-outer { + position: absolute; + height: 100%; + width: 100%; + border-radius: 2em; + transition: background-color 0.3s ease-out; +} + +.switch.dark .switch-outer { + background-color: #22272E; +} + +.switch.light .switch-outer { + background-color: #3f61d9; +} + +.switch-inner { + width: 95%; + top: 50%; + border-radius: 2em; + transition: background-color 0.2s ease-out; +} + +.switch.light .switch-inner { + background-color: #7289da; +} +.switch.dark .switch-inner { + background-color: #1b2137; +} + +.knob { + position: absolute; + height: 75%; + width: 37.5%; + top: 50%; + transform: translate(0%, -65%); + border-radius: 10em; + transition: all 0.5s ease-out; +} + +.knob.dark { + background-color: #586282; + margin: 6% auto auto 8%; +} + +.knob.light { + background-color: #364c94; + margin: 6% auto auto 56%; +} + +.theme-icon { + position: absolute !important; + color: white; + --ggs: 1.25; + opacity: 100%; + transition: opacity 0.2s ease-out; + top: 33%; + bottom: auto; +} + +.theme-icon.light { + left: 18%; +} + +.theme-icon.dark { + right: 18%; + top: 35% +} + +.switch.dark .theme-icon.light { + opacity: 0; +} + +.switch.light .theme-icon.dark { + opacity: 0; +} \ No newline at end of file diff --git a/pydis_site/static/js/base/navbar.js b/pydis_site/static/js/base/navbar.js new file mode 100644 index 00000000..f0bd94b9 --- /dev/null +++ b/pydis_site/static/js/base/navbar.js @@ -0,0 +1,87 @@ +"use strict"; + +const defaultCssElement = $("#bulma-css")[0]; +const darkCssElement = $("#bulma-css-dark")[0]; + +function getCurrentTheme() { + return document.cookie + .split('; ') + .find(row => row.startsWith('theme=')) + .split('=')[1]; +} + +function displayThemedElements() { + const defaultElements = Array.from($(".show-default-mode")); + const darkElements = Array.from($(".show-dark-mode")); + + switch (getCurrentTheme()) { + case "": + case "default": + defaultElements.forEach(e => e.style.display = null); + darkElements.forEach(e => e.style.display = 'none'); + break; + case "dark": + defaultElements.forEach(e => e.style.display = 'none'); + darkElements.forEach(e => e.style.display = null); + break; + } +} + +function setStyleSheets() { + switch (getCurrentTheme()) { + case "": + case "default": + defaultCssElement.disabled = false; + darkCssElement.disabled = true; + break; + case "dark": + defaultCssElement.disabled = true; + darkCssElement.disabled = false; + break; + } +} + + +// Executed when the page has finished loading. +document.addEventListener("DOMContentLoaded", () => { + + setStyleSheets(); + displayThemedElements(); + + $('#theme-switch').on("click", () => { + + // Update cookie + if (getCurrentTheme() === "dark") { + document.cookie = "theme=default"; + } else { + document.cookie = "theme=dark"; + } + + setStyleSheets(); + displayThemedElements(); + + // Animations + let switchToggle = $(".switch")[0]; + let knob = $(".knob")[0]; + + if (knob.classList.contains("dark")) { + knob.classList.remove("dark"); + knob.classList.add("light"); + + // After 500ms, switch the icons + setTimeout(function() { + switchToggle.classList.remove("dark"); + switchToggle.classList.add("light"); + }, 100); + } else { + knob.classList.remove("light"); + knob.classList.add("dark"); + + // After 500ms, switch the icons + setTimeout(function() { + switchToggle.classList.remove("light"); + switchToggle.classList.add("dark"); + }, 100); + } + }); +}); \ No newline at end of file diff --git a/pydis_site/templates/base/navbar.html b/pydis_site/templates/base/navbar.html index d7fb4f4c..41d6c778 100644 --- a/pydis_site/templates/base/navbar.html +++ b/pydis_site/templates/base/navbar.html @@ -1,5 +1,12 @@ {% load static %} +{% block head %} + + + + +{% endblock %} + -- cgit v1.2.3 From 508a34911a524f0c389db9fa008e822e94d55c51 Mon Sep 17 00:00:00 2001 From: GDWR Date: Tue, 8 Feb 2022 22:04:23 +0000 Subject: Use colour helpers --- pydis_site/templates/resources/resource_box.html | 12 ++++++------ pydis_site/templates/resources/resources.html | 24 ++++++++++++------------ 2 files changed, 18 insertions(+), 18 deletions(-) diff --git a/pydis_site/templates/resources/resource_box.html b/pydis_site/templates/resources/resource_box.html index e26203e9..b86947b9 100644 --- a/pydis_site/templates/resources/resource_box.html +++ b/pydis_site/templates/resources/resource_box.html @@ -2,7 +2,7 @@ {% load to_kebabcase %} {% load get_category_icon %} -
+
{% if 'title_url' in resource %} {% include "resources/resource_box_header.html" %} @@ -13,7 +13,7 @@

{{ resource.description|safe }}

-
+
{# Add primary link #} {% if "title_url" in resource %} @@ -36,7 +36,7 @@
{% for tag in resource.tags.topics %} @@ -46,7 +46,7 @@ {% endfor %} {% for tag in resource.tags.type %} @@ -56,7 +56,7 @@ {% endfor %} {% for tag in resource.tags.payment_tiers %} @@ -66,7 +66,7 @@ {% endfor %} {% for tag in resource.tags.difficulty %} diff --git a/pydis_site/templates/resources/resources.html b/pydis_site/templates/resources/resources.html index 70fad097..4545f3c2 100644 --- a/pydis_site/templates/resources/resources.html +++ b/pydis_site/templates/resources/resources.html @@ -21,8 +21,8 @@ {% block content %} {% include "base/navbar.html" %} -
-
+
+
{# Filtering toolbox #}
@@ -30,11 +30,11 @@

Filter Resources

{# Filter box tags #} -
+
{# A filter tag for when there are no filters active #} - + No filters selected @@ -43,7 +43,7 @@ {% for filter_item in filter_data.filters %} {% if filter_name == "Difficulty" %} @@ -54,29 +54,29 @@ {% endif %} {% if filter_name == "Type" %} {{ filter_item|title }} - + {% endif %} {% if filter_name == "Payment tiers" %} - + {{ filter_item|title }} {% endif %} {% if filter_name == "Topics" %} @@ -100,7 +100,7 @@ {# Filter checkboxes #} {% for filter_name, filter_data in filters.items %} -
+