From 45e921601133da30c42417e2b926794066a45b31 Mon Sep 17 00:00:00 2001
From: Alex Paxton <thealexpaxton@gmail.com>
Date: Mon, 30 Oct 2017 19:52:54 -0700
Subject: [PATCH] Cleanup styles for Chronograf admin users table header

Signed-off-by: Jared Scheib <jared.scheib@gmail.com>
---
 ui/src/admin/containers/AdminChronografPage.js | 6 +++---
 ui/src/style/pages/admin.scss                  | 9 +++++++++
 2 files changed, 12 insertions(+), 3 deletions(-)

diff --git a/ui/src/admin/containers/AdminChronografPage.js b/ui/src/admin/containers/AdminChronografPage.js
index c8f0238b53..7df1534b0b 100644
--- a/ui/src/admin/containers/AdminChronografPage.js
+++ b/ui/src/admin/containers/AdminChronografPage.js
@@ -104,7 +104,7 @@ class AdminChronografPage extends Component {
                 <div className="row">
                   <div className="col-xs-12">
                     <div className="panel panel-minimal">
-                      <div className="panel-heading">
+                      <div className="panel-heading u-flex u-ai-center">
                         <Dropdown
                           items={organizations.map(org => ({
                             ...org,
@@ -113,9 +113,9 @@ class AdminChronografPage extends Component {
                           selected={organizationName}
                           onChoose={this.handleFilterUsers}
                         />
-                        <h2 className="panel-title">
+                        <p className="chronograf-admin-table--num-selected">
                           {numUsersSelected} User{numUsersSelected === 1 ? ' ' : 's '}Selected
-                        </h2>
+                        </p>
                       </div>
                       <div className="panel-body">
                         <AllUsersTable
diff --git a/ui/src/style/pages/admin.scss b/ui/src/style/pages/admin.scss
index 4275fcfc66..03a1d7bbac 100644
--- a/ui/src/style/pages/admin.scss
+++ b/ui/src/style/pages/admin.scss
@@ -236,3 +236,12 @@ table.table.chronograf-admin-table tbody tr.selected td {
   color: $g18-cloud;
   font-weight: 700;
 }
+
+.chronograf-admin-table--num-selected {
+  @include no-user-select();
+  margin-left: 8px;
+  display: inline-block;
+  font-size: 16px;
+  font-weight: 500;
+  color: $g13-mist;
+}