cleanup

addon/components/procezz-details.js

 import Component from '@ember/component';
 import layout from '../templates/components/procezz-details';
 import { inject as service } from "@ember/service";
+import { alias } from '@ember/object/computed';
 
 export default Component.extend({
   layout,
 
   store: service(),
 
+  classNames: ["scroll-container"],
+
+  toggleStateMonitoring: alias('procezz.monitoredFlag'),
+  toggleStateWebServer: alias('procezz.webserverFlag'),
+
   actions: {
 
     saveProcezz() {

addon/templates/components/node-overview.hbs

-{{#if agentRepo.agentList.length}}
+{{#if agentRepo.agentList}}
 	<div id="cy" class="container cytoscape-container"></div>
 {{else}}
 	<div class="jumbotron">

addon/templates/components/procezz-details.hbs

@@ -31,7 +31,7 @@
               <tr>
                 <td><b>Working Directory</b></td>
                 <td>
-                  <div class="well well-sm container-word-wrap">
+                  <div class="well well-sm container-word-wrap" style="margin-bottom: 0px;">
                     {{procezz.workingDirectory}}
                   </div>
                 </td>
@@ -39,13 +39,17 @@
               <tr>
                 <td><b>Monitoring Active</b></td>
                 <td>
-                  {{input type="checkbox" checked=procezz.monitoredFlag}}
+                  <div style="float: left;">                  
+                    {{x-toggle theme='skewed' onLabel='Yes' offLabel='No' value=toggleStateMonitoring onToggle=(action (mut toggleStateMonitoring))}}
+                  </div>
                 </td>
               </tr>
               <tr>
                 <td><b>Is web server?</b></td>
                 <td>
-                  {{input type="checkbox" checked=procezz.webserverFlag}}
+                  <div style="float: left;">                  
+                    {{x-toggle theme='skewed' onLabel='Yes' offLabel='No' value=toggleStateWebServer onToggle=(action (mut toggleStateWebServer))}}
+                  </div>
                 </td>
               </tr>
               <tr>
@@ -65,7 +69,7 @@
               <tr>
                 <td><b>Execution Command</b></td>
                 <td>
-                  <div class="well well-sm container-word-wrap">{{procezz.osExecutionCommand}}
+                  <div class="well well-sm container-word-wrap" style="margin-bottom: 0px;">{{procezz.osExecutionCommand}}
                   </div>
                 </td>
               </tr>

vendor/style.css

@@ -10,4 +10,10 @@
   height: 80%;
   width: 100%;
   position: absolute;
+}
+
+.scroll-container {
+  overflow-y: scroll;
+  overflow-x: hidden;
+  max-height: 100%;
 }
\ No newline at end of file