ui redesign
This commit is contained in:
parent
1c4d73da43
commit
873a28aa28
|
@ -2,7 +2,8 @@ body {
|
||||||
padding-top: 50px;
|
padding-top: 50px;
|
||||||
}
|
}
|
||||||
.starter-template {
|
.starter-template {
|
||||||
padding: 40px 15px;
|
padding-top: 30px;
|
||||||
|
padding-bottom: 60px;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -24,7 +25,46 @@ td {
|
||||||
|
|
||||||
.pitstop {
|
.pitstop {
|
||||||
}
|
}
|
||||||
|
//.navbar-fixed-bottom{
|
||||||
|
//margin-bottom:20px;
|
||||||
|
//}
|
||||||
.nav-pills > li > a {
|
.nav-pills > li > a {
|
||||||
border: 1px solid;
|
border: 1px solid;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
h1 {
|
||||||
|
margin-top: 0px;
|
||||||
|
}
|
||||||
|
|
||||||
|
h2 {
|
||||||
|
margin-top: 0px;
|
||||||
|
}
|
||||||
|
|
||||||
|
h3 {
|
||||||
|
margin-top: 0px;
|
||||||
|
}
|
||||||
|
h3:before{
|
||||||
|
content:"― ";
|
||||||
|
}
|
||||||
|
h3:after{
|
||||||
|
content:" ―";
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
@media only screen
|
||||||
|
and (min-device-width : 320px)
|
||||||
|
and (max-device-width : 568px) {
|
||||||
|
h3:before{
|
||||||
|
content:"";
|
||||||
|
}
|
||||||
|
h3:after{
|
||||||
|
content:"";
|
||||||
|
}
|
||||||
|
#charts_tabs {
|
||||||
|
display:none;
|
||||||
|
}
|
||||||
|
#charts_tabs-content {
|
||||||
|
display:none;
|
||||||
|
}
|
||||||
|
}
|
|
@ -1,7 +1,7 @@
|
||||||
{% extends "layout.html" %}
|
{% extends "layout.html" %}
|
||||||
|
|
||||||
{% block body %}
|
{% block body %}
|
||||||
<h3>Account management for {{current_user.email}}</h3>
|
<h3>Account management for {{current_user.email}}</h3>
|
||||||
<div class="panel panel-default">
|
<div class="panel panel-default">
|
||||||
<div class="panel-heading">Password</div>
|
<div class="panel-heading">Password</div>
|
||||||
<div class="panel-body">
|
<div class="panel-body">
|
||||||
|
|
|
@ -1,12 +1,18 @@
|
||||||
{% extends "layout.html" %}
|
{% extends "layout.html" %}
|
||||||
|
|
||||||
{% block body %}
|
{% block body %}
|
||||||
<h3>Create vehicle</h3>
|
<div class="col-md-2" ></div>
|
||||||
<form class='form-horizontal' method="POST">
|
<div class="col-md-8">
|
||||||
{{ form.hidden_tag() }}
|
<div class="panel panel-default">
|
||||||
{{ render_field_with_errors(form.name) }}
|
<div class="panel-body">
|
||||||
{{ render_field_with_errors(form.submit) }}
|
<h3>Create vehicle</h3>
|
||||||
</form>
|
<form class='form-horizontal' method="POST">
|
||||||
|
{{ form.hidden_tag() }}
|
||||||
|
{{ render_field_with_errors(form.name) }}
|
||||||
|
{{ render_field_with_errors(form.submit) }}
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="col-md-2" ></div>
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|
|
@ -1,11 +1,18 @@
|
||||||
{% extends "layout.html" %}
|
{% extends "layout.html" %}
|
||||||
|
|
||||||
{% block body %}
|
{% block body %}
|
||||||
<h3>Delete vehicle '{{vehicle.name}}'</h3>
|
<div class="col-md-2" ></div>
|
||||||
<form class='form-horizontal' method="POST">
|
<div class="col-md-8">
|
||||||
{{ form.hidden_tag() }}
|
<div class="panel panel-default">
|
||||||
{{ render_field_with_errors(form.submit) }}
|
<div class="panel-body">
|
||||||
</form>
|
<h3>Delete vehicle '{{vehicle.name}}'</h3>
|
||||||
|
<form class='form-horizontal' method="POST">
|
||||||
|
{{ form.hidden_tag() }}
|
||||||
|
{{ render_field_with_errors(form.submit) }}
|
||||||
|
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="col-md-2" ></div>
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|
|
@ -1,12 +1,18 @@
|
||||||
{% extends "layout.html" %}
|
{% extends "layout.html" %}
|
||||||
|
|
||||||
{% block body %}
|
{% block body %}
|
||||||
<h3>Edit vehicle</h3>
|
<div class="col-md-2" ></div>
|
||||||
<form class='form-horizontal' method="POST">
|
<div class="col-md-8">
|
||||||
{{ form.hidden_tag() }}
|
<div class="panel panel-default">
|
||||||
{{ render_field_with_errors(form.name) }}
|
<div class="panel-body">
|
||||||
{{ render_field_with_errors(form.submit) }}
|
<h3>Edit vehicle</h3>
|
||||||
</form>
|
<form class='form-horizontal' method="POST">
|
||||||
|
{{ form.hidden_tag() }}
|
||||||
|
{{ render_field_with_errors(form.name) }}
|
||||||
|
{{ render_field_with_errors(form.submit) }}
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|
|
@ -3,6 +3,9 @@
|
||||||
|
|
||||||
{% block body %}
|
{% block body %}
|
||||||
<div class="row">
|
<div class="row">
|
||||||
|
<div class="col-md-4">
|
||||||
|
{{ render_login_form() }}
|
||||||
|
</div>
|
||||||
<div class="col-md-8">
|
<div class="col-md-8">
|
||||||
<div class="panel panel-default">
|
<div class="panel panel-default">
|
||||||
<div class="panel-body">
|
<div class="panel-body">
|
||||||
|
@ -21,22 +24,5 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-md-4">
|
|
||||||
<div class="panel panel-default">
|
|
||||||
<div class="panel-body">
|
|
||||||
<form class='form-horizontal' action="{{ url_for_security('login') }}" method="POST" name="login_user_form">
|
|
||||||
{{ login_user_form.hidden_tag() }}
|
|
||||||
{{ render_field_with_errors(login_user_form.email) }}
|
|
||||||
{{ render_field_with_errors(login_user_form.password) }}
|
|
||||||
{{ render_field_with_errors(login_user_form.remember) }}
|
|
||||||
{{ render_field(login_user_form.next) }}
|
|
||||||
{{ render_field_with_errors(login_user_form.submit) }}
|
|
||||||
{% if security.recoverable %}
|
|
||||||
<a href="{{ url_for_security('forgot_password') }}">Forgot password</a>
|
|
||||||
{% endif %}
|
|
||||||
</form>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|
|
@ -16,14 +16,22 @@
|
||||||
{% macro render_field_with_errors(field) %}
|
{% macro render_field_with_errors(field) %}
|
||||||
<div class="form-group">
|
<div class="form-group">
|
||||||
{% if field.type == 'SubmitField' %}
|
{% if field.type == 'SubmitField' %}
|
||||||
<div class="col-sm-12" style="align:center">
|
<div class="col-md-4" ></div>
|
||||||
|
|
||||||
|
<div class="col-sm-4" style="align:center">
|
||||||
<input id="{{ field.id }}" name="{{ field.id }}" class="btn btn-default" type="submit" value="{{ field.label.text }}">
|
<input id="{{ field.id }}" name="{{ field.id }}" class="btn btn-default" type="submit" value="{{ field.label.text }}">
|
||||||
</div>
|
</div>
|
||||||
|
<!--
|
||||||
|
<div class="col-sm-3" style="align:center">
|
||||||
|
<a class="btn btn-default" href="{{ g.data['back'] }}" role="button">Cancel</a>
|
||||||
|
</div>
|
||||||
|
-->
|
||||||
|
<div class="col-md-4" ></div>
|
||||||
{% else %}
|
{% else %}
|
||||||
<label class="col-sm-6 control-label">
|
<label class="col-sm-6 control-label">
|
||||||
{{ field.label }}
|
{{ field.label }}
|
||||||
</label>
|
</label>
|
||||||
<div class="col-sm-2">
|
<div class="col-sm-6">
|
||||||
{% if field.type == 'SelectField' %}
|
{% if field.type == 'SelectField' %}
|
||||||
<select id="{{ field.id }}" name="{{ field.id }}" class="form-control">
|
<select id="{{ field.id }}" name="{{ field.id }}" class="form-control">
|
||||||
{% for choice in field.choices %}
|
{% for choice in field.choices %}
|
||||||
|
@ -54,7 +62,25 @@
|
||||||
{% endif %}
|
{% endif %}
|
||||||
</div>
|
</div>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
|
</div>
|
||||||
|
{% endmacro %}
|
||||||
|
|
||||||
|
{% macro render_login_form() %}
|
||||||
|
<div class="panel panel-default">
|
||||||
|
<div class="panel-body">
|
||||||
|
<h3>Login</h3>
|
||||||
|
<form class='form-horizontal' action="{{ url_for_security('login') }}" method="POST" name="login_user_form">
|
||||||
|
{{ login_user_form.hidden_tag() }}
|
||||||
|
{{ render_field_with_errors(login_user_form.email) }}
|
||||||
|
{{ render_field_with_errors(login_user_form.password) }}
|
||||||
|
{{ render_field_with_errors(login_user_form.remember) }}
|
||||||
|
{{ render_field(login_user_form.next) }}
|
||||||
|
{{ render_field_with_errors(login_user_form.submit) }}
|
||||||
|
{% if security.recoverable %}
|
||||||
|
<a href="{{ url_for_security('forgot_password') }}">Forgot password</a>
|
||||||
|
{% endif %}
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
{% endmacro %}
|
{% endmacro %}
|
||||||
|
|
||||||
|
@ -151,5 +177,12 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<nav class="navbar navbar-inverse navbar-fixed-bottom">
|
||||||
|
<div class="container">
|
||||||
|
<div class="navbar-footer">
|
||||||
|
<a class="navbar-brand" href="">Imprint</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
|
@ -1,20 +1,25 @@
|
||||||
{% extends "layout.html" %}
|
{% extends "layout.html" %}
|
||||||
|
|
||||||
{% block body %}
|
{% block body %}
|
||||||
<h3>New Pitstop for '{{ vehicle.name }}'</h3>
|
<div class="col-md-2" ></div>
|
||||||
<form class='form-horizontal' method="POST">
|
<div class="col-md-8">
|
||||||
{{ form.hidden_tag() }}
|
<div class="panel panel-default">
|
||||||
{{ render_field_with_errors(form.date) }}
|
<div class="panel-body">
|
||||||
<span id="{{form.date.id}}_help" class="help-block">
|
<h3>New Pitstop for '{{ vehicle.name }}'</h3>
|
||||||
{{messages['date']}}
|
<form class='form-horizontal' method="POST">
|
||||||
</span>
|
{{ form.hidden_tag() }}
|
||||||
{{ render_field_with_errors(form.odometer) }}
|
{{ render_field_with_errors(form.date) }}
|
||||||
<span id="{{form.odometer.id}}_help" class="help-block">
|
<span id="{{form.date.id}}_help" class="help-block">
|
||||||
{{messages['odometer']}}
|
{{messages['date']}}
|
||||||
</span>
|
</span>
|
||||||
{{ render_field_with_errors(form.litres) }}
|
{{ render_field_with_errors(form.odometer) }}
|
||||||
{{ render_field_with_errors(form.submit) }}
|
<span id="{{form.odometer.id}}_help" class="help-block">
|
||||||
</form>
|
{{messages['odometer']}}
|
||||||
|
</span>
|
||||||
|
{{ render_field_with_errors(form.litres) }}
|
||||||
|
{{ render_field_with_errors(form.submit) }}
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|
|
@ -2,12 +2,19 @@
|
||||||
{% from "security/_macros.html" import render_field_with_errors, render_field %}
|
{% from "security/_macros.html" import render_field_with_errors, render_field %}
|
||||||
|
|
||||||
{% block body %}
|
{% block body %}
|
||||||
<h1>Change password</h1>
|
<div class="col-md-2" ></div>
|
||||||
<form class='form-horizontal' action="{{ url_for_security('change_password') }}" method="POST" name="change_password_form">
|
<div class="col-md-8">
|
||||||
{{ change_password_form.hidden_tag() }}
|
<div class="panel panel-default">
|
||||||
{{ render_field_with_errors(change_password_form.password) }}
|
<div class="panel-body">
|
||||||
{{ render_field_with_errors(change_password_form.new_password) }}
|
<h3>Change password</h3>
|
||||||
{{ render_field_with_errors(change_password_form.new_password_confirm) }}
|
<form class='form-horizontal' action="{{ url_for_security('change_password') }}" method="POST" name="change_password_form">
|
||||||
{{ render_field_with_errors(change_password_form.submit) }}
|
{{ change_password_form.hidden_tag() }}
|
||||||
</form>
|
{{ render_field_with_errors(change_password_form.password) }}
|
||||||
|
{{ render_field_with_errors(change_password_form.new_password) }}
|
||||||
|
{{ render_field_with_errors(change_password_form.new_password_confirm) }}
|
||||||
|
{{ render_field_with_errors(change_password_form.submit) }}
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|
|
@ -2,10 +2,18 @@
|
||||||
{% from "security/_macros.html" import render_field_with_errors, render_field %}
|
{% from "security/_macros.html" import render_field_with_errors, render_field %}
|
||||||
|
|
||||||
{% block body %}
|
{% block body %}
|
||||||
<h1>Send password reset instructions</h1>
|
<div class="col-md-2" ></div>
|
||||||
<form class='form-horizontal' action="{{ url_for_security('forgot_password') }}" method="POST" name="forgot_password_form">
|
<div class="col-md-8">
|
||||||
{{ forgot_password_form.hidden_tag() }}
|
<div class="panel panel-default">
|
||||||
{{ render_field_with_errors(forgot_password_form.email) }}
|
<div class="panel-body">
|
||||||
{{ render_field_with_errors(forgot_password_form.submit) }}
|
<h3>Reset password</h3>
|
||||||
</form>
|
<form class='form-horizontal' action="{{ url_for_security('forgot_password') }}" method="POST" name="forgot_password_form">
|
||||||
|
{{ forgot_password_form.hidden_tag() }}
|
||||||
|
{{ render_field_with_errors(forgot_password_form.email) }}
|
||||||
|
{{ render_field_with_errors(forgot_password_form.submit) }}
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="col-md-2" ></div>
|
||||||
|
</div>
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|
|
@ -2,17 +2,12 @@
|
||||||
{% from "security/_macros.html" import render_field_with_errors, render_field %}
|
{% from "security/_macros.html" import render_field_with_errors, render_field %}
|
||||||
|
|
||||||
{% block body %}
|
{% block body %}
|
||||||
<h1>Login</h1>
|
<div class="row">
|
||||||
<form class='form-horizontal' action="{{ url_for_security('login') }}" method="POST" name="login_user_form">
|
<div class="col-md-2" ></div>
|
||||||
{{ login_user_form.hidden_tag() }}
|
<div class="col-md-8">
|
||||||
{{ render_field_with_errors(login_user_form.email) }}
|
{{ render_login_form() }}
|
||||||
{{ render_field_with_errors(login_user_form.password) }}
|
</div>
|
||||||
{{ render_field_with_errors(login_user_form.remember) }}
|
<div class="col-md-2" ></div>
|
||||||
{{ render_field(login_user_form.next) }}
|
</div>
|
||||||
{{ render_field_with_errors(login_user_form.submit) }}
|
|
||||||
{% if security.recoverable %}
|
|
||||||
<a href="{{ url_for_security('forgot_password') }}">Forgot password</a>
|
|
||||||
{% endif %}
|
|
||||||
</form>
|
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|
||||||
|
|
|
@ -2,14 +2,22 @@
|
||||||
{% from "security/_macros.html" import render_field_with_errors, render_field %}
|
{% from "security/_macros.html" import render_field_with_errors, render_field %}
|
||||||
|
|
||||||
{% block body %}
|
{% block body %}
|
||||||
<h1>Register User</h1>
|
<div class="col-md-2" ></div>
|
||||||
<form class='form-horizontal' action="{{ url_for_security('register') }}" method="POST" name="register_user_form">
|
<div class="col-md-8">
|
||||||
{{ register_user_form.hidden_tag() }}
|
<div class="panel panel-default">
|
||||||
{{ render_field_with_errors(register_user_form.email) }}
|
<div class="panel-body">
|
||||||
{{ render_field_with_errors(register_user_form.password) }}
|
<h3>Register</h3>
|
||||||
{% if register_user_form.password_confirm %}
|
<form class='form-horizontal' action="{{ url_for_security('register') }}" method="POST" name="register_user_form">
|
||||||
{{ render_field_with_errors(register_user_form.password_confirm) }}
|
{{ register_user_form.hidden_tag() }}
|
||||||
{% endif %}
|
{{ render_field_with_errors(register_user_form.email) }}
|
||||||
{{ render_field_with_errors(register_user_form.submit) }}
|
{{ render_field_with_errors(register_user_form.password) }}
|
||||||
</form>
|
{% if register_user_form.password_confirm %}
|
||||||
|
{{ render_field_with_errors(register_user_form.password_confirm) }}
|
||||||
|
{% endif %}
|
||||||
|
{{ render_field_with_errors(register_user_form.submit) }}
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="col-md-2" ></div>
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|
|
@ -1,10 +1,19 @@
|
||||||
{% extends "layout.html" %}
|
{% extends "layout.html" %}
|
||||||
|
|
||||||
{% block body %}
|
{% block body %}
|
||||||
<h3>Select Vehicle</h3>
|
<div class="col-md-2" ></div>
|
||||||
<form class='form-horizontal' method="POST">
|
<div class="col-md-8">
|
||||||
{{ form.hidden_tag() }}
|
<div class="panel panel-default">
|
||||||
{{ render_field_with_errors(form.vehicle) }}
|
<div class="panel-body">
|
||||||
{{ render_field_with_errors(form.submit) }}
|
<h3>Select Vehicle</h3>
|
||||||
</form>
|
<form class='form-horizontal' method="POST">
|
||||||
|
{{ form.hidden_tag() }}
|
||||||
|
{{ render_field_with_errors(form.vehicle) }}
|
||||||
|
{{ render_field_with_errors(form.submit) }}
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="col-md-2" ></div>
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|
||||||
|
|
|
@ -11,7 +11,7 @@
|
||||||
</li>
|
</li>
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
</ul>
|
</ul>
|
||||||
<div id="vehicle_contetn" class="tab-content">
|
<div id="vehicle_content" class="tab-content ">
|
||||||
{% for vehicle in data %}
|
{% for vehicle in data %}
|
||||||
<div class="tab-pane {% if loop.first %}active{% endif %}" id="v{{vehicle.id}}">
|
<div class="tab-pane {% if loop.first %}active{% endif %}" id="v{{vehicle.id}}">
|
||||||
<h3>{{vehicle.name}}</h3>
|
<h3>{{vehicle.name}}</h3>
|
||||||
|
@ -45,6 +45,11 @@
|
||||||
</div>
|
</div>
|
||||||
<ul id="charts_tabs" class="nav nav-tabs" data-tabs="tabs">
|
<ul id="charts_tabs" class="nav nav-tabs" data-tabs="tabs">
|
||||||
<li class="active">
|
<li class="active">
|
||||||
|
<a href="#v{{vehicle.id}}_c3" id="i{{vehicle.id}}_c3" data-toggle="tab">
|
||||||
|
Consumption
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
<a href="#v{{vehicle.id}}_c1" id="i{{vehicle.id}}_c1" data-toggle="tab">
|
<a href="#v{{vehicle.id}}_c1" id="i{{vehicle.id}}_c1" data-toggle="tab">
|
||||||
Fuelled litres
|
Fuelled litres
|
||||||
</a>
|
</a>
|
||||||
|
@ -54,13 +59,8 @@
|
||||||
Odometer
|
Odometer
|
||||||
</a>
|
</a>
|
||||||
</li>
|
</li>
|
||||||
<li>
|
|
||||||
<a href="#v{{vehicle.id}}_c3" id="i{{vehicle.id}}_c3" data-toggle="tab">
|
|
||||||
Consumption
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
</ul>
|
||||||
<div id="my-tab-content" class="tab-content">
|
<div id="charts_tabs-content" class="tab-content">
|
||||||
<div class="tab-pane active" id="v{{vehicle.id}}_c1">
|
<div class="tab-pane active" id="v{{vehicle.id}}_c1">
|
||||||
{% if vehicle.pitstop_count > 0 %}
|
{% if vehicle.pitstop_count > 0 %}
|
||||||
<div id="fuelledChartDiv{{vehicle.id}}" style="width:100%; height:500px;"></div>
|
<div id="fuelledChartDiv{{vehicle.id}}" style="width:100%; height:500px;"></div>
|
||||||
|
|
Loading…
Reference in New Issue