Merge pull request #842 from amatsuda/checkbox_appearance

Force native checkbox appearance for SimpleForm boolean inputs against Bootstrap 5 style

Author: amatsuda

app/assets/stylesheets/modules/forms.css

@@ -68,6 +68,23 @@ input.boolean {
   margin: 4px;
 }
 
+/* Force native checkbox appearance for SimpleForm boolean inputs */
+/* Bootstrap 5 hides checkboxes with appearance:none, position:absolute, etc. */
+input[type="checkbox"].boolean {
+  -webkit-appearance: checkbox !important;
+  -moz-appearance: checkbox !important;
+  appearance: checkbox !important;
+  position: static !important;
+  width: auto !important;
+  height: auto !important;
+  margin-right: 0.5em !important;
+  margin-top: 0 !important;
+  opacity: 1 !important;
+  pointer-events: auto !important;
+  clip: auto !important;
+  vertical-align: middle;
+}
+
 .inline-form {
   display: flex;
   gap: 10px;