Merge pull request #372 from wazuh/3.7-bad-align-overview

3.7 bad align overview
wazuh · Nov 27, 2018 · 4b497b5 · 4b497b5
2 parents 9555679 + 8d122d8
commit 4b497b5
Show file tree

Hide file tree

Showing 2 changed files with 193 additions and 209 deletions.
diff --git a/SplunkAppForWazuh/appserver/static/js/controllers/agents/overview/overview.html b/SplunkAppForWazuh/appserver/static/js/controllers/agents/overview/overview.html
@@ -1,5 +1,5 @@
 <div flex layout="column" layout-align="start stretch">
-  
+
   <!-- Breadcrumbs -->
   <div layout="row" layout-padding ng-if="agent">
     <!-- If you're not on the Welcome tab, show a functional breadcrumb -->
@@ -15,176 +15,163 @@
     </div>
   </div>
   <!-- End breadcrumbs -->
-  
+
   <!-- Headline -->
   <div layout="column" layout-padding>
     <span class="font-size-18">
       <i class="fa fa-fw fa-tv" aria-hidden="true"></i> Agent overview</span>
-    </div>
-    <!-- End headline -->
-
-    <!-- Agent information section -->
-    <div layout="row" class="wz-padding-top-0 wz-padding-bottom-0">
-      <md-card flex class="wz-metric-color wz-md-card wz-no-padding">
-        <md-card-content layout="row" class="wz-padding-metric">
-          <div class="wz-text-truncatable" flex>
-            Name:
-            <span class="wz-text-bold">{{ agent.name }}
-              <md-tooltip ng-if="agent.name.length" md-direction="bottom" class="wz-tooltip">
-                Full name: {{ agent.name }}
-              </md-tooltip>
-            </span>
-          </div>
-          <div class="wz-text-truncatable" flex>
-            IP:
-            <span class="wz-text-bold">{{ agent.ip }}</span>
-          </div>
-          <!--  <div class="wz-text-truncatable" flex ng-if="agent.group">
+  </div>
+  <!-- End headline -->
+
+  <!-- Agent information section -->
+  <div layout="row" class="wz-padding-top-0 wz-padding-bottom-0">
+    <md-card flex class="wz-metric-color wz-md-card wz-no-padding">
+      <md-card-content layout="row" class="wz-padding-metric">
+        <div class="wz-text-truncatable" flex>
+          Name:
+          <span class="wz-text-bold">{{ agent.name }}</span>
+          <md-tooltip ng-if="agent.name.length" md-direction="bottom" class="wz-tooltip">
+            Full name: {{ agent.name }}
+          </md-tooltip>
+        </div>
+        <div class="wz-text-truncatable" flex>
+          IP:
+          <span class="wz-text-bold">{{ agent.ip }}</span>
+        </div>
+        <!--  <div class="wz-text-truncatable" flex ng-if="agent.group">
             Group:
             <span class="wz-text-bold" ng-click="goGroups(agent.group)">{{ agent.group }}</span>
           </div> -->
-          <div class="wz-text-truncatable" flex ng-if="agent.version">
-            Version:
-            <span class="wz-text-bold">{{ agent.version }}</span>
-          </div>
-          <div class="wz-text-truncatable" flex>
-            OS:
-            <span class="wz-text-bold">{{ agentOS }}
-              <md-tooltip ng-if="agentOS.length" md-direction="bottom" class="wz-tooltip">
-                Full OS name: {{ agentOS }}
-              </md-tooltip>
-            </span>
-          </div>
-        </md-card-content>
-      </md-card>
-    </div>
-    <div layout="row" class="wz-padding-top-0 wz-padding-bottom-0" ng-if="agent.group">
-      <md-card flex class="wz-metric-color wz-md-card">
-        <md-card-content layout="row" class="wz-padding-metric">
-          <div class="wz-word-break" flex ng-if="agent.group">
-            Groups: <span ng-repeat="group in agent.group" class="wz-text-bold wz-text-link" ng-click="goGroups(group)">{{ group }}&nbsp;
-              <md-tooltip ng-if="agentOS.length" md-direction="bottom" class="wz-tooltip">
-                Click to open this group
-              </md-tooltip>
-            </span>
-          </div>
-        </md-card-content>
-      </md-card>
-    </div>
-    <div layout="row" class="wz-padding-top-0 wz-padding-bottom-0">
-      <md-card flex class="wz-metric-color wz-md-card wz-no-padding">
-        <md-card-content layout="row" class="wz-padding-metric">
-          <div class="wz-text-truncatable" flex>Last keep alive:
-            <span class="wz-text-bold"> {{agent.lastKeepAlive || 'Unknown' }}</span>
-          </div>
-          <div class="wz-text-truncatable" flex>Registration date:
-            <span class="wz-text-bold"> {{agent.dateAdd}}</span>
-          </div>
-          <div class="wz-text-truncatable" flex ng-if="syscheck.inProgress">Last syscheck scan:
-            <span class="wz-text-bold"> Scan in progress</span>
-          </div>
-          <div class="wz-text-truncatable" flex ng-if="!syscheck.inProgress">Last syscheck scan:
-            <span class="wz-text-bold"> {{syscheck.end || 'Unknown'}}
-              <md-tooltip ng-if="!syscheck.inProgress && syscheck.start && syscheck.end" md-direction="bottom"
-              class="wz-tooltip">
-
-              Start time: {{ syscheck.start || 'Unknown'}}
-              <br> End time: {{ syscheck.end || 'Unknown'}}
-              <br> Duration time: {{ syscheck.duration +' minutes' || 'Unknown'}}
-            </md-tooltip>
-          </span>
+        <div class="wz-text-truncatable" flex ng-if="agent.version">
+          Version:
+          <span class="wz-text-bold">{{ agent.version }}</span>
+        </div>
+        <div class="wz-text-truncatable" flex>
+          OS:
+          <span class="wz-text-bold">{{ agentOS }}</span>
+          <md-tooltip ng-if="agentOS.length" md-direction="bottom" class="wz-tooltip">
+            Full OS name: {{ agentOS }}
+          </md-tooltip>
+        </div>
+      </md-card-content>
+    </md-card>
+  </div>
+  <div layout="row" class="wz-padding-top-0 wz-padding-bottom-0" ng-if="agent.group">
+    <md-card flex class="wz-metric-color wz-md-card">
+      <md-card-content layout="row" class="wz-padding-metric">
+        <div class="wz-word-break" flex ng-if="agent.group">
+          Groups: <span ng-repeat="group in agent.group" class="wz-text-bold wz-text-link" ng-click="goGroups(group)">{{
+            group }}&nbsp;</span>
+        </div>
+      </md-card-content>
+    </md-card>
+  </div>
+  <div layout="row" class="wz-padding-top-0 wz-padding-bottom-0">
+    <md-card flex class="wz-metric-color wz-md-card wz-no-padding">
+      <md-card-content layout="row" class="wz-padding-metric">
+        <div class="wz-text-truncatable" flex>Last keep alive:
+          <span class="wz-text-bold"> {{agent.lastKeepAlive || 'Unknown' }}</span>
+        </div>
+        <div class="wz-text-truncatable" flex>Registration date:
+          <span class="wz-text-bold"> {{agent.dateAdd}}</span>
+        </div>
+        <div class="wz-text-truncatable" flex ng-if="syscheck.inProgress">Last syscheck scan:
+          <span class="wz-text-bold"> Scan in progress</span>
+        </div>
+        <div class="wz-text-truncatable" flex ng-if="!syscheck.inProgress">Last syscheck scan:
+          <span class="wz-text-bold"> {{syscheck.end || 'Unknown'}}</span>
+          <md-tooltip ng-if="!syscheck.inProgress && syscheck.start && syscheck.end" md-direction="bottom" class="wz-tooltip">
+            Start time: {{ syscheck.start || 'Unknown'}}
+            <br> End time: {{ syscheck.end || 'Unknown'}}
+            <br> Duration time: {{ syscheck.duration +' minutes' || 'Unknown'}}
+          </md-tooltip>
         </div>
         <div class="wz-text-truncatable" flex ng-if="rootcheck.inProgress">Last rootcheck scan:
           <span class="wz-text-bold"> Scan in progress</span>
         </div>
         <div class="wz-text-truncatable" flex ng-if="!rootcheck.inProgress">Last rootcheck scan:
           <span class="wz-text-bold"> {{rootcheck.end || 'Unknown'}}</span>
-          <md-tooltip ng-if="!rootcheck.inProgress && rootcheck.start && rootcheck.end" md-direction="bottom"
-          class="wz-tooltip">
-          Start time: {{ rootcheck.start || 'Unknown'}}
-          <br> End time: {{ rootcheck.end || 'Unknown'}}
-          <br> Duration time: {{ rootcheck.duration +' minutes' || 'Unknown'}}
-        </md-tooltip>
-      </span>
-    </div>
-  </md-card-content>
-</md-card>
-</div>
-<!-- End agent information section -->
+          <md-tooltip ng-if="!rootcheck.inProgress && rootcheck.start && rootcheck.end" md-direction="bottom" class="wz-tooltip">
+            Start time: {{ rootcheck.start || 'Unknown'}}
+            <br> End time: {{ rootcheck.end || 'Unknown'}}
+            <br> Duration time: {{ rootcheck.duration +' minutes' || 'Unknown'}}
+          </md-tooltip>
+        </div>
+      </md-card-content>
+    </md-card>
+  </div>
+  <!-- End agent information section -->
 
 
-<div layout="row" layout-padding>
-  <div class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--responsive">
-    <div class="euiFlexItem">
-      <div class="euiPanel euiPanel--paddingLarge">
-        <h3 class="euiTitle">Security Information Management</h3>
-        <div class="euiSpacer euiSpacer--m"></div>
-        <div class="euiFlexGrid euiFlexGrid--gutterLarge euiFlexGrid--halves">
-          <wz-welcome-card class="euiFlexItem" logo="'/static/app/SplunkAppForWazuh/css/images/app_dashboard.svg'" title="'Security events'"
-          ui-sref='ag-general({id:agent.id})' current-tab="'general'" description="'Browse through your security alerts, identifying issues and threats in your environment.'"></wz-welcome-card>
-          <wz-welcome-card class="euiFlexItem" logo="'/static/app/SplunkAppForWazuh/css/images/app_logging.svg'" title="'Integrity monitoring'"
-          ui-sref='ag-fim({id:agent.id})' current-tab="'fim'" description="'Alerts related to file changes, including permissions, content, ownership and attributes.'"></wz-welcome-card>
-          <wz-welcome-card class="euiFlexItem" logo="'/static/app/SplunkAppForWazuh/css/images/app_devtools.svg'" title="'Configuration'"
-          ui-sref='ag-conf({id:agent.id})' current-tab="'configuration'" description="'Check the current agent configuration remotely applied by its group.'"></wz-welcome-card>
-          <wz-welcome-card ui-sref='ag-inventory({id:agent.id})' class="euiFlexItem" logo="'/static/app/SplunkAppForWazuh/css/images/app_index_pattern.svg'"
-          title="'Inventory data'" switch-tab="switchTab('syscollector')" current-tab="'syscollector'" description="'Applications, network configuration, open ports and processes running on your monitored systems.'"></wz-welcome-card>
+  <div layout="row" layout-padding>
+    <div class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--responsive">
+      <div class="euiFlexItem flex-50">
+        <div class="euiPanel euiPanel--paddingLarge">
+          <h3 class="euiTitle">Security Information Management</h3>
+          <div class="euiSpacer euiSpacer--m"></div>
+          <div class="euiFlexGrid euiFlexGrid--gutterLarge euiFlexGrid--halves">
+            <wz-welcome-card class="euiFlexItem" logo="'/static/app/SplunkAppForWazuh/css/images/app_dashboard.svg'"
+              title="'Security events'" ui-sref='ag-general({id:agent.id})' current-tab="'general'" description="'Browse through your security alerts, identifying issues and threats in your environment.'"></wz-welcome-card>
+            <wz-welcome-card class="euiFlexItem" logo="'/static/app/SplunkAppForWazuh/css/images/app_logging.svg'"
+              title="'Integrity monitoring'" ui-sref='ag-fim({id:agent.id})' current-tab="'fim'" description="'Alerts related to file changes, including permissions, content, ownership and attributes.'"></wz-welcome-card>
+            <wz-welcome-card class="euiFlexItem" logo="'/static/app/SplunkAppForWazuh/css/images/app_devtools.svg'"
+              title="'Configuration'" ui-sref='ag-conf({id:agent.id})' current-tab="'configuration'" description="'Check the current agent configuration remotely applied by its group.'"></wz-welcome-card>
+            <wz-welcome-card ui-sref='ag-inventory({id:agent.id})' class="euiFlexItem" logo="'/static/app/SplunkAppForWazuh/css/images/app_index_pattern.svg'"
+              title="'Inventory data'" switch-tab="switchTab('syscollector')" current-tab="'syscollector'" description="'Applications, network configuration, open ports and processes running on your monitored systems.'"></wz-welcome-card>
+          </div>
         </div>
       </div>
-    </div>
-    <div class="euiFlexItem">
-      <div class="euiPanel euiPanel--paddingLarge">
-        <h3 class="euiTitle">Auditing and Policy Monitoring</h3>
-        <div class="euiSpacer euiSpacer--m"></div>
-        <div class="euiFlexGrid euiFlexGrid--gutterLarge euiFlexGrid--halves">
-          <wz-welcome-card class="euiFlexItem" logo="'/static/app/SplunkAppForWazuh/css/images/app_advanced_settings.svg'" title="'Policy monitoring'"
-          ui-sref='ag-pm({id:aoc.agent.id})' current-tab="'pm'" description="'Configuration to ensure compliance with security policies, standards and hardening guides'"></wz-welcome-card>
-          <wz-welcome-card  class="euiFlexItem" logo="'/static/app/SplunkAppForWazuh/css/images/app_monitoring.svg'"
-          title="'System auditing'" ui-sref='ag-audit({id:agent.id})' ng-if="audit" current-tab="'audit'" description="'Audit users behavior, monitoring command execution and alerting on access to critical files.'"></wz-welcome-card>
-          <wz-welcome-card ng-if="oscap" class="euiFlexItem" logo="'/static/app/SplunkAppForWazuh/css/images/app_discover.svg'"
-          title="'Open SCAP'" ui-sref='ag-os({id:agent.id})' current-tab="'oscap'" description="'Configuration assessment and automation of compliance monitoring using SCAP checks.'"></wz-welcome-card>
-          <wz-welcome-card ng-if='ciscat' ui-sref='ag-ciscat({id:agent.id})' class="euiFlexItem" logo="'/static/app/SplunkAppForWazuh/css/images/app_advanced_settings.svg'"
-          title="'CIS-CAT'" switch-tab="switchTab('ciscat')" current-tab="'ciscat'" description="'Configuration assessment using Center of Internet Security scanner and SCAP checks.'"></wz-welcome-card>
+      <div class="euiFlexItem flex-50">
+        <div class="euiPanel euiPanel--paddingLarge">
+          <h3 class="euiTitle">Auditing and Policy Monitoring</h3>
+          <div class="euiSpacer euiSpacer--m"></div>
+          <div class="euiFlexGrid euiFlexGrid--gutterLarge euiFlexGrid--halves">
+            <wz-welcome-card class="euiFlexItem" logo="'/static/app/SplunkAppForWazuh/css/images/app_advanced_settings.svg'"
+              title="'Policy monitoring'" ui-sref='ag-pm({id:aoc.agent.id})' current-tab="'pm'" description="'Configuration to ensure compliance with security policies, standards and hardening guides'"></wz-welcome-card>
+            <wz-welcome-card class="euiFlexItem" logo="'/static/app/SplunkAppForWazuh/css/images/app_monitoring.svg'"
+              title="'System auditing'" ui-sref='ag-audit({id:agent.id})' ng-if="audit" current-tab="'audit'"
+              description="'Audit users behavior, monitoring command execution and alerting on access to critical files.'"></wz-welcome-card>
+            <wz-welcome-card ng-if="oscap" class="euiFlexItem" logo="'/static/app/SplunkAppForWazuh/css/images/app_discover.svg'"
+              title="'Open SCAP'" ui-sref='ag-os({id:agent.id})' current-tab="'oscap'" description="'Configuration assessment and automation of compliance monitoring using SCAP checks.'"></wz-welcome-card>
+            <wz-welcome-card ng-if='ciscat' ui-sref='ag-ciscat({id:agent.id})' class="euiFlexItem" logo="'/static/app/SplunkAppForWazuh/css/images/app_advanced_settings.svg'"
+              title="'CIS-CAT'" switch-tab="switchTab('ciscat')" current-tab="'ciscat'" description="'Configuration assessment using Center of Internet Security scanner and SCAP checks.'"></wz-welcome-card>
+          </div>
         </div>
       </div>
     </div>
   </div>
-</div>
 
-<div layout="row" layout-padding>
-  <div class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--responsive">
-    <div class="euiFlexItem">
-      <div class="euiFlexItem">
+  <div layout="row" layout-padding>
+    <div class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--responsive">
+      <div class="euiFlexItem flex-50">
         <div class="euiPanel euiPanel--paddingLarge">
           <h3 class="euiTitle">Threat Detection and Response</h3>
           <div class="euiSpacer euiSpacer--m"></div>
           <div class="euiFlexGrid euiFlexGrid--gutterLarge euiFlexGrid--halves">
-            <wz-welcome-card class="euiFlexItem" logo="'/static/app/SplunkAppForWazuh/css/images/app_security.svg'" title="'Vulnerabilities'"
-            ui-sref='ag-vul({id:agent.id})' current-tab="'vuls'" description="'Discover what applications are affected by well-known vulnerabilities'"></wz-welcome-card>
-            
-            <wz-welcome-card ng-if="osquery" class="euiFlexItem" logo="'/static/app/SplunkAppForWazuh/css/images/osquery.png'" title="'Osquery'" ui-sref='ag-osquery' current-tab="'osquery'"
-            description="'Osquery allows to expose an operating system as a high-performance relational database.'"></wz-welcome-card>
-            
-            <wz-welcome-card ng-if="virustotal" class="euiFlexItem" logo="'/static/app/SplunkAppForWazuh/css/images/app_saved_objects.svg'" title="'VirusTotal'" ui-sref='ag-virustotal' current-tab="'virustotal'"
-            description="'Alerts resulting from VirusTotal analysis of suspicious files via an integration with their API.'"></wz-welcome-card>
+            <wz-welcome-card class="euiFlexItem" logo="'/static/app/SplunkAppForWazuh/css/images/app_security.svg'"
+              title="'Vulnerabilities'" ui-sref='ag-vul({id:agent.id})' current-tab="'vuls'" description="'Discover what applications are affected by well-known vulnerabilities'"></wz-welcome-card>
+
+            <wz-welcome-card ng-if="osquery" class="euiFlexItem" logo="'/static/app/SplunkAppForWazuh/css/images/osquery.png'"
+              title="'Osquery'" ui-sref='ag-osquery' current-tab="'osquery'" description="'Osquery allows to expose an operating system as a high-performance relational database.'"></wz-welcome-card>
+
+            <wz-welcome-card ng-if="virustotal" class="euiFlexItem" logo="'/static/app/SplunkAppForWazuh/css/images/app_saved_objects.svg'"
+              title="'VirusTotal'" ui-sref='ag-virustotal' current-tab="'virustotal'" description="'Alerts resulting from VirusTotal analysis of suspicious files via an integration with their API.'"></wz-welcome-card>
           </div>
         </div>
       </div>
-    </div>
-    <div ng-if="gdpr || pci" class="euiFlexItem">
-      <div class="euiFlexItem">
+      <div ng-if="gdpr || pci" class="euiFlexItem flex-50">
         <div class="euiPanel euiPanel--paddingLarge">
           <h3 class="euiTitle">Regulatory Compliance</h3>
           <div class="euiSpacer euiSpacer--m"></div>
           <div class="euiFlexGrid euiFlexGrid--gutterLarge euiFlexGrid--halves">
             <wz-welcome-card ng-if="pci" class="euiFlexItem" logo="'/static/app/SplunkAppForWazuh/css/images/app_apm.svg'"
-            title="'PCI DSS'" ui-sref='ag-pci({id:agent.id})' current-tab="'pci'" description="'Global security standard for entities that process, store or transmit payment cardholder data.'"></wz-welcome-card>
+              title="'PCI DSS'" ui-sref='ag-pci({id:agent.id})' current-tab="'pci'" description="'Global security standard for entities that process, store or transmit payment cardholder data.'"></wz-welcome-card>
             <wz-welcome-card ng-if="gdpr" class="euiFlexItem" logo="'/static/app/SplunkAppForWazuh/css/images/app_visualize.svg'"
-            title="'GDPR'" ui-sref='ag-gdpr({id:agent.id})' current-tab="'gdpr'" description="'General Data Protection Regulation (GDPR) sets guidelines for processing of personal data.'"></wz-welcome-card>
+              title="'GDPR'" ui-sref='ag-gdpr({id:agent.id})' current-tab="'gdpr'" description="'General Data Protection Regulation (GDPR) sets guidelines for processing of personal data.'"></wz-welcome-card>
           </div>
         </div>
       </div>
     </div>
   </div>
-</div>
 
 </div>