Further simplification of the layout code

This commit is contained in:
Johannes Zellner
2017-08-08 18:24:00 +02:00
parent 5a7e636f2d
commit 59936c6fbf
7 changed files with 107 additions and 170 deletions

View File

@@ -1,68 +1,52 @@
<div class="content">
<div class="text-left">
<h2>Memory</h2>
</div>
<div class="graphs">
<div class="card card-large text-center">
<div class="row">
<div class="col-md-10 col-md-offset-1">
<div class="row">
<div class="col-md-12 text-left">
<h2>Memory</h2>
</div>
</div>
<div class="row shadow memory-app-container">
<div class="row">
<div class="col-md-6">
<h3>Apps</h3>
<canvas id="memoryUsageAppsChart" width="200" height="200"></canvas>
</div>
<div class="col-md-6">
<h3>System</h3>
<canvas id="memoryUsageSystemChart" width="200" height="200"></canvas>
</div>
</div>
<br/>
<div class="row">
<div class="col-md-12">
<h4 ng-show="activeApp === 'system'">System</h4>
<h4 ng-show="activeApp !== 'system'">{{ activeApp.location }}</h4>
<br/>
<canvas id="memoryAppChart" width="900" height="300"></canvas>
<p>Memory consumption in MB.</p>
</div>
</div>
</div>
</div>
<div class="col-md-6">
<h3>Apps</h3>
<canvas id="memoryUsageAppsChart" width="200" height="200"></canvas>
</div>
<div class="col-md-6">
<h3>System</h3>
<canvas id="memoryUsageSystemChart" width="200" height="200"></canvas>
</div>
</div>
<br/>
<br/>
<div class="row">
<div class="col-md-10 col-md-offset-1">
<div class="row">
<div class="col-md-12 text-left">
<h2>Disk Usage</h2>
</div>
</div>
<div class="row shadow memory-app-container">
<div class="col-md-12">
<h4><span class="badge">{{ diskUsage['system'].sum }} GB</span></h4>
<canvas id="systemDiskUsageChart" width="200" height="200"></canvas>
<p>
<span class="text-success">Free {{ diskUsage['system'].free }} GB</span>
&nbsp;
<span class="text-primary">Used {{ diskUsage['system'].used }} GB</span>
</p>
</div>
</div>
</div>
<div class="col-md-12">
<h4 ng-show="activeApp === 'system'">System</h4>
<h4 ng-show="activeApp !== 'system'">{{ activeApp.location }}</h4>
<br/>
<canvas id="memoryAppChart" width="900" height="300"></canvas>
<p>Memory consumption in MB.</p>
</div>
</div>
</div>
<br/>
<div class="text-left">
<h2>Disk Usage</h2>
</div>
<div class="card card-large text-center">
<div class="row">
<div class="col-md-12">
<h4><span class="badge">{{ diskUsage['system'].sum }} GB</span></h4>
<canvas id="systemDiskUsageChart" width="200" height="200"></canvas>
<p>
<span class="text-success">Free {{ diskUsage['system'].free }} GB</span>
&nbsp;
<span class="text-primary">Used {{ diskUsage['system'].used }} GB</span>
</p>
</div>
</div>
</div>
</div>
<br/>
<br/>