Skip to content

I
IoTSmartMeter
Commit ac01727c authored by Kristian Tan's avatar Kristian Tan
Browse files
Options

added container for inputs

parent 095a5350
Hide whitespace changes
Inline Side-by-side
Showing with 44 additions and 35 deletions
static/css/main.css
View file @ ac01727c
......@@ -9,11 +9,18 @@ body {
/*background-color: aqua;*/
}
.container {
.containerRows {
display: flex;
flex-direction: row;
/*background-color: darkkhaki;*/
height: 100%;
background-color: darkkhaki;
height: 90%;
}
.containerCols {
display: flex;
flex-direction: column;
height: 10%;
background-color: green;
}
.device_list {
......
templates/main.html
View file @ ac01727c
......@@ -9,41 +9,43 @@
</div>
<body>
<div class="container">
<form action="{{ url_for('handle_data') }}" method="post">
<input type="text" name="kWhprice">
<input type="submit">
</form>
<div class="device_list">
<h3 class="device_list_title">Device Listing and Status</h3>
{% for pin in pins %}
<p>{{ pins[pin].name }} :
{% if pins[pin].state == true %}
(<a href="/toggle/{{pin}}">turn off</a>)
{% else %}
(<a href="/toggle/{{pin}}">turn on</a>)
{% endif %}
</p>
{% endfor %}
<div class="containerCols">
<div class="containerRows">
<form action="{{ url_for('handle_data') }}" method="post">
<input type="text" name="kWhprice">
<input type="submit">
</form>
<div class="device_list">
<h3 class="device_list_title">Device Listing and Status</h3>
{% for pin in pins %}
<p>{{ pins[pin].name }} :
{% if pins[pin].state == true %}
(<a href="/toggle/{{pin}}">turn off</a>)
{% else %}
(<a href="/toggle/{{pin}}">turn on</a>)
{% endif %}
</p>
{% endfor %}
</div>
</div>
<div class="smart_meter">
<div class="smart_meter_info">
<p> Devices currently in use: </p>
<ul>
{% for pin in pins %}
{% if pins[pin].state == true %}
<li>{{ pins[pin].name }}</li>
{% endif %}
{% endfor %}
</ul>
{# Implement some way to display "No devices" message if none are in use#}
<p> Total energy used today: {{ daily_total }} kWh.</p>
<p> Total cost of today's energy usage: £{{ todays_cost }}</p>
<div class="smart_meter">
<div class="smart_meter_info">
<p> Devices currently in use: </p>
<ul>
{% for pin in pins %}
{% if pins[pin].state == true %}
<li>{{ pins[pin].name }}</li>
{% endif %}
{% endfor %}
</ul>
{# Implement some way to display "No devices" message if none are in use#}
<p> Total energy used today: {{ daily_total }} kWh.</p>
<p> Total cost of today's energy usage: £{{ todays_cost }}</p>
</div>
</div>
</div>
</div>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment