From c0302ed9e4bad981ff351baab69673add8f4fd56 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?alir=C4=B1za=20ad=C4=B1yah=C5=9Fi?=
 <alirizaadiyahsi@gmail.com>
Date: Wed, 11 Oct 2017 17:33:11 +0300
Subject: [PATCH] Better styling for the table (grid lines etc.)

---
 .../Areas/Identity/Views/Users/Index.cshtml   | 33 +++++++++++--------
 .../modules/identity/views/users/index.css    |  4 +++
 .../modules/identity/views/users/index.js     |  8 +++--
 .../modules/identity/views/users/index.less   |  4 +++
 .../identity/views/users/index.min.css        |  2 +-
 5 files changed, 33 insertions(+), 18 deletions(-)

diff --git a/src/Volo.Abp.Identity.Web/Areas/Identity/Views/Users/Index.cshtml b/src/Volo.Abp.Identity.Web/Areas/Identity/Views/Users/Index.cshtml
index 7e498ddaa8..051fb34a2a 100644
--- a/src/Volo.Abp.Identity.Web/Areas/Identity/Views/Users/Index.cshtml
+++ b/src/Volo.Abp.Identity.Web/Areas/Identity/Views/Users/Index.cshtml
@@ -9,19 +9,15 @@
     <script type="text/javascript" src="~/modules/identity/views/users/index.js"></script>
 }
 
-<h2>Users</h2>
-
-<!-- Button trigger modal -->
-<button type="button" class="btn btn-primary create-user" data-toggle="modal">
-    Create User
-</button>
-
-<!-- Modal -->
-<div class="modal fade" id="createUpdateUserModal" tabindex="-1" role="dialog" aria-labelledby="userModalLabel" aria-hidden="true">
-    <div class="modal-dialog" role="document">
-        <div class="modal-content">
-
-        </div>
+<div class="row">
+    <div class="col-md-6">
+        <h2>Users</h2>
+    </div>
+    <div class="col-md-6 text-right">
+        <!-- Button trigger modal -->
+        <button type="button" class="btn btn-primary create-user" data-toggle="modal">
+            Create User
+        </button>
     </div>
 </div>
 
@@ -34,4 +30,13 @@
         <th>Phone Number</th>
     </tr>
     </thead>
-</table>
\ No newline at end of file
+</table>
+
+<!-- Modal -->
+<div class="modal fade" id="createUpdateUserModal" tabindex="-1" role="dialog" aria-labelledby="userModalLabel" aria-hidden="true">
+    <div class="modal-dialog" role="document">
+        <div class="modal-content">
+
+        </div>
+    </div>
+</div>
\ No newline at end of file
diff --git a/src/Volo.Abp.Identity.Web/wwwroot/modules/identity/views/users/index.css b/src/Volo.Abp.Identity.Web/wwwroot/modules/identity/views/users/index.css
index ee22283b8e..4f53b593a8 100644
--- a/src/Volo.Abp.Identity.Web/wwwroot/modules/identity/views/users/index.css
+++ b/src/Volo.Abp.Identity.Web/wwwroot/modules/identity/views/users/index.css
@@ -1,4 +1,8 @@
 .dataTable {
   width: 100% !important;
   border-spacing: 0 !important;
+}
+.table td,
+.table th {
+  padding: 8px 10px;
 }
\ No newline at end of file
diff --git a/src/Volo.Abp.Identity.Web/wwwroot/modules/identity/views/users/index.js b/src/Volo.Abp.Identity.Web/wwwroot/modules/identity/views/users/index.js
index af5ff7fa31..3b0dcdb615 100644
--- a/src/Volo.Abp.Identity.Web/wwwroot/modules/identity/views/users/index.js
+++ b/src/Volo.Abp.Identity.Web/wwwroot/modules/identity/views/users/index.js
@@ -2,8 +2,11 @@
     var _identityUserAppService = volo.abp.identity.identityUser;
 
     var dataTable = $('#IdentityUsersTable').DataTable({
-        processing: true,
+        paging: true,
         serverSide: true,
+        processing: true,
+        responsive: true,
+        order: [[1, "asc"]],
         ajax: function (requestData, callback, settings) {
             var inputFilter = {};
 
@@ -38,7 +41,6 @@
                 });
             }
         },
-        responsive: true,
         columnDefs: [
             {
                 targets: 0,
@@ -48,7 +50,7 @@
                 defaultContent: '',
                 render: function (list, type, record, meta) {
                     return '<div class="dropdown">' +
-                        '<button class="btn btn-primary dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">' +
+                        '<button class="btn btn-primary btn-sm dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">' +
                         'Actions' +
                         '</button>' +
                         '<div class="dropdown-menu" aria-labelledby="dropdownMenuButton">' +
diff --git a/src/Volo.Abp.Identity.Web/wwwroot/modules/identity/views/users/index.less b/src/Volo.Abp.Identity.Web/wwwroot/modules/identity/views/users/index.less
index b566f7d35c..c49b79238d 100644
--- a/src/Volo.Abp.Identity.Web/wwwroot/modules/identity/views/users/index.less
+++ b/src/Volo.Abp.Identity.Web/wwwroot/modules/identity/views/users/index.less
@@ -2,3 +2,7 @@
     width: 100% !important;
     border-spacing: 0 !important;
 }
+
+.table td, .table th {
+    padding: 8px 10px;
+}
diff --git a/src/Volo.Abp.Identity.Web/wwwroot/modules/identity/views/users/index.min.css b/src/Volo.Abp.Identity.Web/wwwroot/modules/identity/views/users/index.min.css
index 557de2f607..283dedaa8a 100644
--- a/src/Volo.Abp.Identity.Web/wwwroot/modules/identity/views/users/index.min.css
+++ b/src/Volo.Abp.Identity.Web/wwwroot/modules/identity/views/users/index.min.css
@@ -1 +1 @@
-.dataTable{width:100% !important;border-spacing:0 !important;}
\ No newline at end of file
+.dataTable{width:100% !important;border-spacing:0 !important;}.table td,.table th{padding:8px 10px;}
\ No newline at end of file