Correct positioning of comment buttons with DateField, TimeField and DateTimeField. Fix #12214 (#12685)

Co-authored-by: Thibaud Colas <thibaudcolas@gmail.com>

CHANGELOG.txt

@@ -45,6 +45,7 @@ Changelog
  * Fix: Allow page models to extend base `Page` panel definitions without importing `wagtail.admin` (Matt Westcott)
  * Fix: Fix crash when loading the dashboard with only the "unlock" or "bulk delete" page permissions (Unyime Emmanuel Udoh, Sage Abdullah)
  * Fix: Improve deprecation warning for `WidgetWithScript` by raising it with `stacklevel=3` (Joren Hammudoglu)
+ * Fix: Correctly place comment buttons next to date / datetime / time fields. (Srishti Jaiswal)
  * Docs: Move the model reference page from reference/pages to the references section as it covers all Wagtail core models (Srishti Jaiswal)
  * Docs: Move the panels reference page from references/pages to the references section as panels are available for any model editing, merge panels API into this page (Srishti Jaiswal)
  * Docs: Move the tags documentation to standalone advanced topic, instead of being inside the reference/pages section (Srishti Jaiswal)

client/scss/components/forms/_field-comment-control.scss

@@ -53,14 +53,6 @@ $button-padding: theme('spacing.2');
     transform: translateY(0);
     top: 0;
   }
-
-  .w-field--date_field &,
-  .w-field--date_time_field &,
-  .w-field--time_field & {
-    position: relative;
-    transform: translateY(0);
-    top: 0;
-  }
 }
 
 .w-field__comment-button--add {

client/scss/components/forms/_input-text.scss

@@ -39,10 +39,13 @@ textarea {
   resize: none;
 }
 
-// Make non-text field types with custom widgets have a smaller width.
 .w-field--date_field,
 .w-field--date_time_field,
 .w-field--time_field {
+  // Make sure comment buttons are as close as possible.
+  display: inline-block;
+
+  // Make non-text field types with custom widgets have a smaller width.
   input {
     width: auto;
     max-width: 100%;

docs/releases/6.4.md

@@ -57,6 +57,7 @@ depth: 1
  * Allow page models to extend base `Page` panel definitions without importing `wagtail.admin` (Matt Westcott)
  * Fix crash when loading the dashboard with only the "unlock" or "bulk delete" page permissions (Unyime Emmanuel Udoh, Sage Abdullah)
  * Improve deprecation warning for `WidgetWithScript` by raising it with `stacklevel=3` (Joren Hammudoglu)
+ * Correctly place comment buttons next to date / datetime / time fields. (Srishti Jaiswal)
 
 ### Documentation