truncate long message in webui monitor plugin

3 files changed, 10 insertions, 9 deletions

diff --git a/glances/outputs/static/css/style.css b/glances/outputs/static/css/style.css
index 648949f9..084a5dd0 100644
--- a/glances/outputs/static/css/style.css
+++ b/glances/outputs/static/css/style.css
@@ -102,12 +102,6 @@ body {
     padding: 0px 10px 0px 10px;
     white-space: nowrap;
 }
-gl-monitor-list {
-    display: block;
-}
-gl-monitor-list .table-cell {
-    text-align: left;
-}
 
 #quicklook .progress {
     margin-bottom: 0px;
@@ -129,6 +123,13 @@ gl-monitor-list .table-cell {
 #quicklook .progress-bar-critical {
     background-color: #A30000;
 }
+#monitor .process-result {
+    max-width: 300px;
+    overflow: hidden;
+    white-space: nowrap;
+    padding-left: 10px;
+    text-overflow: ellipsis;
+}
 
 /* Loading page */
 
diff --git a/glances/outputs/static/html/plugins/monitor.html b/glances/outputs/static/html/plugins/monitor.html
index 5ce2a43b..40909cee 100644
--- a/glances/outputs/static/html/plugins/monitor.html
+++ b/glances/outputs/static/html/plugins/monitor.html
@@ -1,8 +1,8 @@
 <div class="table">
     <div class="table-row" ng-repeat="process in statsMonitor.processes">
-        <div class="table-cell" ng-class="statsMonitor.getDesciptionDecoration(process)">{{ process.description }}</div>
+        <div class="table-cell" ng-class="statsMonitor.getDescriptionDecoration(process)">{{ process.description }}</div>
         <div class="table-cell">{{ process.count > 1 ? process.count : '' }}</div>
         <div class="table-cell">{{ process.count > 0 ? 'RUNNING' : 'NOT RUNNING' }}</div>
-        <div class="table-cell">{{ process.result }}</div>
+        <div class="table-cell process-result">{{ process.result }}</div>
     </div>
 </div>
diff --git a/glances/outputs/static/js/services/plugins/glances_monitor.js b/glances/outputs/static/js/services/plugins/glances_monitor.js
index 131f7bff..f0d8bc93 100644
--- a/glances/outputs/static/js/services/plugins/glances_monitor.js
+++ b/glances/outputs/static/js/services/plugins/glances_monitor.js
@@ -6,7 +6,7 @@ glancesApp.service('GlancesPluginMonitor', function() {
         this.processes = data[_pluginName];
     };
 
-    this.getDesciptionDecoration = function(process) {
+    this.getDescriptionDecoration = function(process) {
         var count = process.count;
         var countMin = process.countmin;
         var countMax = process.countmax;