external/mailinabox
1
0
Fork 0
mirror of https://github.com/mail-in-a-box/mailinabox.git synced 2026-03-17 17:57:23 +01:00
Code Issues Releases Wiki Activity

Fix various Bootstrap container/row/column abuses resulting in broken layouts

Browse Source 
Every column has to be in a row, and every row has to be in a container (except
where a row is nested directly within a column).

This also includes a change to index.html that pushes the footer to the bottom
of the page on those where it otherwise wouldn't be.
This commit is contained in:
David Piggott
2014-10-19 22:40:22 +01:00
parent 6585384daa
commit 3e261dee66
12 changed files with 1300 additions and 1172 deletions
Download Patch File Download Diff File Expand all files Collapse all files

240
management/templates/index.html
View File

@@ -17,13 +17,43 @@
@import url(https://fonts.googleapis.com/css?family=Raleway:400,700);
@import url(https://fonts.googleapis.com/css?family=Ubuntu:300);
html {
overflow-y: scroll;
}
html {
overflow-y: scroll;
}
html,
body {
height: 100%;
}
#wrap {
min-height: 100%;
height: auto !important;
height: 100%;
margin: 0 auto -50px;
}
#push,
#footer {
height: 50px;
}
@media (max-width: 767px) {
#footer {
margin-left: -20px;
margin-right: -20px;
padding-left: 20px;
padding-right: 20px;
}
}
body {
padding-top: 50px;
padding-bottom: 20px;
}
footer {
padding-top: 10px;
font: bold italic medium;
border-top: 1px solid #e5e5e5;
}
p {
@@ -61,9 +91,9 @@
margin: 1.5em 0;
}
ol li {
margin-bottom: 1em;
}
ol li {
margin-bottom: 1em;
}
</style>
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap-theme.min.css">
<style>
@@ -73,99 +103,111 @@
<!--[if lt IE 7]>
<p class="chromeframe">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> or <a href="http://www.google.com/chromeframe/?redirect=true">activate Google Chrome Frame</a> to improve your experience.</p>
<![endif]-->
<div class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">{{hostname}}</a>
<div id="wrap">
<div class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">{{hostname}}</a>
</div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">System <b class="caret"></b></a>
<ul class="dropdown-menu">
<li><a href="#system_status" onclick="return show_panel(this);">Status Checks</a></li>
<li><a href="#ssl" onclick="return show_panel(this);">SSL Certificates</a></li>
<li><a href="#system_backup" onclick="return show_panel(this);">Backup Status</a></li>
<li class="divider"></li>
<li class="dropdown-header">Super Advanced Options</li>
<li><a href="#custom_dns" onclick="return show_panel(this);">Custom DNS</a></li>
<li><a href="#external_dns" onclick="return show_panel(this);">External DNS</a></li>
</ul>
</li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Mail <b class="caret"></b></a>
<ul class="dropdown-menu">
<li><a href="#mail-guide" onclick="return show_panel(this);">Instructions</a></li>
<li><a href="#users" onclick="return show_panel(this);">Users</a></li>
<li><a href="#aliases" onclick="return show_panel(this);">Aliases</a></li>
</ul>
</li>
<li><a href="#sync_guide" onclick="return show_panel(this);">Contacts/Calendar</a></li>
<li><a href="#web" onclick="return show_panel(this);">Web</a></li>
</ul>
<ul class="nav navbar-nav navbar-right">
<li><a href="#" onclick="do_logout(); return false;" style="color: white">Log out?</a></li>
</ul>
</div><!--/.navbar-collapse -->
</div>
</div>
<div class="container">
<div class="row">
<div class="col-sm-12">
<div id="panel_system_status" class="panel">
{% include "system-status.html" %}
</div>
<div id="panel_system_backup" class="panel">
{% include "system-backup.html" %}
</div>
<div id="panel_external_dns" class="panel">
{% include "external-dns.html" %}
</div>
<div id="panel_custom_dns" class="panel">
{% include "custom-dns.html" %}
</div>
<div id="panel_login" class="panel">
{% include "login.html" %}
</div>
<div id="panel_mail-guide" class="panel">
{% include "mail-guide.html" %}
</div>
<div id="panel_users" class="panel">
{% include "users.html" %}
</div>
<div id="panel_aliases" class="panel">
{% include "aliases.html" %}
</div>
<div id="panel_sync_guide" class="panel">
{% include "sync-guide.html" %}
</div>
<div id="panel_web" class="panel">
{% include "web.html" %}
</div>
<div id="panel_ssl" class="panel">
{% include "ssl.html" %}
</div>
</div>
</div>
<div id="push"></div>
</div>
</div>
<div id="footer">
<div class="container">
<div class="row">
<div class="col-sm-12">
<footer>
<p>This is a <a href="https://mailinabox.email">Mail-in-a-Box</a>.</p>
</footer>
</div>
</div>
</div>
</div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">System <b class="caret"></b></a>
<ul class="dropdown-menu">
<li><a href="#system_status" onclick="return show_panel(this);">Status Checks</a></li>
<li><a href="#ssl" onclick="return show_panel(this);">SSL Certificates</a></li>
<li><a href="#system_backup" onclick="return show_panel(this);">Backup Status</a></li>
<li class="divider"></li>
<li class="dropdown-header">Super Advanced Options</li>
<li><a href="#custom_dns" onclick="return show_panel(this);">Custom DNS</a></li>
<li><a href="#external_dns" onclick="return show_panel(this);">External DNS</a></li>
</ul>
</li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Mail <b class="caret"></b></a>
<ul class="dropdown-menu">
<li><a href="#mail-guide" onclick="return show_panel(this);">Instructions</a></li>
<li><a href="#users" onclick="return show_panel(this);">Users</a></li>
<li><a href="#aliases" onclick="return show_panel(this);">Aliases</a></li>
</ul>
</li>
<li><a href="#sync_guide" onclick="return show_panel(this);">Contacts/Calendar</a></li>
<li><a href="#web" onclick="return show_panel(this);">Web</a></li>
</ul>
<ul class="nav navbar-nav navbar-right">
<li><a href="#" onclick="do_logout(); return false;" style="color: white">Log out?</a></li>
</ul>
</div><!--/.navbar-collapse -->
</div>
</div>
<div class="container-fluid">
<div id="panel_system_status" class="container panel">
{% include "system-status.html" %}
</div>
<div id="panel_system_backup" class="container panel">
{% include "system-backup.html" %}
</div>
<div id="panel_external_dns" class="container panel">
{% include "external-dns.html" %}
</div>
<div id="panel_custom_dns" class="container panel">
{% include "custom-dns.html" %}
</div>
<div id="panel_login" class="panel">
{% include "login.html" %}
</div>
<div id="panel_mail-guide" class="container panel">
{% include "mail-guide.html" %}
</div>
<div id="panel_users" class="container panel">
{% include "users.html" %}
</div>
<div id="panel_aliases" class="container panel">
{% include "aliases.html" %}
</div>
<div id="panel_sync_guide" class="container panel">
{% include "sync-guide.html" %}
</div>
<div id="panel_web" class="container panel">
{% include "web.html" %}
</div>
<div id="panel_ssl" class="container panel">
{% include "ssl.html" %}
</div>
<hr>
<footer>
<p>This is a <a href="https://mailinabox.email">Mail-in-a-Box</a>.</p>
</footer>
</div> <!-- /container -->
<div id="ajax_loading_indicator" style="display: none; position: fixed; left: 0; top: 0; width: 100%; height: 100%; text-align: center; background-color: rgba(255,255,255,.75)">
<div style="margin: 20% auto">