From 71e5b7ca2b2950465903fa7d73489a154017537e Mon Sep 17 00:00:00 2001
From: Adam Jones <jones_adam@rocketmail.com>
Date: Fri, 30 Oct 2020 14:15:31 +0000
Subject: [PATCH] Fix form validation tooltip alignment (#31557)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* Fix form validation tooltip alignment

* Remove CSS hacks

* Update _forms.scss

Co-authored-by: Gaël Poupard <ffoodd@users.noreply.github.com>
Co-authored-by: XhmikosR <xhmikosr@gmail.com>
---
 scss/mixins/_forms.scss | 7 +++++++
 1 file changed, 7 insertions(+)

diff --git a/scss/mixins/_forms.scss b/scss/mixins/_forms.scss
index 39b52f3cae23..6b65ad3f6f82 100644
--- a/scss/mixins/_forms.scss
+++ b/scss/mixins/_forms.scss
@@ -64,6 +64,13 @@
     color: color-yiq($color);
     background-color: rgba($color, $form-feedback-tooltip-opacity);
     @include border-radius($form-feedback-tooltip-border-radius);
+
+    // See https://github.com/twbs/bootstrap/pull/31557
+    // Align tooltip to form elements
+    .form-row > .col > &,
+    .form-row > [class*="col-"] > & {
+      left: $form-grid-gutter-width / 2;
+    }
   }
 
   @include form-validation-state-selector($state) {