style changes in the index

diff --git a/src/views/index.ejs b/src/views/index.ejs
index 335ded5964c54d53a04b733bc504b6711184191b..555073014d75204288d8df625f2609ecf5dd27d6 100644 (file)
--- a/src/views/index.ejs
+++ b/src/views/index.ejs
@@ -13,9 +13,11 @@
   </header>
 
   <div class="realtime">
-    <div class="navbar navbar-dark bg-light"><span>Memoria libre en el sistema</span></div>
-    <div class="wrapper">
+
+    <div class="wrapper RAM">
+      <div class="navbar navbar-dark bg-light"><span>Memoria libre en el sistema</span></div>
       <div id="ram"></div>
+      <!-- <script src="js/health/functions.js"></script> -->
       <script>
         Plotly.plot('ram', [{
           y: [0],
@@ -58,10 +60,11 @@
           xhr.send();
         }, 2000)
       </script>
-
     </div>
-    <div class="navbar navbar-dark bg-light"><span>CPU libre en el sistema</span></div>
+
     <div class="wrapper CPU">
+      <div class="navbar navbar-dark bg-light"><span>CPU libre en el sistema</span></div>
+
       <!-- <div></div> -->
       <div id="cpu"></div>
       <!-- <div></div> -->
@@ -98,8 +101,9 @@
         }, 2000)
       </script>
     </div>
-    <div class="navbar navbar-dark bg-light"><span>Trafico de la Red</span></div>
-    <div class="wrapper">
+
+    <div class="wrapper TRAFFIC">
+      <div class="navbar navbar-dark bg-light"><span>Trafico de la Red</span></div>
       <div id="trafico"></div>
       <script>
         Plotly.plot('trafico', [{
@@ -155,12 +159,9 @@
           xhr.send();
         }, 500)
       </script>
-
     </div>
   </div>
-  <div class="viewframe">
-    <iframe class="iframea" id="ImportFrame" src="http://localhost:8080"></iframe>
-  </div>
+
 </body>
 <footer>
   <%include ../../partials/footer%>

diff --git a/styles/main.css b/styles/main.css
index d3e5ec4d656aff650c74d7b11ad0090dcbaab59a..0b3d0f0913e5892cc7983b95c661efbfed38dca2 100644 (file)
--- a/styles/main.css
+++ b/styles/main.css
@@ -86,27 +86,23 @@ flex-grow: 1;
   justify-content: space-around;
   align-items: stretch;
   align-content: stretch; */
-}
-
-.CPU {
-  display: flex;
-  align-items: stretch;
-  align-content: stretch;
-  justify-content: space-around;
-}
-.CPU div{\r
-  flex-shrink:1;\r
-}
-.iframea {
-  display: flex;
   width: 100%;
-  height: 40em;
-  overflow: auto;
-  border-radius: 20px;
+  display: flex;
+  flex-flow: row wrap\r
 }\r
-#ram, #cpu, #trafico{\r
-\r
+.RAM{\r
+  flex-basis: 60%\r
+}\r
+.CPU{\r
+  flex-basis: 30%;\r
+  flex-grow: 1;\r
+}\r
+.TRAFFIC{\r
+  flex-basis: 100%\r
 }\r
+\r
+\r
+\r
 .navbar{\r
   width: auto;\r
 }\r