From fafee4071e19ddb88394bf72b39c03f5128f73e8 Mon Sep 17 00:00:00 2001
From: sunny <sunny@loafle.com>
Date: Tue, 17 Apr 2018 20:43:37 +0900
Subject: [PATCH] design

---
 .../pages/targets/targets-page.component.html |  4 +-
 .../component/setting/setting.component.html  | 91 ++++++++++---------
 .../infra/component/map/map.component.html    | 10 +-
 .../noauth/component/list/list.component.html | 18 ++--
 .../component/detail/detail.component.html    | 23 ++---
 .../probe/component/list/list.component.html  | 10 +-
 .../crawler-auth/crawler-auth.component.html  |  4 +-
 .../crawler-selector.component.html           |  6 +-
 .../sensor-item-selector.component.html       |  4 +-
 .../setting-etc/setting-etc.component.html    |  2 +-
 .../component/setting/setting.component.html  | 19 ++--
 .../target-selector.component.html            |  5 +-
 src/styles.scss                               | 61 ++++++++++++-
 13 files changed, 159 insertions(+), 98 deletions(-)

diff --git a/src/app/pages/targets/targets-page.component.html b/src/app/pages/targets/targets-page.component.html
index 76f9a6a..fedb503 100644
--- a/src/app/pages/targets/targets-page.component.html
+++ b/src/app/pages/targets/targets-page.component.html
@@ -1,9 +1,7 @@
 <div class="ui-fluid">
     <div class="ui-g">
         <div class="ui-g-12">
-            <div class="card no-margin">
-                <of-target-list></of-target-list>
-            </div>
+            <of-target-list></of-target-list>
         </div>
     </div>
 </div>
\ No newline at end of file
diff --git a/src/packages/discovery/component/setting/setting.component.html b/src/packages/discovery/component/setting/setting.component.html
index 7b0d07f..655aa69 100644
--- a/src/packages/discovery/component/setting/setting.component.html
+++ b/src/packages/discovery/component/setting/setting.component.html
@@ -22,74 +22,79 @@
           <span class="ui-float-label">
             <input id="float-input" type="text" size="30" pInputText [(ngModel)]="startIP"> 
             <label for="float-input">Start Ip</label>
-        </span>
-  
+          </span>
         </div>
         <div class="ui-g-12 ui-md-4">
           <span class="ui-float-label">
             <input id="float-input" type="text" size="30" pInputText [(ngModel)]="endIP"> 
             <label for="float-input">End Ip</label>
-        </span>
+          </span>
         </div>
-      
-    </div>
+      </div>
 
      
       <div class="ui-g" style="width:250px;margin-bottom:10px">
-          <div class="ui-g-12">
-            <p-checkbox name="group1" value="port" label="Port" [(ngModel)]="portChecked" inputId="la" (onChange)="handlePortCheckChange($event)"></p-checkbox>
-          </div>
-          TCP &nbsp;
-          <p-inputSwitch [(ngModel)]="tcpChecked"></p-inputSwitch>
-          UDP &nbsp;
-          <p-inputSwitch [(ngModel)]="udpChecked"></p-inputSwitch>
-
+        <div class="ui-g-12">
+          <p-checkbox name="group1" value="port" label="Port" [(ngModel)]="portChecked" inputId="la" (onChange)="handlePortCheckChange($event)"></p-checkbox>
         </div>
-
-        <div class="ui-g form-group">
-          <div class="ui-g-12 ui-md-4">
-              <span class="ui-float-label">
-                  <input id="float-input" type="text" size="30" pInputText  [(ngModel)]="startPort"> 
-                  <label for="float-input">Start Port</label>
-              </span>
+        <div class="ui-g-12">
+          <div class="ui-g-4">
+            TCP &nbsp;
+            <p-inputSwitch [(ngModel)]="tcpChecked"></p-inputSwitch>
           </div>
-
-          <div class="ui-g-12 ui-md-4">
-              <span class="ui-float-label">
-                  <input id="float-input" type="text" size="30" pInputText [(ngModel)]="endPort"> 
-                  <label for="float-input">End Port</label>
-              </span>
+          <div class="ui-g-4">
+            UDP &nbsp;
+            <p-inputSwitch [(ngModel)]="udpChecked"></p-inputSwitch>
           </div>
         </div>
-  
-        <!-- <p-listbox [options]="cities" [(ngModel)]="selectedCities" multiple="multiple" checkbox="checkbox" filter="filter" optionLabel="name">
-            <p-header>
-              <i class="fa fa-car"></i>
-              Cars
-            </p-header>
-          </p-listbox> -->
-          <div>
-              <div class="ui-g-12">
-                  <p-checkbox name="group1" value="service" label="Service" [(ngModel)]="serviceChecked" inputId="la" (onChange)="handleServiceCheckChange($event)"></p-checkbox>
-                </div>
+      </div>
 
-          
+      <div class="ui-g form-group">
+        <div class="ui-g-12 ui-md-4">
+            <span class="ui-float-label">
+                <input id="float-input" type="text" size="30" pInputText  [(ngModel)]="startPort"> 
+                <label for="float-input">Start Port</label>
+            </span>
+        </div>
+
+        <div class="ui-g-12 ui-md-4">
+            <span class="ui-float-label">
+                <input id="float-input" type="text" size="30" pInputText [(ngModel)]="endPort"> 
+                <label for="float-input">End Port</label>
+            </span>
+        </div>
+      </div>
+
+      <!-- <p-listbox [options]="cities" [(ngModel)]="selectedCities" multiple="multiple" checkbox="checkbox" filter="filter" optionLabel="name">
+        <p-header>
+          <i class="fa fa-car"></i>
+          Cars
+        </p-header>
+      </p-listbox> -->
+      <div class="ui-g-12">
+        <div class="ui-g-12">
+          <p-checkbox name="group1" value="service" label="Service" [(ngModel)]="serviceChecked" inputId="la" (onChange)="handleServiceCheckChange($event)"></p-checkbox>
+        </div>
+
+        <div class="ui-g-12">
           <p-pickList [source]="serviceItems" [target]="includeServices" sourceHeader="Available" targetHeader="Selected" [responsive]="true"
             filterBy="brand" dragdrop="true" dragdropScope="services" sourceFilterPlaceholder="Search by brand" targetFilterPlaceholder="Search by brand"
-            [sourceStyle]="{'height':'300px'}" [targetStyle]="{'height':'300px'}">
+            [sourceStyle]="{'height':'300px'}" [targetStyle]="{'height':'300px'}" class="ui-picklist-buttons-unvisible">
             <ng-template let-service pTemplate="item">
               <div class="ui-helper-clearfix">
-                <div style="font-size:14px;float:right;margin:15px 5px 0 0">{{service.name}}</div>
+                <div style="font-size:14px;float:right;margin:0;padding: 0;">{{service.name}}</div>
               </div>
             </ng-template>
           </p-pickList>
-
         </div>
+      </div>
 
     </div>
     <p-footer>
-        <button pButton type="button" label="Cancel" icon="fa-close" class="ui-button-secondary" (click)="closeDialog()"></button>
-        <button pButton type="button" label="Start" icon="fa-check" (click)="discovery()"></button>
+      <div dir="rtl">
+        <button pButton type="button" label="Cancel" icon="fa-close" class="ui-button-secondary ui-button-width-fit" (click)="closeDialog()"></button>
+        <button pButton type="button" label="Start" icon="fa-check" class="ui-button-width-fit" (click)="discovery()"></button>
+      </div>
     </p-footer>
   </p-card>
 
diff --git a/src/packages/infra/component/map/map.component.html b/src/packages/infra/component/map/map.component.html
index d049e93..23e60de 100644
--- a/src/packages/infra/component/map/map.component.html
+++ b/src/packages/infra/component/map/map.component.html
@@ -5,12 +5,12 @@
   </p-dialog>
   <div class="ui-g-12 ui-g-nopad">
     <div class="ui-g">
-      <div class="ui-g-6 ui-g-nopad" style="padding-bottom:10px;">
-        <button pButton type="button" class="ui-button-large" icon="ui-icon-play-arrow" label="Discovery" style="width:auto" (click)="showDialog()"></button>
+      <div class="ui-g-6 ui-g-nopad ui-bottom-space-10">
+        <button pButton type="button" class="ui-button-large ui-button-width-fit" icon="ui-icon-play-arrow" label="Discovery" (click)="showDialog()"></button>
       </div>
-      <div class="ui-g-6 ui-g-nopad ui-rtl" dir="rtl">
-        <button pButton type="button" class="ui-button-secondary" label="Expand all" style="width:auto; margin-top: 16px;" (click)="expandAll()"></button>
-        <button pButton type="button" class="ui-button-secondary" label="Collapse all" style="width:auto;" (click)="collapseAll()"></button>
+      <div class="ui-g-6 ui-g-nopad" dir="rtl">
+        <button pButton type="button" class="ui-button-secondary ui-button-width-fit" label="Expand all" style="margin-top: 16px;" (click)="expandAll()"></button>
+        <button pButton type="button" class="ui-button-secondary ui-button-width-fit" label="Collapse all" style="margin-top: 16px;" (click)="collapseAll()"></button>
       </div>
     </div>
   </div>
diff --git a/src/packages/noauth/component/list/list.component.html b/src/packages/noauth/component/list/list.component.html
index b7085fe..71c6271 100644
--- a/src/packages/noauth/component/list/list.component.html
+++ b/src/packages/noauth/component/list/list.component.html
@@ -3,9 +3,9 @@
     <ng-template pTemplate="header" let-columns>
         <tr>
             <th style="width: 3.25em" pResizableColumn></th>
-            <th>Probe Key</th>
+            <th style="width: 20em">Probe Key</th>
             <th>Description</th>
-            <th>Created at</th>
+            <th style="width: 7em">Created at</th>
         </tr>
     </ng-template>
     <ng-template pTemplate="body" let-probe>
@@ -14,19 +14,15 @@
                 <p-tableRadioButton [value]="probe"></p-tableRadioButton>
             </td>
             <td>{{probe.tempProbeKey}}</td>
-            <td>{{probe.description}}</td>
+            <td style="overflow: auto;">{{probe.description}}</td>
             <td>{{probe.createDate | date: 'dd/MM/yyyy'}}</td>
         </tr>
     </ng-template>
-    <ng-template pTemplate="footer" let-columns>
-        <tr>
-            <td colspan="4">
-                <button [disabled]="!selected" type="button" label="Accept" icon="fa-check" pButton (click)="onAcceptOrDeny(true)"></button>
-                <button [disabled]="!selected" class="ui-button-danger" type="button" label="Deny" icon="ui-icon-close" pButton (click)="onAcceptOrDeny(false)"></button>
-            </td>
-        </tr>
-    </ng-template>
 </p-table>
+<div class="ui-top-space-10" dir="rtl">
+    <button [disabled]="!selected" class="ui-button-danger ui-button-width-fit" type="button" label="Deny" icon="ui-icon-close" pButton (click)="onAcceptOrDeny(false)"></button>
+    <button [disabled]="!selected" class=" ui-button-width-fit" type="button" label="Accept" icon="fa-check" pButton (click)="onAcceptOrDeny(true)"></button>
+</div>
 
 <p-confirmDialog header="Confirmation" icon="fa ui-icon-warning" width="425"></p-confirmDialog>
 <p-growl [(value)]="msgs"></p-growl>
\ No newline at end of file
diff --git a/src/packages/probe/component/detail/detail.component.html b/src/packages/probe/component/detail/detail.component.html
index 19d081c..76281c0 100644
--- a/src/packages/probe/component/detail/detail.component.html
+++ b/src/packages/probe/component/detail/detail.component.html
@@ -1,44 +1,45 @@
+<h1>Info</h1>
 <div *ngIf="probe">
   <div class="ui-g form-group">
-    <div class="ui-g-12 ui-md-4">
+    <div class="ui-g-12 ui-md-6 ui-lg-4">
       <span class="md-inputfield">
         <input type="text" pInputText readonly value="{{probe.displayName}}">
         <label>Alias</label>
       </span>
     </div>
-    <div class="ui-g-12 ui-md-4">
+    <div class="ui-g-12 ui-md-6 ui-lg-4">
       <span class="md-inputfield">
         <input type="text" pInputText readonly value="{{probe.cidr}}">
         <label>CIDR</label>
       </span>
     </div>
-    <div class="ui-g-12 ui-md-4">
+    <div class="ui-g-12 ui-md-6 ui-lg-4">
       <span class="md-inputfield">
         <input type="text" pInputText readonly value="{{probe.description}}">
         <label>Description</label>
       </span>
     </div>
-    <div class="ui-g-12 ui-md-4">
+    <div class="ui-g-12 ui-md-6 ui-lg-4">
       <span class="md-inputfield">
         <input type="text" pInputText readonly value="{{probe.probeKey}}">
         <label>Key</label>
       </span>
     </div>
-    <div class="ui-g-12 ui-md-4">
+    <div class="ui-g-12 ui-md-6 ui-lg-4">
       <span class="md-inputfield">
         <input type="text" pInputText readonly value="{{probe.authorizeDate | date: 'dd/MM/yyyy'}}">
         <label>Authrozied at</label>
       </span>
     </div>
-    <div class="ui-g-12 ui-md-4">
+    <div class="ui-g-12 ui-md-6 ui-lg-4">
       <span class="md-inputfield">
         <input type="text" pInputText readonly value="{{probe.authorizeMember.name}}">
         <label>Authrozied by</label>
       </span>
     </div>
   </div>
-  <div>
-    <button type="button" label="Discovery" icon="ui-icon-search" pButton (click)="onDiscoveryClick()"></button>
-    <button class="ui-button-danger" type="button" label="Remove this Probe" icon="ui-icon-close" pButton (click)="onRemoveClick()"></button>
-    <p-confirmDialog header="Confirmation" icon="fa ui-icon-warning" width="425"></p-confirmDialog>
-  </div>
\ No newline at end of file
+  <div class="ui-bottom-space-10" dir="rtl">
+    <button class="ui-button-danger ui-button-width-fit" type="button" label="Remove this Probe" icon="ui-icon-close" pButton (click)="onRemoveClick()"></button>
+    <button class="ui-button-width-fit" type="button" label="Discovery" icon="ui-icon-search" pButton (click)="onDiscoveryClick()"></button>
+  </div>
+  <p-confirmDialog header="Confirmation" icon="fa ui-icon-warning" width="425"></p-confirmDialog>
\ No newline at end of file
diff --git a/src/packages/probe/component/list/list.component.html b/src/packages/probe/component/list/list.component.html
index 0b95228..6f4d00e 100644
--- a/src/packages/probe/component/list/list.component.html
+++ b/src/packages/probe/component/list/list.component.html
@@ -3,12 +3,12 @@
   <ng-template pTemplate="header">
     <tr>
       <th>Probe Name</th>
-      <th>IP</th>
-      <th>OS</th>
-      <th>CIDR</th>
+      <th style="width:10em">IP</th>
+      <th style="width:8em">OS</th>
+      <th style="width:10em">CIDR</th>
       <th pResizableColumn>Targets</th>
-      <th>Authroized at</th>
-      <th>Authroized by</th>
+      <th style="width:8em">Authroized at</th>
+      <th style="width:9em">Authroized by</th>
     </tr>
   </ng-template>
   <ng-template pTemplate="body" let-probe>
diff --git a/src/packages/sensor/component/setting/crawler-auth/crawler-auth.component.html b/src/packages/sensor/component/setting/crawler-auth/crawler-auth.component.html
index 854d68a..70aa8cf 100644
--- a/src/packages/sensor/component/setting/crawler-auth/crawler-auth.component.html
+++ b/src/packages/sensor/component/setting/crawler-auth/crawler-auth.component.html
@@ -1,5 +1,5 @@
-<p-panel>
-  <div *ngIf="crawler; else info" class="ui-g" style="height: 180px; overflow: auto">
+<p-panel [showHeader]="false">
+  <div *ngIf="crawler; else info" class="ui-g ui-width-100-" style="height: 180px; overflow: auto">
     <div class="ui-g-12" *ngFor="let item of inputItems">
       <span class="md-inputfield">
         <input id="name" type="text" pInputText />
diff --git a/src/packages/sensor/component/setting/crawler-selector/crawler-selector.component.html b/src/packages/sensor/component/setting/crawler-selector/crawler-selector.component.html
index c7f0d87..35889ca 100644
--- a/src/packages/sensor/component/setting/crawler-selector/crawler-selector.component.html
+++ b/src/packages/sensor/component/setting/crawler-selector/crawler-selector.component.html
@@ -1,16 +1,16 @@
-<div *ngIf="target; else info">
+<div *ngIf="target; else info" class="ui-width-100-">
   <p-orderList [value]="crawlers" [listStyle]="{'height':'200px'}" [responsive]="true"  filterBy="name"
     (onSelectionChange)="onSelectionChange($event)">
     <ng-template let-crawler pTemplate="item">
       <div class="ui-helper-clearfix">
-        <div style="font-size:14px;float:right;margin:15px 5px 0 0">{{crawler.name}}</div>
+        <div style="font-size:14px;float:right;margin:0">{{crawler.name}}</div>
       </div>
     </ng-template>
   </p-orderList>
 </div>
 
 <ng-template #info>
-  <p-panel>
+  <p-panel [showHeader]="false">
     <div>개발자의 배려가 돋보이는 친절한 안내 메시지</div>
   </p-panel>
 </ng-template>
\ No newline at end of file
diff --git a/src/packages/sensor/component/setting/sensor-item-selector/sensor-item-selector.component.html b/src/packages/sensor/component/setting/sensor-item-selector/sensor-item-selector.component.html
index af13706..595851d 100644
--- a/src/packages/sensor/component/setting/sensor-item-selector/sensor-item-selector.component.html
+++ b/src/packages/sensor/component/setting/sensor-item-selector/sensor-item-selector.component.html
@@ -1,5 +1,5 @@
-<p-panel>
-  <div *ngIf="crawler && target; else info" class="ui-g" style="height: 200px; overflow: auto">
+<p-panel [showHeader]="false">
+  <div *ngIf="crawler && target; else info" class="ui-g ui-width-100- ui-no-border" style="height: 200px; overflow: auto">
     <p-tree [value]="itemTreeNode" selectionMode="checkbox" [(selection)]="selectedItems" (onNodeSelect)="onNodeSelect($event)"
       (onNodeUnselect)="onNodeUnselect($event)"></p-tree>
   </div>
diff --git a/src/packages/sensor/component/setting/setting-etc/setting-etc.component.html b/src/packages/sensor/component/setting/setting-etc/setting-etc.component.html
index d1af6c6..68799a4 100644
--- a/src/packages/sensor/component/setting/setting-etc/setting-etc.component.html
+++ b/src/packages/sensor/component/setting/setting-etc/setting-etc.component.html
@@ -1,3 +1,3 @@
-<div>
+<div style="height: 70%;">
   page 2222222
 </div>
\ No newline at end of file
diff --git a/src/packages/sensor/component/setting/setting.component.html b/src/packages/sensor/component/setting/setting.component.html
index c6b527a..51eaecd 100644
--- a/src/packages/sensor/component/setting/setting.component.html
+++ b/src/packages/sensor/component/setting/setting.component.html
@@ -1,15 +1,16 @@
+<h1>Add Sensor</h1>
 <div *ngIf="page === 1; else etc">
   <p-accordion [multiple]="false" [activeIndex]="step" (onOpen)="onTabOpen($event)">
-    <p-accordionTab header="{{getTitle(0)}}" [disabled]="preTarget">
+    <p-accordionTab header="{{getTitle(0)}}" [disabled]="preTarget" class="ui-nopad">
       <of-target-selector [visible]="visible" [preTarget]="preTarget" (targetSelected)="onTargetSelect($event)"></of-target-selector>
     </p-accordionTab>
-    <p-accordionTab header="{{getTitle(1)}}">
+    <p-accordionTab header="{{getTitle(1)}}" class="ui-nopad">
       <of-crawler-selector [target]="selectedTarget" (crawlerSelected)="onCrawlerSelect($event)"></of-crawler-selector>
     </p-accordionTab>
-    <p-accordionTab header="{{getTitle(2)}}">
+    <p-accordionTab header="{{getTitle(2)}}" class="ui-nopad">
       <of-crawler-auth [crawler]="selectedCrawler" (credentialPassed)="onCredentialPass($event)"></of-crawler-auth>
     </p-accordionTab>
-    <p-accordionTab header="{{getTitle(3)}}">
+    <p-accordionTab header="{{getTitle(3)}}" class="ui-nopad">
       <of-sensor-item-selector [target]="selectedTarget" [crawler]="selectedCrawler" (sensorItemsSelected)="onItemsSelect($event)"></of-sensor-item-selector>
     </p-accordionTab>
   </p-accordion>
@@ -19,12 +20,12 @@
   <of-sensor-setting-etc></of-sensor-setting-etc>
 </ng-template>
 
-<div>
-  <button pButton *ngIf="page === 1" class="ui-button-danger" type="button" label="Cancel" icon="ui-icon-close" (click)="onCancel()"></button>
-  <button pButton *ngIf="page === 2" class="ui-button-danger" type="button" label="Prev" icon="ui-icon-close" (click)="onPrev()"></button>
+<div class="ui-top-space-10" dir="rtl">
+  <button pButton *ngIf="page === 1" class=" ui-button-width-fit" [disabled]="!nextable" type="button" label="Next" icon="fa-check" (click)="onNext()"></button>
+  <button pButton *ngIf="page === 2" class=" ui-button-width-fit" type="button" label="Done" icon="fa-check" (click)="onDone()"></button>
 
-  <button pButton *ngIf="page === 1" [disabled]="!nextable" type="button" label="Next" icon="fa-check" (click)="onNext()"></button>
-  <button pButton *ngIf="page === 2" type="button" label="Done" icon="fa-check" (click)="onDone()"></button>
+  <button pButton *ngIf="page === 1" class="ui-button-danger ui-button-width-fit" type="button" label="Cancel" icon="ui-icon-close" (click)="onCancel()"></button>
+  <button pButton *ngIf="page === 2" class="ui-button-danger ui-button-width-fit" type="button" label="Prev" icon="ui-icon-close" (click)="onPrev()"></button>
 </div>
 
 
diff --git a/src/packages/sensor/component/setting/target-selector/target-selector.component.html b/src/packages/sensor/component/setting/target-selector/target-selector.component.html
index 8db91c7..203f457 100644
--- a/src/packages/sensor/component/setting/target-selector/target-selector.component.html
+++ b/src/packages/sensor/component/setting/target-selector/target-selector.component.html
@@ -1,5 +1,6 @@
-<div *ngIf="preTarget === null">
-  <p-orderList [value]="targets" [listStyle]="{'height':'200px'}" [responsive]="true" filterBy="displayName" (onSelectionChange)="onSelectionChange($event)">
+<div *ngIf="preTarget === null" class="ui-width-100-">
+  <p-orderList [value]="targets" [listStyle]="{'height':'200px'}" [responsive]="true" filterBy="displayName" 
+  (onSelectionChange)="onSelectionChange($event)">
     <ng-template let-target pTemplate="item">
       <div class="ui-helper-clearfix">
         <img src="assets/demo/images/car/BMW.gif" style="display:inline-block;margin:2px 0 2px 2px" />
diff --git a/src/styles.scss b/src/styles.scss
index 2482314..95f4f7a 100644
--- a/src/styles.scss
+++ b/src/styles.scss
@@ -19,8 +19,14 @@
     }
 }
 
+.ui-button-secondary{
+    background-color : #f5f6f8 !important;
+    .ui-button-icon-left{
+        color: #5e6166 !important;
+    }
+}
 .ui-button-secondary:hover{
-    color : white !important;
+    color : #5e6166 !important;
 }
 
 .ui-button-large {
@@ -30,4 +36,57 @@
 .ui-orderlist-controls {
     display: none !important;
     visibility: hidden;
+}
+
+.ui-picklist-buttons-unvisible{
+    .ng-star-inserted.ui-picklist-buttons{
+        visibility:hidden !important; 
+    }
+}
+
+.ui-bottom-space-10{
+    margin-bottom: 10px;
+}
+
+.ui-top-space-10{
+    margin-top: 10px;
+}
+
+.ui-float-right{
+    float:right;
+}
+.ui-button-width-fit{
+    width: auto !important;
+}
+.ui-nopad{
+    padding: 0px !important;
+    .ui-accordion-content{
+        padding: 0px !important;
+        border: 0px !important;
+    }
+}
+.ui-width-100-{
+    .ui-orderlist-list-container{
+        width : 100% !important;
+    }
+}
+.ui-no-border{
+    border: 0px !important;
+    .ui-tree{
+        border : 0px !important;
+    }
+}
+
+.ui-s-button{
+    .ui-button-text {
+        padding: 2px !important;
+        .ui-button-text-icon-left {
+            padding: 2px 12px 2px 4px !important;
+        }
+        .ui-button-text-icon-right {
+            padding: 2px 4px 2px 12px !important;
+        }
+    }
+    font-size: 0.8em !important;
+
 }
\ No newline at end of file