diff options
| -rw-r--r-- | budget/static/css/main.css | 17 | ||||
| -rw-r--r-- | budget/templates/home.html | 24 | ||||
| -rw-r--r-- | budget/templates/layout.html | 15 | ||||
| -rw-r--r-- | budget/templates/list_bills.html | 12 | ||||
| -rw-r--r-- | budget/templates/settle_bills.html | 6 | ||||
| -rw-r--r-- | budget/templates/sidebar_table_layout.html | 14 |
6 files changed, 39 insertions, 49 deletions
diff --git a/budget/static/css/main.css b/budget/static/css/main.css index f3fe8a0..0a07e94 100644 --- a/budget/static/css/main.css +++ b/budget/static/css/main.css @@ -55,13 +55,6 @@ body { background-position: center bottom; background-repeat: no-repeat; height: 100%; - width: 230px; - padding-left: 10px; - padding-right: 20px; - padding-top: 10px; - margin-left: -20px; - margin-top: -10px; - margin-right: 15px; color: black; position: fixed; } @@ -70,13 +63,13 @@ body { #add-member-form input[type="text"] { width: 60%; } #add-member-form button { width: 35%; } -#table_overflow { overflow-y: auto; overflow-x: hidden; width: 235px; } +#table_overflow { overflow-y: auto; overflow-x: hidden;} + /* Content */ .content { - padding-top: 1em; - padding-left: 250px; + margin-top: 1rem; } /* Home */ @@ -94,7 +87,9 @@ body { height: 100px; } -#footer{ +footer{ + margin-left: -15px; + margin-right: -15px; margin-top: 30px; position: fixed; bottom: 0px; diff --git a/budget/templates/home.html b/budget/templates/home.html index e6d7932..d970fe7 100644 --- a/budget/templates/home.html +++ b/budget/templates/home.html @@ -1,24 +1,19 @@ {% extends "layout.html" %} -{% block header %} -<div id="header" class="container-fluid"> - <div class="row-fluid"> - <div class="span5 offset2"> +{% block body %} + <header id="header" class="row"> + <div class="col-5 offset-md-2"> <h2>{{ _("Manage your shared <br>expenses, easily") }}</h2> <a href="{{ url_for(".demo") }}" class="tryout btn btn-inverse pull-right">{{ _("Try out the demo") }}</a> </div> - <div class="span4"> + <div class="col-4"> <p class="additional-content">{{ _("You're sharing a house?") }}<br /> {{ _("Going on holidays with friends?") }}<br /> {{ _("Simply sharing money with others?") }} <br /><strong>{{ _("We can help!") }}</strong></p> </div> - </div> -</div> -{% endblock %} + </header> -{% block body %} -<div class="container-fluid"> - <div class="row-fluid home"> - <div class="span4 offset2"> + <main class="row home"> + <div class="col-4 offset-md-2"> <form id="authentication-form" class="form-horizontal" action="{{ url_for(".authenticate") }}" method="post"> <fieldset class="form-group"> <legend>{{ _("Log to an existing project") }}...</legend> @@ -30,7 +25,7 @@ </div> </form> </div> - <div class="span4"> + <div class="col-3 offset-md-1"> <form id="creation-form" class="form-horizontal" action="{{ url_for(".create_project") }}" method="post"> <fieldset class="form-group"> <legend>...{{ _("or create a new one") }}</legend> @@ -40,9 +35,8 @@ <button class="btn" type="submit">{{ _("let's get started") }}</button> </div> </form> - </div> + </main> </div> -</div> {% endblock %} {% block js %} diff --git a/budget/templates/layout.html b/budget/templates/layout.html index 7b44638..e9adb30 100644 --- a/budget/templates/layout.html +++ b/budget/templates/layout.html @@ -73,25 +73,26 @@ </div> </div> -{% block header %}{% endblock %} -{% block body %} +</nav> + <div class="container-fluid"> +{% block body %} {% block sidebar %}{% endblock %} - <div class="content"> + <main class="content offset-1 col-10"> {% block content %}{% endblock %} - </div> + </main> </div> {% endblock %} {% for message in get_flashed_messages() %} -<div class="flash alert alert-success"><p>{{ message }}</p></div> +<div class="flash alert alert-success">{{ message }}</div> {% endfor %} {% block footer %} -<div id="footer"> +<footer> <p><a href="https://github.com/spiral-project/ihatemoney">{{ _("This is a free software") }}</a>, {{ _("you can contribute and improve it!") }}</p> -</div> +</footer> {% endblock %} </body> diff --git a/budget/templates/list_bills.html b/budget/templates/list_bills.html index aacc128..69a1692 100644 --- a/budget/templates/list_bills.html +++ b/budget/templates/list_bills.html @@ -1,16 +1,10 @@ -{% extends "layout.html" %} +{% extends "sidebar_table_layout.html" %} {% block title %} - {{ g.project.name }}{% endblock %} {% block head %} <script src="{{ url_for("static", filename="js/bootstrap-datepicker.js") }}"></script> {% endblock %} {% block js %} - - $(window).resize(function() { - $("#sidebar").height( window.innerHeight-50 ); - $("#table_overflow").height( $("#sidebar").height()-120 ); - }); - {% if add_bill %} $('#new-bill').click(); {% endif %} // Hide all members actions @@ -56,8 +50,6 @@ {% endblock %} {% block sidebar %} -<div id="sidebar" class="sidebar"> - <form id="add-member-form" action="{{ url_for(".add_member") }}" method="post" class="form-inline"> {{ forms.add_member(member_form) }} </form> @@ -89,8 +81,6 @@ {% endfor %} </table> </div> - -</div> {% endblock %} {% block content %} diff --git a/budget/templates/settle_bills.html b/budget/templates/settle_bills.html index 8a9f733..b67a9b8 100644 --- a/budget/templates/settle_bills.html +++ b/budget/templates/settle_bills.html @@ -1,8 +1,6 @@ -{% extends "layout.html" %} +{% extends "sidebar_table_layout.html" %} {% block sidebar %} -<div id="sidebar" class="sidebar"> - <div id="table_overflow"> <table class="balance table"> {% set balance = g.project.balance %} @@ -16,8 +14,6 @@ {% endfor %} </table> </div> - -</div> {% endblock %} diff --git a/budget/templates/sidebar_table_layout.html b/budget/templates/sidebar_table_layout.html new file mode 100644 index 0000000..7c831f4 --- /dev/null +++ b/budget/templates/sidebar_table_layout.html @@ -0,0 +1,14 @@ +{% extends "layout.html" %} + +{% block body %} +<div class="row" style="height: 100%"> +<aside id="sidebar" class="sidebar col-3 " style="height: 100%"> + {% block sidebar %}{% endblock %} +</aside> + +<main class="offset-md-3 col-9"> + {% block content %}{% endblock %} +</main> + +</div> +{% endblock %} |