fix(patients): responsive search button

This commit makes the "SEARCH" text get hidden on smaller screens, allowing the registry to behave more responsively on smaller screens.
IMA-WorldHealth · Jul 31, 2017 · d8d9a20 · d8d9a20
1 parent eabc60d
commit d8d9a20
Show file tree

Hide file tree

Showing 5 changed files with 21 additions and 17 deletions.
diff --git a/client/src/less/bhima-bootstrap.less b/client/src/less/bhima-bootstrap.less
@@ -274,3 +274,9 @@ input[type=number] {-moz-appearance: textfield;}
   max-height:600px;
   padding:0px;
 }
+
+/* this is included at the top of the modal */
+.search-modal-header {
+  box-shadow : 0px 2px 4px -4px black;
+  z-index : 1000;
+}
diff --git a/client/src/modules/inventory/list/modals/search.modal.html b/client/src/modules/inventory/list/modals/search.modal.html
@@ -55,4 +55,4 @@
       FORM.BUTTONS.SUBMIT
     </button>
   </div>
-</form>
+</form>
diff --git a/client/src/modules/patients/registry/registry.html b/client/src/modules/patients/registry/registry.html
@@ -11,15 +11,15 @@
           <a class="btn btn-default" uib-dropdown-toggle>
             <span class="fa fa-bars"></span> <span class="hidden-xs" translate>FORM.LABELS.MENU</span> <span class="caret"></span>
           </a>
-          
+
           <ul uib-dropdown-menu role="menu" class="dropdown-menu-right">
             <li role="menuitem">
               <a href data-method="configure" ng-click="PatientRegistryCtrl.openColumnConfiguration()">
                 <i class="fa fa-columns"></i> <span translate>FORM.LABELS.COLUMNS</span>
               </a>
-            </li> 
+            </li>
 
-            <li role="separator" class="divider"></li>  
+            <li role="separator" class="divider"></li>
             <li role="menuitem">
               <a href data-method="save-state" ng-click="PatientRegistryCtrl.saveGridState()">
                 <i class="fa fa-save"></i> <span translate>FORM.BUTTONS.SAVE_GRID_CONFIGURATION</span>
@@ -44,18 +44,18 @@
                 <span class="fa fa-file-excel-o"></span> <span translate>DOWNLOADS.CSV</span>
               </a>
             </li>
-                               
+
           </ul>
 
         </div>
       </div>
-        
+
       <div class="toolbar-item">
         <button
           ng-click="PatientRegistryCtrl.search()"
           data-method="search"
           class="btn btn-default">
-          <span class="fa fa-search"></span> <span translate>FORM.BUTTONS.SEARCH</span>
+          <span class="fa fa-search"></span> <span class="hidden-xs" translate>FORM.BUTTONS.SEARCH</span>
         </button>
       </div>
     </div>
@@ -79,8 +79,7 @@
       ui-grid-auto-resize
       ui-grid-resize-columns
       ui-grid-move-columns
-      ui-grid-save-state
-      ui-grid-selection>
+      ui-grid-save-state>
 
       <bh-grid-loading-indicator
         loading-state="PatientRegistryCtrl.loading"

diff --git a/client/src/modules/patients/registry/registry.js b/client/src/modules/patients/registry/registry.js
@@ -117,7 +117,7 @@ function PatientRegistryController($state, Patients, Notify, AppCache,
   vm.clearGridState = function clearGridState() {
     state.clearGridState();
     $state.reload();
-  }  
+  }
 
   // error handler
   function handler(error) {
@@ -195,7 +195,7 @@ function PatientRegistryController($state, Patients, Notify, AppCache,
   function startup() {
 
     if ($state.params.filters) {
-      // Fix me, generate change dynamically 
+      // Fix me, generate change dynamically
       var change = [{ key : $state.params.filters.key, value : $state.params.filters.value }];
 
       Patients.filters.replaceFilters(change);

diff --git a/client/src/modules/patients/registry/search.modal.html b/client/src/modules/patients/registry/search.modal.html
@@ -4,7 +4,7 @@
   data-modal="patient-search"
   novalidate>
 
-  <div class="modal-header" style="box-shadow : 0px 2px 4px -4px black; z-index:1000">
+  <div class="modal-header search-modal-header">
     <ol class="headercrumb">
       <li class="static" translate>FORM.INFO.PATIENTS</li>
       <li class="title" translate>FORM.INFO.SEARCH</li>
@@ -13,7 +13,7 @@
 
   <div class="modal-body search-modal">
     <uib-tabset>
-      <uib-tab index="0" heading="{{ 'FORM.LABELS.SEARCH_QUERRIES' | translate}}" data-custom-filter-tab>
+      <uib-tab index="0" heading="{{ 'FORM.LABELS.SEARCH_QUERRIES' | translate }}" data-custom-filter-tab>
         <div class="tab-body">
           <div class="form-group" ng-class="{ 'has-error' : ModalForm.$submitted && ModalForm.name.$invalid }">
             <label class="control-label" translate> FORM.LABELS.NAME </label>
@@ -94,7 +94,7 @@
             name="user_id"
             on-select-callback="ModalCtrl.onSelectUser(user)">
             <bh-clear on-clear="ModalCtrl.clear('user_id')"></bh-clear>
-          </bh-user-select>        
+          </bh-user-select>
 
           <fieldset>
             <legend translate>FORM.LABELS.DOB</legend>
@@ -129,8 +129,7 @@
           </div>
         </div>
       </uib-tab>
-
-    </uib-tabset>  
+    </uib-tabset>
   </div>
 
   <div class="modal-footer">
@@ -141,4 +140,4 @@
       FORM.BUTTONS.SUBMIT
     </button>
   </div>
-</form>
+</form>