+
diff --git a/ietf/static/js/password_strength.js b/ietf/static/js/password_strength.js
index eaeed2e1c4..4df5c14439 100644
--- a/ietf/static/js/password_strength.js
+++ b/ietf/static/js/password_strength.js
@@ -30,7 +30,7 @@
widget
.find(".label-danger")
- .addClass("bg-danger")
+ .addClass("text-bg-danger")
.removeClass("label-danger");
widget
@@ -64,13 +64,13 @@
.val());
if (result.score < 3) {
- password_strength_bar.removeClass('bg-success')
- .addClass('bg-warning');
+ password_strength_bar.removeClass('text-bg-success')
+ .addClass('text-bg-warning');
password_strength_info.find('.badge')
.removeClass('d-none');
} else {
- password_strength_bar.removeClass('bg-warning')
- .addClass('bg-success');
+ password_strength_bar.removeClass('text-bg-warning')
+ .addClass('text-bg-success');
password_strength_info.find('.badge')
.addClass('d-none');
}
@@ -86,8 +86,8 @@
.html(result.crack_times_display.offline_slow_hashing_1e4_per_second);
password_strength_offline_info.removeClass('d-none');
} else {
- password_strength_bar.removeClass('bg-success')
- .addClass('bg-warning');
+ password_strength_bar.removeClass('text-bg-success')
+ .addClass('text-bg-warning');
password_strength_bar.width('0%')
.attr('aria-valuenow', 0);
password_strength_info.addClass('d-none');
@@ -186,4 +186,4 @@
// Call the init for backwards compatibility
djangoPasswordStrength.init();
-})(jQuery, window, document);
\ No newline at end of file
+})(jQuery, window, document);
diff --git a/ietf/static/js/theme.js b/ietf/static/js/theme.js
new file mode 100644
index 0000000000..d244eec288
--- /dev/null
+++ b/ietf/static/js/theme.js
@@ -0,0 +1,88 @@
+/*!
+ * Color mode toggler for Bootstrap's docs (https://getbootstrap.com/)
+ * Copyright 2011-2023 The Bootstrap Authors
+ * Licensed under the Creative Commons Attribution 3.0 Unported License.
+ *
+ * https://github.com/twbs/bootstrap/blob/main/site/static/docs/5.3/assets/js/color-modes.js
+ */
+
+(() => {
+ 'use strict'
+
+ const getStoredTheme = () => localStorage.getItem('theme') || 'auto'
+ const setStoredTheme = theme => localStorage.setItem('theme', theme)
+
+ const getPreferredTheme = () => {
+ const storedTheme = getStoredTheme()
+ if (storedTheme) {
+ return storedTheme
+ }
+
+ return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light'
+ }
+
+ const setTheme = theme => {
+ if (theme === 'auto') {
+ if (window.matchMedia('(prefers-color-scheme: dark)').matches) {
+ document.documentElement.setAttribute('data-bs-theme', 'dark')
+ } else if (window.matchMedia('(prefers-color-scheme: light)').matches) {
+ document.documentElement.setAttribute('data-bs-theme', 'light')
+ }
+ } else {
+ document.documentElement.setAttribute('data-bs-theme', theme)
+ }
+ }
+
+ setTheme(getPreferredTheme())
+
+ const showActiveTheme = (theme, focus = false) => {
+ const themeSwitcher = document.querySelector('#bd-theme')
+
+ if (!themeSwitcher) {
+ return
+ }
+
+ // Commented-out lines are from the original bs5 js, which uses a more complicated pref dropdown.
+ // Kept them here for easier future diffing.
+ const themeSwitcherText = document.querySelector('#bd-theme-text')
+ // const activeThemeIcon = document.querySelector('.theme-icon-active use')
+ const btnToActive = document.querySelector(`[data-bs-theme-value="${theme}"]`)
+ // const svgOfActiveBtn = btnToActive.querySelector('svg use').getAttribute('href')
+
+ document.querySelectorAll('[data-bs-theme-value]').forEach(element => {
+ element.classList.remove('active')
+ element.setAttribute('aria-pressed', 'false')
+ })
+
+ btnToActive.classList.add('active')
+ btnToActive.setAttribute('aria-pressed', 'true')
+ // activeThemeIcon.setAttribute('href', svgOfActiveBtn)
+ // const themeSwitcherLabel = `${themeSwitcherText.textContent} (${btnToActive.dataset.bsThemeValue})`
+ // themeSwitcher.setAttribute('aria-label', themeSwitcherLabel)
+
+ if (focus) {
+ themeSwitcher.focus()
+ }
+ }
+
+ window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', () => {
+ const storedTheme = getStoredTheme()
+ if (storedTheme !== 'light' && storedTheme !== 'dark') {
+ setTheme(getPreferredTheme())
+ }
+ })
+
+ window.addEventListener('DOMContentLoaded', () => {
+ showActiveTheme(getPreferredTheme())
+
+ document.querySelectorAll('[data-bs-theme-value]')
+ .forEach(toggle => {
+ toggle.addEventListener('click', () => {
+ const theme = toggle.getAttribute('data-bs-theme-value')
+ setStoredTheme(theme)
+ setTheme(theme)
+ showActiveTheme(theme, true)
+ })
+ })
+ })
+})()
diff --git a/ietf/templates/401.html b/ietf/templates/401.html
index a88ce940e5..8c06dff9e1 100644
--- a/ietf/templates/401.html
+++ b/ietf/templates/401.html
@@ -3,9 +3,7 @@
{% load static %}
{% block title %}401 Unauthorized{% endblock %}
{% block content %}
- 
+ {% include "logo.html" with org="ietf" classes="col-2 mb-5" only %}
Authentication Required
diff --git a/ietf/templates/403.html b/ietf/templates/403.html index 155e4ea998..2ea87eb3ad 100644 --- a/ietf/templates/403.html +++ b/ietf/templates/403.html @@ -3,9 +3,7 @@ {% load static %} {% block title %}Error: Restricted Access{% endblock %} {% block content %} -
+ {% include "logo.html" with org="ietf" classes="col-2 mb-5" only %}
Restricted Access
diff --git a/ietf/templates/404.html b/ietf/templates/404.html index de247c89a1..b21bd5d97b 100644 --- a/ietf/templates/404.html +++ b/ietf/templates/404.html @@ -3,9 +3,7 @@ {% load static %} {% block title %}Error: Page Not Found{% endblock %} {% block content %} -
+ {% include "logo.html" with org="ietf" classes="col-2 mb-5" only %}
The page you were looking for couldn't be found
diff --git a/ietf/templates/500.html b/ietf/templates/500.html index b7ea01bdde..bd205dad6b 100644 --- a/ietf/templates/500.html +++ b/ietf/templates/500.html @@ -3,9 +3,7 @@ {% load static %} {% block title %}500 Internal Server Error{% endblock %} {% block content %} -
+ {% include "logo.html" with org="ietf" classes="col-2 mb-5" only %}
Internal Server Error
diff --git a/ietf/templates/base.html b/ietf/templates/base.html index 0d7ddc868f..9e07bad00d 100644 --- a/ietf/templates/base.html +++ b/ietf/templates/base.html @@ -6,7 +6,7 @@ {% origin %} {% load django_bootstrap5 %} {% load django_vite %} - + {% analytical_head_top %} @@ -19,6 +19,8 @@ + {# load this in the head, to prevent flickering #} + @@ -33,11 +35,10 @@ data-group-menu-data-url="{% url 'ietf.group.views.group_menu_data' %}"> {% analytical_body_top %} Skip to main content -