From 12a1b3dfb610d999d5e356d440566f54a0f756cc Mon Sep 17 00:00:00 2001
From: Skylar Ittner <admin@netsyms.com>
Date: Thu, 25 Jan 2018 20:33:52 -0700
Subject: [PATCH] Display six users per row in quick access on xl screens

---
 www/js/login.js      |  2 +-
 www/pages/login.html | 14 ++++++++++----
 2 files changed, 11 insertions(+), 5 deletions(-)

diff --git a/www/js/login.js b/www/js/login.js
index b86bcd2..55cba20 100644
--- a/www/js/login.js
+++ b/www/js/login.js
@@ -79,7 +79,7 @@ function loadQuickLogin() {
                 var userhtml = "";
                 for (var user in resp.users) {
                     var u = resp.users[user];
-                    userhtml += '<div class="col-4 col-lg-3 quick-user" data-uid="' + u["uid"] + '" data-username="' + u["username"] + '" data-name="' + u["name"] + '" data-pin="' + (u["pin"] == true ? "1" : "") + '" >\n'
+                    userhtml += '<div class="col-4 col-lg-3 col-xl-2 quick-user" data-uid="' + u["uid"] + '" data-username="' + u["username"] + '" data-name="' + u["name"] + '" data-pin="' + (u["pin"] == true ? "1" : "") + '" >\n'
                             + '<svg class="identicon" width="60" height="60" data-jdenticon-value="' + u["name"] + '"></svg>\n'
                             + '<br />\n'
                             + u["name"] + "\n"
diff --git a/www/pages/login.html b/www/pages/login.html
index 37fc127..3e92455 100644
--- a/www/pages/login.html
+++ b/www/pages/login.html
@@ -85,7 +85,7 @@
 </div>
 <div class="container" style="height: 100%;">
     <div class="row justify-content-center" style="height: 100%;">
-        <div class="col-12 col-sm-10 col-md-8 col-lg-6">
+        <div class="col-12 col-sm-10 col-md-8 col-lg-8 col-xl-8">
             <div class="card" style="width: 100%;">
                 <h3 class="card-header"><i class="fas fa-lock"></i> Login</h3>
                 <ul class="nav nav-tabs justify-content-center">
@@ -114,11 +114,15 @@
                                 <input style="display:none" type="text" name="fakeusernameremembered"/>
                                 <input style="display:none" type="password" name="fakepasswordremembered"/>
                                 <div class="input-group">
-                                    <span class="input-group-addon"><i class="far fa-user"></i></span>
+                                    <div class="input-group-prepend">
+                                        <span class="input-group-text"><i class="far fa-user"></i></span>
+                                    </div>
                                     <input type="text" class="form-control" id="username" placeholder="Username" />
                                 </div>
                                 <div class="input-group">
-                                    <span class="input-group-addon"><i class="fas fa-key"></i></span>
+                                    <div class="input-group-prepend">
+                                        <span class="input-group-text"><i class="fas fa-key"></i></span>
+                                    </div>
                                     <input type="text" style="-webkit-text-security: disc;" class="form-control" id="password" placeholder="Password" />
                                 </div>
                                 <br />
@@ -131,7 +135,9 @@
                             <div class="alert alert-info">Open the Business app on your phone, <br />then press the <i class="fas fa-desktop"></i> button to get a code.</div>
                             <form id="mobilecode_form">
                                 <div class="input-group input-group-lg">
-                                    <span class="input-group-addon">B-</span>
+                                    <div class="input-group-prepend">
+                                        <span class="input-group-text">B -</span>
+                                    </div>
                                     <input type="text" class="form-control" id="code" placeholder="123456" />
                                 </div>
                                 <br />