Ver Fonte

fix(forms): Improve Tom Select validation error styling

Replicate Bootstrap's invalid styling for Tom Select widgets with
explicit .is-invalid class, and apply NetBox's server-side error border
to widgets with aria-invalid='true'. This ensures consistent validation
feedback across both client and server-side validation states.

Fixes #22712
Martin Hauser há 1 semana atrás
pai
commit
80f6da084e

Diff do ficheiro suprimidas por serem muito extensas
+ 0 - 0
netbox/project-static/dist/netbox.css


+ 8 - 2
netbox/project-static/styles/overrides/_tomselect.scss

@@ -7,8 +7,14 @@
   }
 }
 
-// Replicate styling of tom-selected <select> fields tagged with .is-invalid to
-// their corresponding TomSelect dropdowns
+// Replicate Bootstrap's invalid styling for widgets which explicitly use
+// the .is-invalid class.
 select.tomselected.is-invalid + div.ts-wrapper {
   @extend .is-invalid;
 }
+
+// Replicate NetBox's standard server-side error border on Tom Select's
+// visible wrapper.
+select.tomselected[aria-invalid='true']:not(.is-invalid) + div.ts-wrapper {
+  border: 1px solid $red;
+}

Alguns ficheiros não foram mostrados porque muitos ficheiros mudaram neste diff