From e0cddf77a9a639acf0fe3e8fea90503ad423b37f Mon Sep 17 00:00:00 2001
From: Thibaud Colas <thibaudcolas@gmail.com>
Date: Wed, 14 Feb 2018 10:16:01 +0200
Subject: [PATCH] Refactor icon-help-inverse positioning

---
 .../wagtailadmin/scss/components/_icons.scss  | 21 +++++++++----------
 .../scss/components/_streamfield.scss         |  4 ++++
 .../scss/layouts/page-editor.scss             |  6 ++++++
 3 files changed, 20 insertions(+), 11 deletions(-)

diff --git a/wagtail/admin/static_src/wagtailadmin/scss/components/_icons.scss b/wagtail/admin/static_src/wagtailadmin/scss/components/_icons.scss
index 601869566..55c9e9a40 100644
--- a/wagtail/admin/static_src/wagtailadmin/scss/components/_icons.scss
+++ b/wagtail/admin/static_src/wagtailadmin/scss/components/_icons.scss
@@ -139,19 +139,18 @@
 // CSS-only circled question mark.
 // <span class="icon-help-inverse" aria-hidden="true"></span>
 .icon-help-inverse {
+    $size: 15px;
+
     &:before {
-        border-radius: 100%;
-        display: block;
-        float: left;
         content: '?';
-        border: 1px solid $color-grey-2;
-        color: $color-grey-2;
-        height: 15px;
-        width: 15px;
-        line-height: 15px;
-        text-align: center;
+        display: inline-block;
+        width: $size;
+        height: $size;
+        line-height: $size;
         font-size: 1.1em;
-        margin-left: -2em;
-        margin-top: 0.3em;
+        text-align: center;
+        border-radius: 100%;
+        color: $color-grey-2;
+        border: 1px solid currentColor;
     }
 }
diff --git a/wagtail/admin/static_src/wagtailadmin/scss/components/_streamfield.scss b/wagtail/admin/static_src/wagtailadmin/scss/components/_streamfield.scss
index 90be53b8f..39a1487ea 100644
--- a/wagtail/admin/static_src/wagtailadmin/scss/components/_streamfield.scss
+++ b/wagtail/admin/static_src/wagtailadmin/scss/components/_streamfield.scss
@@ -90,6 +90,10 @@ li.sequence-member {
     .sequence-member:hover & {
         opacity: 1;
     }
+
+    .icon-help-inverse {
+        margin-right: 0.5em;
+    }
 }
 
 // Image chooser as direct descendant of top-level streamfield has special display
diff --git a/wagtail/admin/static_src/wagtailadmin/scss/layouts/page-editor.scss b/wagtail/admin/static_src/wagtailadmin/scss/layouts/page-editor.scss
index da43c74d7..1fef2d443 100644
--- a/wagtail/admin/static_src/wagtailadmin/scss/layouts/page-editor.scss
+++ b/wagtail/admin/static_src/wagtailadmin/scss/layouts/page-editor.scss
@@ -76,6 +76,12 @@ $object-title-height: 40px;
         padding-right: $grid-gutter-width / 2;
         padding-left: 3em;
         opacity: 1;
+
+        .icon-help-inverse {
+            float: left;
+            margin-left: -2em;
+            margin-top: 0.3em;
+        }
     }
 
     &:hover .object-help {