Font and status icon refactoring
This commit is contained in:
chrono
parent
19966a21e1
commit
54480706b8
@ -26,7 +26,7 @@ body {
|
||||
-moz-border-radius: 7px;
|
||||
border-radius: 7px;
|
||||
border: 1px solid #ddd;
|
||||
height: 86px;
|
||||
height: 81px;
|
||||
-moz-box-shadow: 0 0 1.1em 0 rgba(0,0,0,0.55);
|
||||
-webkit-box-shadow: 0 0 1.5em 0 rgba(0,0,0,0.55);
|
||||
box-shadow: 0 0 1.1em 0 rgba(0,0,0,0.55);
|
||||
@ -38,8 +38,8 @@ body {
|
||||
padding-right: 5px;
|
||||
font-size: 40px;
|
||||
font-weight: normal;
|
||||
height: 45px;
|
||||
line-height: 45px;
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
vertical-align: middle;
|
||||
color: #d8d3c5;
|
||||
border-color: #000000;
|
||||
@ -74,7 +74,7 @@ body {
|
||||
font-size: 10px;
|
||||
height: 18px;
|
||||
line-height: 18px;
|
||||
width: 105px;
|
||||
width: 100px;
|
||||
border-right: 1px solid #b9b6af;
|
||||
vertical-align: top;
|
||||
text-align: center;
|
||||
@ -83,7 +83,7 @@ body {
|
||||
}
|
||||
|
||||
.ds-num {
|
||||
width: 105px;
|
||||
width: 100px;
|
||||
font-family: "Digi";
|
||||
border-right: 1px solid #b9b6af;
|
||||
white-space: nowrap;
|
||||
@ -109,16 +109,16 @@ body {
|
||||
font-family: "Arial";
|
||||
font-size: 22px;
|
||||
vertical-align: top;
|
||||
line-height: 35px;
|
||||
line-height: 32px;
|
||||
margin-left: 4px;
|
||||
}
|
||||
|
||||
.ds-led {
|
||||
margin: 0;
|
||||
margin: -5px;
|
||||
font-family: "Tables";
|
||||
font-size: 38px;
|
||||
color: #1F1E1A;
|
||||
text-shadow: 2px 2px 5px #000, -2px -2px 5px #000;
|
||||
text-shadow: 0 0 5px #000, 0 0 5px #000;
|
||||
}
|
||||
|
||||
.ds-trend {
|
||||
@ -137,6 +137,10 @@ body {
|
||||
width: initial;
|
||||
}
|
||||
|
||||
.ds-text {
|
||||
font-family: sans-serif;
|
||||
font-size: 32px;
|
||||
}
|
||||
|
||||
.progress {
|
||||
-webkit-border-radius: 0;
|
||||
@ -153,9 +157,8 @@ body {
|
||||
|
||||
.progress-bar {
|
||||
background-color: #75890c;
|
||||
font-family: "LCDN";
|
||||
color: #D6FC13;
|
||||
text-shadow: 0 -1px #333, 1px 0 #333, 0 1px #333, -1px 0 #333;
|
||||
font-family: "Digi";
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
|
||||
|
||||
@ -52,6 +52,7 @@ function deleteProfile()
|
||||
{
|
||||
console.log("Delete profile:" + selected_profile_name);
|
||||
// FIXME: Add cmd for socket communication to delete stored profile
|
||||
leaveEditMode();
|
||||
}
|
||||
|
||||
|
||||
@ -61,7 +62,7 @@ function updateProgress(percentage)
|
||||
{
|
||||
if(percentage > 100) percentage = 100;
|
||||
$('#progressBar').css('width', percentage+'%');
|
||||
//if(percentage>9) $('#progressBar').html(parseInt(percentage)+'% - '+ eta);
|
||||
if(percentage>5) $('#progressBar').html(parseInt(percentage)+'%');
|
||||
}
|
||||
else
|
||||
{
|
||||
@ -86,7 +87,7 @@ function updateProfileTable()
|
||||
if (dps < 0) { slope = "down"; color="rgba(23, 108, 204, 1)"; dps *= -1; } else
|
||||
if (dps == 0) { slope = "right"; color="grey"; }
|
||||
|
||||
html += '<tr><td><h4>' + i + '</h4></td>';
|
||||
html += '<tr><td><h4>' + (i+1) + '</h4></td>';
|
||||
html += '<td><input type="text" class="form-control" id="profiletable-0-'+i+'" value="'+ graph.profile.data[i][0] + '" style="width: 60px" /></td>';
|
||||
html += '<td><input type="text" class="form-control" id="profiletable-1-'+i+'" value="'+ graph.profile.data[i][1] + '" style="width: 60px" /></td>';
|
||||
html += '<td><div class="input-group"><span class="glyphicon glyphicon-circle-arrow-' + slope +
|
||||
@ -444,7 +445,6 @@ $(document).ready(function()
|
||||
eta = minutes+':'+ (seconds < 10 ? "0" : "") + seconds;
|
||||
|
||||
updateProgress(parseFloat(x.runtime)/parseFloat(x.totaltime)*100);
|
||||
$('#progressBar').html(parseInt(parseFloat(x.runtime)/parseFloat(x.totaltime)*100) + '%');
|
||||
$('#state').html(eta);
|
||||
$('#target_temp').html(parseInt(x.target));
|
||||
|
||||
@ -453,14 +453,14 @@ $(document).ready(function()
|
||||
{
|
||||
$("#nav_start").show();
|
||||
$("#nav_stop").hide();
|
||||
$('#state').html(state);
|
||||
$('#state').html('<p class="ds-text">'+state+'</p>');
|
||||
}
|
||||
|
||||
$('#act_temp').html(parseInt(x.temperature));
|
||||
$('#hazard').css("color", (x.temperature > 45 ? "rgb(255, 204, 0)" : "rgba(12, 12, 12, 0.62") );
|
||||
$('#heat').css("color", (x.heat > 0.5 ? "rgba(233, 28, 0, 0.84)" : "rgba(46, 12, 12, 0.62") );
|
||||
//$('#heat').css("text-shadow", (x.heat > 0.5 ? "0 0 5px rgba(233, 28, 0, 0.84), inset 0 0 5px 2px rgba(255,255,255,0.25)" : "0 0 1.1em rgba(0,0,0,0.75)") );
|
||||
$('#air').css("color", (x.air > 0.5 ? "rgba(255, 255, 255, 0.84)" : "rgba(46, 38, 12, 0.62)") );
|
||||
$('#air').css("color", (x.air > 0.5 ? "rgba(216, 211, 197, 1)" : "rgba(55, 55, 55, 0.62)") );
|
||||
//$('#air').css("text-shadow", (x.air > 0.5 ? "0 0 5px rgba(240, 199, 67, 0.84), inset 0 0 5px 2px rgba(255,255,255,0.25)" : "0 0 1.1em rgba(0,0,0,0.75)") );
|
||||
$('#cool').css("color", (x.cool > 0.5 ? "rgba(74, 159, 255, 0.84)" : "rgba(12, 28, 46, 0.62)") );
|
||||
//$('#cool').css("text-shadow", (x.cool > 0.5 ? "0 0 5px rgba(74, 159, 255, 0.84), inset 0 0 5px 2px rgba(255,255,255,0.25)" : "0 0 1.1em rgba(0,0,0,0.75)") );
|
||||
|
||||
@ -26,10 +26,9 @@
|
||||
<body>
|
||||
|
||||
<div class="container">
|
||||
|
||||
<div id="status">
|
||||
<div class="ds-title-panel">
|
||||
<div class="ds-title">Real Temp</div>
|
||||
<div class="ds-title">Sensor Temp</div>
|
||||
<div class="ds-title">Target Temp</div>
|
||||
<div class="ds-title ds-state">Status</div>
|
||||
</div>
|
||||
@ -53,16 +52,13 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="panel panel-default">
|
||||
<div class="panel-heading">
|
||||
|
||||
<div id="profile_selector" class="pull-left">
|
||||
<select id="e2" class="select2" style="margin-top: 4px"></select>
|
||||
<button id="btn_edit" type="button" class="btn btn-default" onclick="enterEditMode()"><span class="glyphicon glyphicon-edit"></span></button>
|
||||
<button id="btn_new" type="button" class="btn btn-default" onclick="enterNewMode(selected_profile)"><span class="glyphicon glyphicon-plus"></span></button>
|
||||
</div>
|
||||
|
||||
<div id="btn_controls" class="pull-right" style="margin-top: 3px">
|
||||
<div id="nav_start" class="btn-group" style="display:none">
|
||||
<button type="button" class="btn btn-default" onclick="runTaskSimulation();">Simulate</button>
|
||||
@ -70,7 +66,6 @@
|
||||
</div>
|
||||
<button id="nav_stop" type="button" class="btn btn-danger" onclick="abortTask()" style="display:none" ><span class="glyphicon glyphicon-stop"></span> Stop</button>
|
||||
</div>
|
||||
|
||||
<div id="edit" style="display:none;">
|
||||
<div class="input-group">
|
||||
<span class="input-group-addon">Profile Name</span>
|
||||
@ -93,12 +88,10 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="panel-body">
|
||||
<div id="graph_container" class="graph"></div>
|
||||
</div>
|
||||
<div id="profile_table" class="panel-footer" style="display:none;"></div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -146,6 +139,5 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user