Various styling improvements

netbox/project-static/styles/extensions.scss

@@ -0,0 +1,45 @@
+// Bootstrap utility extensions.
+// See https://getbootstrap.com/docs/5.0/utilities/api/
+
+// Add responsive max-width classes for more granular controls over max-width.
+$max-width-extension: (
+  'max-width': (
+    property: max-width,
+    class: mw,
+    responsive: true,
+    values: (
+      20: 20%,
+      25: 25%,
+      33: 33%,
+      50: 50%,
+      66: 66%,
+      75: 75%,
+      80: 80%,
+      90: 90%,
+      100: 100%,
+    ),
+  ),
+);
+
+// Add more opacity classes.
+$opacity-extension: (
+  'opacity': (
+    property: opacity,
+    class: opacity,
+    values: (
+      0: 0,
+      10: 0.1,
+      20: 0.2,
+      25: 0.25,
+      33: 0.33,
+      50: 0.5,
+      66: 0.66,
+      75: 0.75,
+      80: 0.8,
+      90: 0.9,
+      100: 1,
+    ),
+  ),
+);
+
+$utilities: map-merge($utilities, $max-width-extension, $opacity-extension);