update templates & rendering for bootstrap 5

netbox/dcim/elevations.py

@@ -64,7 +64,7 @@ class RackElevationSVG:
         drawing = svgwrite.Drawing(size=(width, height))
 
         # add the stylesheet
-        with open('{}/css/rack_elevation.css'.format(settings.STATICFILES_DIRS[0])) as css_file:
+        with open('{}/rack_elevation.css'.format(settings.STATIC_ROOT)) as css_file:
             drawing.defs.add(drawing.style(css_file.read()))
 
         # add gradients

netbox/utilities/forms/fields.py

@@ -214,7 +214,7 @@ class CommentField(forms.CharField):
     widget = forms.Textarea
     default_label = ''
     # TODO: Port Markdown cheat sheet to internal documentation
-    default_helptext = '<i class="mdi mdi-information-outline"></i> '\
+    default_helptext = '<i class="bi bi-info-circle"></i> '\
                        '<a href="https://github.com/adam-p/markdown-here/wiki/Markdown-Cheatsheet" target="_blank">'\
                        'Markdown</a> syntax is supported'
 
@@ -390,7 +390,8 @@ class JSONField(_JSONField):
     def __init__(self, *args, **kwargs):
         super().__init__(*args, **kwargs)
         if not self.help_text:
-            self.help_text = 'Enter context data in <a href="https://json.org/">JSON</a> format.'
+            
+            self.help_text = 'Enter context data in <a target="_blank" href="https://json.org/">JSON</a> format.'
             self.widget.attrs['placeholder'] = ''
 
     def prepare_value(self, value):

netbox/utilities/forms/forms.py

@@ -4,6 +4,8 @@ import re
 import yaml
 from django import forms
 
+from .widgets import APISelect, APISelectMultiple, StaticSelect2
+
 
 __all__ = (
     'BootstrapMixin',
@@ -28,18 +30,28 @@ class BootstrapMixin(forms.BaseForm):
             forms.CheckboxInput,
             forms.ClearableFileInput,
             forms.FileInput,
-            forms.RadioSelect
+            forms.RadioSelect,
+            APISelect,
+            APISelectMultiple,
+            StaticSelect2,
         ]
 
         for field_name, field in self.fields.items():
+
             if field.widget.__class__ not in exempt_widgets:
                 css = field.widget.attrs.get('class', '')
                 field.widget.attrs['class'] = ' '.join([css, 'form-control']).strip()
+
             if field.required and not isinstance(field.widget, forms.FileInput):
                 field.widget.attrs['required'] = 'required'
-            if 'placeholder' not in field.widget.attrs:
+
+            if 'placeholder' not in field.widget.attrs and field.label is not None:
                 field.widget.attrs['placeholder'] = field.label
 
+            if field.widget.__class__ == forms.CheckboxInput:
+                css = field.widget.attrs.get('class', '')
+                field.widget.attrs['class'] = ' '.join((css, 'form-check-input')).strip()
+
 
 class ReturnURLForm(forms.Form):
     """

netbox/utilities/templates/widgets/select_speed.html

@@ -1,20 +1 @@
-<div class="input-group">
+{% include 'django/forms/widgets/number.html' %}
-  {% include 'django/forms/widgets/number.html' %}
-  <span class="input-group-btn">
-      <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
-          <span class="caret"></span>
-      </button>
-      <ul class="dropdown-menu dropdown-menu-right">
-          <li><a href="#" target="{{ widget.name }}" data="10000" class="set_speed">10 Mbps</a></li>
-          <li><a href="#" target="{{ widget.name }}" data="100000" class="set_speed">100 Mbps</a></li>
-          <li><a href="#" target="{{ widget.name }}" data="1000000" class="set_speed">1 Gbps</a></li>
-          <li><a href="#" target="{{ widget.name }}" data="10000000" class="set_speed">10 Gbps</a></li>
-          <li><a href="#" target="{{ widget.name }}" data="25000000" class="set_speed">25 Gbps</a></li>
-          <li><a href="#" target="{{ widget.name }}" data="40000000" class="set_speed">40 Gbps</a></li>
-          <li><a href="#" target="{{ widget.name }}" data="100000000" class="set_speed">100 Gbps</a></li>
-          <li class="divider"></li>
-          <li><a href="#" target="{{ widget.name }}" data="1544" class="set_speed">T1 (1.544 Mbps)</a></li>
-          <li><a href="#" target="{{ widget.name }}" data="2048" class="set_speed">E1 (2.048 Mbps)</a></li>
-      </ul>
-  </span>
-</div>

netbox/utilities/templates/widgets/sluginput.html

@@ -1,8 +1 @@
-<div class="input-group">
+{% include "django/forms/widgets/input.html" %}
-    {% include "django/forms/widgets/input.html" %}
-    <span class="input-group-btn">
-        <button class="btn btn-default reslugify" type="button" title="Regenerate slug">
-            <i class="mdi mdi-refresh"></i>
-        </button>
-    </span>
-</div>