From 2a2a33c3eab91b088c1e9396ad4665905583c813 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Ma=C3=ABl=20Solard?= <mael.solard@laposte.net>
Date: Tue, 12 Aug 2014 17:49:20 +0200
Subject: [PATCH] Change the appearance of side-bars and simplify css rules due
 to old appearance

---
 .../core/templates/core/settings_header.html  |  2 +-
 modoboa/core/templates/core/user_index.html   |  2 +-
 modoboa/core/templatetags/core_tags.py        |  4 +-
 .../admin/templates/admin/listing.html        | 14 ++--
 .../limits/templates/limits/poolusage.html    |  4 +-
 .../templates/sievefilters/index.html         |  2 +-
 modoboa/extensions/sievefilters/views.py      |  2 +-
 .../stats/templates/stats/index.html          | 72 +++++++++----------
 .../webmail/static/webmail/css/webmail.css    |  8 ---
 .../webmail/static/webmail/js/webmail.js      |  2 +-
 .../webmail/templates/webmail/folder.html     |  2 +-
 .../webmail/templates/webmail/folders.html    |  2 +-
 .../webmail/templates/webmail/index.html      |  2 +-
 .../webmail/templatetags/webmail_tags.py      |  2 +-
 modoboa/static/css/custom.css                 | 37 ----------
 15 files changed, 54 insertions(+), 103 deletions(-)

diff --git a/modoboa/core/templates/core/settings_header.html b/modoboa/core/templates/core/settings_header.html
index 590ad50da..c2d164a3c 100644
--- a/modoboa/core/templates/core/settings_header.html
+++ b/modoboa/core/templates/core/settings_header.html
@@ -19,5 +19,5 @@ $(document).ready(function() {
 });
 </script>
 {% endblock %}
-{% block leftcol %}<div class="well sidebar-nav">{% admin_menu left_selection user %}</div>{% endblock %}
+{% block leftcol %}<div class="well">{% admin_menu left_selection user %}</div>{% endblock %}
 {% block apparea %}<div id="settings_content"></div>{% endblock %}
diff --git a/modoboa/core/templates/core/user_index.html b/modoboa/core/templates/core/user_index.html
index 9128e65b6..7cfcf632a 100644
--- a/modoboa/core/templates/core/user_index.html
+++ b/modoboa/core/templates/core/user_index.html
@@ -17,5 +17,5 @@ $(document).ready(function() {
 });
 </script>
 {% endblock %}
-{% block leftcol %}<div class="well sidebar-nav">{% uprefs_menu left_selection user %}</div>{% endblock %}
+{% block leftcol %}<div class="well">{% uprefs_menu left_selection user %}</div>{% endblock %}
 {% block apparea %}<div id="uprefs_content"></div>{% endblock %}
diff --git a/modoboa/core/templatetags/core_tags.py b/modoboa/core/templatetags/core_tags.py
index 1c2c79552..1b05e4b5d 100644
--- a/modoboa/core/templatetags/core_tags.py
+++ b/modoboa/core/templatetags/core_tags.py
@@ -63,7 +63,7 @@ def admin_menu(selection, user):
     ]
     return render_to_string('common/menu.html', {
         "entries": entries,
-        "css": "nav nav-list",
+        "css": "nav nav-pills nav-stacked",
         "selection": selection,
         "user": user
     })
@@ -111,7 +111,7 @@ def uprefs_menu(selection, user):
     entries = sorted(entries, key=lambda e: e["label"])
     return render_to_string('common/menu.html', {
         "entries": entries,
-        "css": "nav nav-list",
+        "css": "nav nav-pills nav-stacked",
         "selection": selection,
         "user": user
     })
diff --git a/modoboa/extensions/admin/templates/admin/listing.html b/modoboa/extensions/admin/templates/admin/listing.html
index c08435d2b..73a65d8b4 100644
--- a/modoboa/extensions/admin/templates/admin/listing.html
+++ b/modoboa/extensions/admin/templates/admin/listing.html
@@ -10,14 +10,12 @@ var admin;
 </script>
 {% endblock %}
 {% block leftcol %}<div class="well">
-  <ul class="nav">
-      <div class="side-bar-responsive">
-        <li class="nav-header">{% trans "Filter" %}</li>
-        <li>{% include "admin/searchform.html" %}</li>
-        <li id="taglist"></li>
-        <li class="nav-header">{% trans "Actions" %}</li>
-        {% block actions %}{% endblock %}
-      </div>
+  <ul class="nav nav-pills nav-stacked">
+    <li class="nav-header">{% trans "Filter" %}</li>
+    <li>{% include "admin/searchform.html" %}</li>
+    <li id="taglist"></li>
+    <li class="nav-header">{% trans "Actions" %}</li>
+    {% block actions %}{% endblock %}
   </ul>
 </div>
 {% get_extra_admin_content user "leftcol" selection %}
diff --git a/modoboa/extensions/limits/templates/limits/poolusage.html b/modoboa/extensions/limits/templates/limits/poolusage.html
index 2a3e774b8..ee31148d1 100644
--- a/modoboa/extensions/limits/templates/limits/poolusage.html
+++ b/modoboa/extensions/limits/templates/limits/poolusage.html
@@ -1,6 +1,6 @@
 {% load i18n lib_tags %}
-<div class="well sidebar-nav">
-  <ul class="nav nav-list">
+<div class="well">
+  <ul class="nav nav-pills nav-stacked">
     <li class="nav-header">{% trans "Resources usage" %}</li>{% for l in limits %}
     <li class="resource">
       {{ l.label }} ({{ l }})
diff --git a/modoboa/extensions/sievefilters/templates/sievefilters/index.html b/modoboa/extensions/sievefilters/templates/sievefilters/index.html
index 0277824b0..a0500f0f9 100644
--- a/modoboa/extensions/sievefilters/templates/sievefilters/index.html
+++ b/modoboa/extensions/sievefilters/templates/sievefilters/index.html
@@ -71,7 +71,7 @@ $(document).ready(function() {
 </script>
 {% endblock %}
 {% block leftcol %}
-<div class="well sidebar-nav">
+<div class="well">
   <ul id="menu" class="nav nav-pills nav-stacked">
     <li class="nav-header">{% trans "Filter sets" %}</li>
     <li class="form-group col-lg-11 col-md-11 col-sm-11">
diff --git a/modoboa/extensions/sievefilters/views.py b/modoboa/extensions/sievefilters/views.py
index c24fe8d39..962f32217 100644
--- a/modoboa/extensions/sievefilters/views.py
+++ b/modoboa/extensions/sievefilters/views.py
@@ -91,7 +91,7 @@ def getfs(request, name):
             fs=content
         ))
 
-    menu = '<ul id="fsetmenu" class="nav nav-list"><li class="nav-header">%s</li>%s</ul>' % \
+    menu = '<ul id="fsetmenu" class="nav nav-pills nav-stacked"><li class="nav-header">%s</li>%s</ul>' % \
         (_("Actions"), fset_menu(editormode, name))
     resp = dict(menu=menu, content=htmlcontent)
     return render_to_json_response(resp)
diff --git a/modoboa/extensions/stats/templates/stats/index.html b/modoboa/extensions/stats/templates/stats/index.html
index 0b3abf2c6..17ee3badc 100644
--- a/modoboa/extensions/stats/templates/stats/index.html
+++ b/modoboa/extensions/stats/templates/stats/index.html
@@ -25,44 +25,42 @@ $(document).ready(function() {
 </script>
 {% endblock %}
 {% block leftcol %}
-<div id="periods" class="well sidebar-nav">
-  <ul class="nav nav-list">
-      <div class="side-bar-responsive">
-            <li class="nav-header">
-              {% trans "Filter" %}
-            </li>
-            <li>
-              <div class="input-group">
-                <span class="input-group-addon"><i class="glyphicon glyphicon-search"></i></span>
-                <input class="col-lg-10 form-control" id="searchquery" type="text" value="{% trans 'Search a domain' %}">
+<div id="periods" class="well">
+  <ul class="nav nav-pills nav-stacked">
+        <li class="nav-header">
+          {% trans "Filter" %}
+        </li>
+        <li>
+          <div class="input-group">
+            <span class="input-group-addon"><i class="glyphicon glyphicon-search"></i></span>
+            <input class="form-control" id="searchquery" type="text" value="{% trans 'Search a domain' %}">
+          </div>
+        </li>
+        <li class="nav-header">
+          {% trans "Predefined time ranges" %}
+        </li>
+        {% for p in periods %}<li class="period">
+          <a href="#" class="period_selector" data-period="{{ p.name }}">{% trans p.label %}</a>
+        </li>
+        {% endfor %}
+        <li class="nav-header">
+                {% trans "Custom time range" %}
+        </li>
+        <li>
+          <form class="form-horizontal">
+            <span id="custom-period">
+              <div class="input-group input-group-sm">
+                <div class="input-group-addon"><i class="glyphicon glyphicon-indent-left"></i></div>
+                <input id="id_from" class="col-lg-10 form-control" name="date_from" value="{{ start }}" type="text" readonly="readonly" />
               </div>
-            </li>
-            <li class="nav-header">
-              {% trans "Predefined time ranges" %}
-            </li>
-            {% for p in periods %}<li class="period">
-              <a href="#" class="period_selector" data-period="{{ p.name }}">{% trans p.label %}</a>
-            </li>
-            {% endfor %}
-            <li class="nav-header">
-              {% trans "Custom time range" %}
-            </li>
-            <li>
-              <form class="form-horizontal">
-                <span id="custom-period">
-                  <div class="input-group input-group-sm">
-                    <div class="input-group-addon"><i class="glyphicon glyphicon-indent-left"></i></div>
-                    <input id="id_from" class="col-lg-10 form-control" name="date_from" value="{{ start }}" type="text" readonly="readonly" />
-                  </div>
-                  <div class="input-group input-group-sm">
-                    <div class="input-group-addon"><i class="glyphicon glyphicon-indent-right"></i></div>
-                    <input id="id_to" class="col-lg-10 form-control" name="date_to" value="{{ end }}" type="text" readonly="readonly" />
-                  </div>
-                  <button class="btn btn-primary" id="customsend">{% trans "Apply" %}</button>
-                </span>
-              </form>
-            </li>
-        </div>
+              <div class="input-group input-group-sm">
+                <div class="input-group-addon"><i class="glyphicon glyphicon-indent-right"></i></div>
+                <input id="id_to" class="col-lg-10 form-control" name="date_to" value="{{ end }}" type="text" readonly="readonly" />
+              </div>
+              <button class="btn btn-primary pull-right" id="customsend">{% trans "Apply" %}</button>
+            </span>
+          </form>
+        </li>
       </ul>
     </div>
     {% endblock %}
diff --git a/modoboa/extensions/webmail/static/webmail/css/webmail.css b/modoboa/extensions/webmail/static/webmail/css/webmail.css
index e83cdbb14..bce397e78 100644
--- a/modoboa/extensions/webmail/static/webmail/css/webmail.css
+++ b/modoboa/extensions/webmail/static/webmail/css/webmail.css
@@ -94,10 +94,6 @@ body, html {
     overflow: auto;
 }
 
-#mboxes_container .nav-list .nav-list {
-    padding-right: 0;
-}
-
 #mboxes_container a[name=loadfolder] {
     white-space: nowrap;
     overflow: hidden;
@@ -178,10 +174,6 @@ td[name="date"] {
     margin-bottom: 0px;
 }
 
-#folders li {
-    position: relative;
-}
-
 div.clickbox {
     position: absolute;
     left: 0px;
diff --git a/modoboa/extensions/webmail/static/webmail/js/webmail.js b/modoboa/extensions/webmail/static/webmail/js/webmail.js
index 5e3bcd783..29022d443 100644
--- a/modoboa/extensions/webmail/static/webmail/js/webmail.js
+++ b/modoboa/extensions/webmail/static/webmail/js/webmail.js
@@ -428,7 +428,7 @@ Webmail.prototype = {
     inject_mailboxes: function($parent, mboxes) {
         var $ul = $("<ul />", {
             name: $parent.attr("name"),
-            'class': "hidden nav nav-list"
+            'class': "hidden nav nav-pills nav-stacked"
         });
         var $plink = $parent.children("a");
 
diff --git a/modoboa/extensions/webmail/templates/webmail/folder.html b/modoboa/extensions/webmail/templates/webmail/folder.html
index 154008be6..c71daa85d 100644
--- a/modoboa/extensions/webmail/templates/webmail/folder.html
+++ b/modoboa/extensions/webmail/templates/webmail/folder.html
@@ -2,7 +2,7 @@
 {% load i18n webmail_tags %}
 {% block extrafields %}
 <div id="folders2" class="well">
-  <ul class="nav nav-list">
+  <ul class="nav nav-pills nav-stacked">
     <li class="nav-header">{% trans "Parent mailbox" %}</li>
     {% print_mailboxes mboxes selected withunseen selectonly hdelimiter %}
   </ul>
diff --git a/modoboa/extensions/webmail/templates/webmail/folders.html b/modoboa/extensions/webmail/templates/webmail/folders.html
index 37feb2064..c37f3d088 100644
--- a/modoboa/extensions/webmail/templates/webmail/folders.html
+++ b/modoboa/extensions/webmail/templates/webmail/folders.html
@@ -1,6 +1,6 @@
 {% load i18n webmail_tags %}
 <div id="mboxes_container">
-  <ul class="nav nav-list">
+  <ul class="nav nav-pills nav-stacked">
     <li class="nav-header">{% trans "Mailboxes" %}</li>
     {% print_mailboxes mboxes selected withunseen %}
   </ul>
diff --git a/modoboa/extensions/webmail/templates/webmail/index.html b/modoboa/extensions/webmail/templates/webmail/index.html
index cebac040d..f9ff16091 100644
--- a/modoboa/extensions/webmail/templates/webmail/index.html
+++ b/modoboa/extensions/webmail/templates/webmail/index.html
@@ -33,7 +33,7 @@ $(document).ready(function() {
 {% block fixed_content %}
 <div class="row">
     <div id="leftcol" class="col-lg-2 col-md-3 col-ms-3 col-xs-0">
-      <div id="folders" class="well sidebar-nav">{{ mboxes }}</div>
+      <div id="folders" class="well">{{ mboxes }}</div>
     </div>
     <div id="rightcol" class="col-lg-10 col-md-12 col-ms-12 col-xs-12">
         <div id="menubar" class="col-lg-12 col-md-12 col-ms-12 col-xs-12"></div>
diff --git a/modoboa/extensions/webmail/templatetags/webmail_tags.py b/modoboa/extensions/webmail/templatetags/webmail_tags.py
index 84184b248..12ba022ab 100644
--- a/modoboa/extensions/webmail/templatetags/webmail_tags.py
+++ b/modoboa/extensions/webmail/templatetags/webmail_tags.py
@@ -173,7 +173,7 @@ def print_mailboxes(tree, selected=None, withunseen=False, selectonly=False, hde
        extra_attrs, iclass, label)
 
         if "sub" in mbox and len(mbox["sub"]):
-            result += "<ul name='%s' class='nav nav-list %s'>" % (mbox["path"], ul_state) \
+            result += "<ul name='%s' class='nav nav-pills nav-stacked %s'>" % (mbox["path"], ul_state) \
                 + print_mailboxes(mbox["sub"], selected, withunseen, selectonly, hdelimiter) + "</ul>\n"
         result += "</li>\n"
     return result
diff --git a/modoboa/static/css/custom.css b/modoboa/static/css/custom.css
index 4420b4e3d..4ac6e867f 100644
--- a/modoboa/static/css/custom.css
+++ b/modoboa/static/css/custom.css
@@ -65,19 +65,6 @@
      text-decoration: none;
  }
 
- /* links */
- a{
-     color: #0088CC;
- }
-
- a:hover{
-     color: #0088CC;
- }
-
- div.container-fluid div.row-fluid div.col-md-2 div.well ul.nav div.side-bar-responsive li a{
-     color: #0088CC;
- }
-
  /* Colapse Nav */
 
  .navbar-inverse .navbar-toggle {
@@ -220,38 +207,14 @@ label{
 
  /*left navSideBar */
 
-div.container-fluid div.well{
-    padding:0;
-}
-
-.container-fluid .well .side-bar-responsive{
-    padding:16px;
-}
-
 .nav-header {
     color: #959595;
     font-size: 12px;
     font-weight: 700;
     letter-spacing: 1px;
     text-transform: uppercase;
-    margin-top:10px;
-    margin-left: 6px;
 }
 
-.container-fluid .well .nav li{
-    display: block;
-}
-
-.container-fluid .well .nav > li > a:hover,
-.container-fluid .well .nav > li > a:focus{
-    background-color: #0088CC;
-    color:white;
-    border-radius: 5px;
-}
-div.container-fluid div.row-fluid .well  div.side-bar-responsive li:hover a{
-    color: #428BCA;
-    text-decoration: none;
-}
 .well ul.nav li a i.glyphicon{
     color:black;
     margin-right: 7px;