From 5b9838dc605dfa6a3e7a7d417c8d751929a97ca2 Mon Sep 17 00:00:00 2001
From: Mario Mejia <mario128mex@gmail.com>
Date: Thu, 21 Jun 2018 22:45:02 -0500
Subject: [PATCH] web-ui: finder.component styles improved

some classes were added/removed to make the component
look right on every screen size
---
 .../components/finder/finder.component.html   | 38 +++++++++++++------
 1 file changed, 26 insertions(+), 12 deletions(-)

diff --git a/web-ui/src/app/components/finder/finder.component.html b/web-ui/src/app/components/finder/finder.component.html
index 4454392..6b38e64 100644
--- a/web-ui/src/app/components/finder/finder.component.html
+++ b/web-ui/src/app/components/finder/finder.component.html
@@ -1,17 +1,31 @@
-<form [formGroup]="form" (ngSubmit)="onSubmit()" novalidate role="form" class="form-horizontal">
+<form [formGroup]="form" (ngSubmit)="onSubmit()" novalidate role="form">
 
-  <div [ngClass]="{ 'has-success': errorService.hasCorrectValue(form, 'searchField'), 'has-error': errorService.hasWrongValue(form,
-  'searchField') }" class="form-group" >
+  <div
+    class="form-group"
+    [ngClass]="{
+      'has-success': errorService.hasCorrectValue(form, 'searchField'),
+      'has-error': errorService.hasWrongValue(form, 'searchField')
+    }"
+  >
+    <div class="row">
+      <div class="col-xs-9 col-md-offset-3 col-md-6">
+        <input
+          maxlength="64"
+          formControlName="searchField"
+          type="text"
+          id="searchField"
+          class="form-control"
+          placeholder="{{ 'label.searchField' | translate }}"
+        >
+      </div>
 
-    <div class="col-xs-10 col-sm-10 col-md-offset-3 col-md-6 col-lg-offset-3 col-lg-6">
-      <input maxlength="64" formControlName="searchField" type="text" id="searchField" class="form-control" placeholder="{{ 'label.searchField' | translate }}">
-    </div>
-    
-    <div class="text-left col-sm-offset-2">
-      <input type="submit" [disabled]="!form.valid" value="{{ 'action.find' | translate }}" class="btn btn-primary">
-    </div>
-    <div [hidden]="!errorService.hasWrongValue(form, 'searchField')" class="col-xs-10 col-sm-10 col-md-offset-3 col-md-6 col-lg-offset-3 col-lg-6">
-      <span class="help-block">{{ errorService.getFieldError(form, 'searchField') | translate }}</span>
+      <div class="col-xs-3">
+        <input type="submit" [disabled]="!form.valid" value="{{ 'action.find' | translate }}" class="btn btn-primary">
+      </div>
+
+      <div [hidden]="!errorService.hasWrongValue(form, 'searchField')" class="col-xs-9 col-md-offset-3 col-md-6">
+        <span class="help-block">{{ errorService.getFieldError(form, 'searchField') | translate }}</span>
+      </div>
     </div>
   </div>
 </form>