Просмотр исходного кода

16416 enable dark/light toggle in mobile view (#16635)

* 16416 enable dark/light toggle in mobile view

* 16416 move to inc file
Arthur Hanson 1 год назад
Родитель
Сommit
cd9244fd4f
2 измененных файлов с 12 добавлено и 8 удалено
  1. 2 8
      netbox/templates/base/layout.html
  2. 10 0
      netbox/templates/inc/light_toggle.html

+ 2 - 8
netbox/templates/base/layout.html

@@ -35,6 +35,7 @@ Blocks:
 
         {# User menu (mobile view) #}
         <div class="navbar-nav flex-row d-lg-none">
+          {% include 'inc/light_toggle.html' %}
           {% include 'inc/user_menu.html' %}
         </div>
 
@@ -52,14 +53,7 @@ Blocks:
 
         <div class="navbar-nav flex-row align-items-center order-md-last">
           {# Dark/light mode toggle #}
-          <div class="d-none d-md-flex">
-            <button class="btn color-mode-toggle hide-theme-dark" title="{% trans "Enable dark mode" %}" data-bs-toggle="tooltip" data-bs-placement="bottom">
-              <i class="mdi mdi-lightbulb"></i>
-            </button>
-            <button class="btn color-mode-toggle hide-theme-light" title="{% trans "Enable light mode" %}" data-bs-toggle="tooltip" data-bs-placement="bottom">
-              <i class="mdi mdi-lightbulb-on"></i>
-            </button>
-          </div>
+          {% include 'inc/light_toggle.html' %}
 
           {# User menu #}
           {% include 'inc/user_menu.html' %}

+ 10 - 0
netbox/templates/inc/light_toggle.html

@@ -0,0 +1,10 @@
+{% load i18n %}
+
+<div class="d-flex">
+  <button class="btn color-mode-toggle hide-theme-dark" title="{% trans "Enable dark mode" %}" data-bs-toggle="tooltip" data-bs-placement="bottom">
+    <i class="mdi mdi-lightbulb"></i>
+  </button>
+  <button class="btn color-mode-toggle hide-theme-light" title="{% trans "Enable light mode" %}" data-bs-toggle="tooltip" data-bs-placement="bottom">
+    <i class="mdi mdi-lightbulb-on"></i>
+  </button>
+</div>