[copr] master: The horizontal menu is better off with list then divs. (d0ea78d)

bkabrda at fedoraproject.org bkabrda at fedoraproject.org
Tue Jan 22 07:02:22 UTC 2013


Repository : http://git.fedorahosted.org/cgit/copr.git

On branch  : master

>---------------------------------------------------------------

commit d0ea78df4639dfe7a98ef7d3507a9ef15bef2b51
Author: Bohuslav Kabrda <bkabrda at redhat.com>
Date:   Tue Jan 22 08:01:15 2013 +0100

    The horizontal menu is better off with list then divs.


>---------------------------------------------------------------

 coprs_frontend/coprs/static/copr.js              |   11 +++++-
 coprs_frontend/coprs/static/style-new.css        |   21 +++++++----
 coprs_frontend/coprs/templates/coprs/detail.html |   40 +++++++++++----------
 3 files changed, 44 insertions(+), 28 deletions(-)

diff --git a/coprs_frontend/coprs/static/copr.js b/coprs_frontend/coprs/static/copr.js
index a6221da..8271b08 100644
--- a/coprs_frontend/coprs/static/copr.js
+++ b/coprs_frontend/coprs/static/copr.js
@@ -7,5 +7,14 @@ $(document).ready(function () {
 
 // build detail menu arrow slider
 $(document).ready(function() {
-  $("div.horizontal-menu div a").hover(function() { $(this).toggleClass('pink-arrow'); });
+  $("div.horizontal-menu li").hover(
+    function() {
+      $("div.horizontal-menu li.selected").removeClass('selected').addClass('left-for-now');
+      $(this).toggleClass('hovered');
+    },
+    function() {
+      $("div.horizontal-menu li.left-for-now").removeClass('left-for-now').addClass('selected');
+      $(this).toggleClass('hovered');
+    }
+  );
 });
diff --git a/coprs_frontend/coprs/static/style-new.css b/coprs_frontend/coprs/static/style-new.css
index 8848d1f..a014c68 100644
--- a/coprs_frontend/coprs/static/style-new.css
+++ b/coprs_frontend/coprs/static/style-new.css
@@ -175,23 +175,28 @@ div.horizontal-menu a {
   color: #4d4d4d;
 }
 
-div.horizontal-menu div.selected a {
+div.horizontal-menu ul {
+  margin: 0px;
+  padding: 0px;
+  float: left;
+}
+
+div.horizontal-menu li {
+  display: inline;
+  float: left;
+}
+
+div.horizontal-menu li.selected a, div.horizontal-menu li.left-for-now a {
   color: #db3279;
   margin-left: auto;
   margin-right: auto;
 }
 
-div.horizontal-menu div.selected, div.horizontal-menu a.pink-arrow {
+div.horizontal-menu li.selected a, div.horizontal-menu li.hovered a {
   background: url("pink_arrow.png") no-repeat;
   background-position: center bottom;
 }
 
-div.horizontal-menu div.selected, div.horizontal-menu div.unselected {
-  margin-right: 1em;
-  display: inline;
-  float: left;
-}
-
 div.pkg-url-list {
   white-space: pre;
   background-color: #f9f9f9;
diff --git a/coprs_frontend/coprs/templates/coprs/detail.html b/coprs_frontend/coprs/templates/coprs/detail.html
index acf45aa..04c4c2a 100644
--- a/coprs_frontend/coprs/templates/coprs/detail.html
+++ b/coprs_frontend/coprs/templates/coprs/detail.html
@@ -6,25 +6,27 @@
 {% block body %}
   <h1>{{ copr.owner.name }} / <strong>{{ copr.name }}</strong></h1>
   <div class="horizontal-menu">
-    <div class="{% block overview_selected %}unselected{% endblock %}">
-      <a href="{{ url_for('coprs_ns.copr_detail', username = copr.owner.name, coprname = copr.name) }}">Overview</a>
-    </div>
-    <div class="{% block permissions_selected %}unselected{% endblock %}">
-      <a href="{{ url_for('coprs_ns.copr_permissions', username = copr.owner.name, coprname = copr.name) }}">Permissions</a>
-    </div>
-    <div class="{% block builds_selected %}unselected{% endblock %}">
-      <a href="{{ url_for('coprs_ns.copr_builds', username = copr.owner.name, coprname = copr.name) }}">Builds</a>
-    </div>
-    {% if g.user and g.user.can_build_in(copr) %}
-      <div class="{% block new_build_selected %}unselected{% endblock %}">
-        <a href="{{ url_for('coprs_ns.copr_add_build', username = copr.owner.name, coprname = copr.name) }}">New Build</a>
-      </div>
-    {% endif %}
-    {% if g.user and g.user.can_edit(copr) %}
-      <div class="{% block edit_selected %}unselected{% endblock %}">
-        <a href="{{ url_for('coprs_ns.copr_edit', username = copr.owner.name, coprname = copr.name) }}">Edit</a>
-      </div>
-    {% endif %}
+    <ul>
+      <li class="{% block overview_selected %}unselected{% endblock %}">
+        <a href="{{ url_for('coprs_ns.copr_detail', username = copr.owner.name, coprname = copr.name) }}">Overview</a>
+      </li>
+      <li class="{% block permissions_selected %}unselected{% endblock %}">
+        <a href="{{ url_for('coprs_ns.copr_permissions', username = copr.owner.name, coprname = copr.name) }}">Permissions</a>
+      </li>
+      <li class="{% block builds_selected %}unselected{% endblock %}">
+        <a href="{{ url_for('coprs_ns.copr_builds', username = copr.owner.name, coprname = copr.name) }}">Builds</a>
+      </li>
+      {% if g.user and g.user.can_build_in(copr) %}
+        <li class="{% block new_build_selected %}unselected{% endblock %}">
+          <a href="{{ url_for('coprs_ns.copr_add_build', username = copr.owner.name, coprname = copr.name) }}">New Build</a>
+        </li>
+      {% endif %}
+      {% if g.user and g.user.can_edit(copr) %}
+        <li class="{% block edit_selected %}unselected{% endblock %}">
+          <a href="{{ url_for('coprs_ns.copr_edit', username = copr.owner.name, coprname = copr.name) }}">Edit</a>
+        </li>
+      {% endif %}
+    </ul>
   </div>
   {% block detail_body %}{% endblock %}
 {% endblock %}



More information about the copr-devel mailing list