FIX: better alignment of badge selector and edit btn (#6651)

FIX: better alignment of badge selector and edit btn (#6651)

Input located at /admin/badges/new

From 284394431597f68463fe9688cf0b93c8fd604034 Mon Sep 17 00:00:00 2001
From: Joffrey JAFFEUX <j.jaffeux@gmail.com>
Date: Thu, 22 Nov 2018 16:21:15 +0100
Subject: [PATCH] FIX: better alignment of badge selector and edit btn (#6651)

Input located at /admin/badges/new

diff --git a/app/assets/javascripts/admin/templates/badges-show.hbs b/app/assets/javascripts/admin/templates/badges-show.hbs
index f8995fd..044bc36 100644
--- a/app/assets/javascripts/admin/templates/badges-show.hbs
+++ b/app/assets/javascripts/admin/templates/badges-show.hbs
@@ -32,11 +32,15 @@
 
     <div>
       <label for="badge_grouping_id">{{i18n 'admin.badges.badge_grouping'}}</label>
-      {{combo-box name="badge_grouping_id"
-                  value=buffered.badge_grouping_id
-                  content=badgeGroupings
-                  nameProperty="name"}}
-      &nbsp;<button {{action "editGroupings"}} class='btn btn-icon btn-default'>{{d-icon 'pencil'}}</button>
+
+      <div class="badge-grouping-control">
+        {{combo-box name="badge_grouping_id"
+          value=buffered.badge_grouping_id
+          content=badgeGroupings
+          class="badge-selector"
+          nameProperty="name"}}
+        <button {{action "editGroupings"}} class='btn btn-icon no-text btn-default'>{{d-icon 'pencil'}}</button>
+      </div>
     </div>
 
 
diff --git a/app/assets/stylesheets/common/admin/badges.scss b/app/assets/stylesheets/common/admin/badges.scss
index ebb6fec..505c5ed 100644
--- a/app/assets/stylesheets/common/admin/badges.scss
+++ b/app/assets/stylesheets/common/admin/badges.scss
@@ -21,6 +21,15 @@
       color: dark-light-choose($primary-medium, $secondary-medium);
       font-size: $font-down-1;
     }
+
+    .badge-grouping-control {
+      display: flex;
+      align-items: center;
+
+      .badge-selector {
+        margin-right: 5px;
+      }
+    }
   }
   .form-horizontal {
     .ace-wrapper {

GitHub

2 Likes