Commits

David Jean Louis  committed 3939459

cleaned menu css, separated theming to its own app, images are all in the same file now

  • Participants
  • Parent commits 63434ba

Comments (0)

Files changed (10)

File admin_tools/media/admin_tools/css/dashboard.css

 /* Dashboard general styles {{{ */
 
 .dashboard #content {
-    width: auto;
+    display: block;
+    width: auto; !important;
 }
 
 #dashboard {
     padding: 7px 5px 8px 8px;
     text-align: left;
     font-weight: normal;
-	background-image: url(../images/dashboard.png);
-	background-repeat: repeat-x;
-    background-position: 0 0px;
+	background: url(../images/admin-tools.png) repeat-x 0 -245px;
     height: 20px;
     color: #555;
 }
     width: 17px;
     margin: 0 0 0 5px;
     cursor: pointer;
-    background-image: url(../images/dashboard.png);
+    background-image: url(../images/admin-tools.png);
     background-repeat: no-repeat;
 }
 
 .dashboard-module h2 a.toggle-icon {
-    background-position: 0 -35px;
+    background-position: 0 -45px;
 }
 
 .dashboard-module h2 a.toggle-icon:hover {
-    background-position: 0 -55px;
+    background-position: 0 -65px;
 }
 
 .dashboard-module h2 a.toggle-icon.collapsed {
-    background-position: 0 -75px;
+    background-position: 0 -85px;
 }
 
 .dashboard-module h2 a.toggle-icon.collapsed:hover {
-    background-position: 0 -95px;
+    background-position: 0 -105px;
 }
 
 .dashboard-module h2 a.close-icon {
-    background-position: 0 -115px;
+    background-position: 0 -125px;
 }
 
 .dashboard-module h2 a.close-icon:hover {
-    background-position: 0 -135px;
+    background-position: 0 -145px;
 }
 
 .fixed h2 span.toggle-icon,
 .dashboard-module h3 {
     padding: 5px 10px;
     margin: 0;
-	background-color: #f4f4f4;
-    background-image: url(../images/dashboard.png);
-    background-repeat: no-repeat;
-    background-position: 0 -175px;
+    background: transparent url(../images/admin-tools.png) repeat-x 0 -325px;
     text-indent: 12px;
+    height: 22px;
 }
 
 .dashboard-module h3 a {
 
 .dashboard-module ul li {
     vertical-align: top;
-    padding: 6px 8px 4px 8px;
-    line-height: 22px;
+    padding: 5px 8px;
+    line-height: 20px;
 }
 
 .dashboard-module ul li.odd {
-	background-color: #f4f4f4;
+    background: transparent url(../images/admin-tools.png) repeat-x 0 -325px;
 }
 
 .dashboard-module ul li.even {
-	background-color: #ffffff;
+    background: transparent url(../images/admin-tools.png) repeat-x 0 -285px;
 }
 
 .dashboard-module ul li a.external-link {
-    background-image: url(../images/dashboard.png);
+    background-image: url(../images/admin-tools.png);
     background-repeat: no-repeat;
-    background-position: -5px -158px;
+    background-position: -5px -168px;
     padding-left: 15px;
 }
 
 }
 
 .dashboard-module ul li:hover {
-    background-color: #fffff4;
+    background: #fffff4;
 }
 
 /* }}} */

File admin_tools/media/admin_tools/css/menu.css

-/** 
- * theming styles: 
- * todo: menu.css externalize this in the theming app
- */
+/* menu styles */
+
 
 #header {
-    overflow: hidden;
-    height: auto;
-    background: url(../images/menu.png) 0 -135px repeat-x;
+    overflow: visible;
 }
 
-#header h1 {
-    text-indent: -9999px;
-    margin: 5px 10px;
-    background: url(../images/django.png) 0 0 no-repeat;
+#header #branding h1 {
+    margin: 0;
+    padding: 5px 10px;
     height: 31px;
-    width: 93px;
 }
 
-#header #user-tools {
-    padding-right: 10px;
-}
-
-#container .breadcrumbs {
-    display: block;
-    padding: 10px 15px;
-    border: 0;
-    background-position: 0 -8px;
-    border-bottom: 1px solid #ededed;
-}
-
-#container .breadcrumbs a {
-    position: relative;
-    float: none;
-    margin: 0;
-    padding: 0;
-}
-
-/* menu styles */
-
 #header #navigation-wrapper {
-    border: 1px solid #ededed;
-    border-width: 1px 0 0 0;
-    background: url(../images/menu.png) 0 0 repeat-x;
-    display: block;
-    clear: both;
+    background: red url(../images/admin-tools.png) 0 -205px repeat-x;
     height: 35px;
+    z-index: 9999;
 }
 
 #header #navigation-wrapper ul {
 
 #header #navigation-wrapper ul li {
     list-style: none;
-}
-
-#header #navigation-wrapper ul.menu {
-    position: absolute;
-}
-
-#header #navigation-wrapper ul.menu:after {
-    content: ".";
-    display: block;
-    height: 0;
-    clear: both;
-    visibility: hidden;
+    position: relative;
 }
 
 #header #navigation-wrapper ul.menu li {
     float: left;
-    position: relative;
 }
 
 #header #navigation-wrapper ul.menu li a {
-    float: left;
+    display: block;
     text-transform: uppercase;
     text-decoration: none;
-    margin: 0;
     padding: 9px 15px;
     border-right: 1px solid #ededed;
-    color: #666;
+    color: #555;
 }
 
 #header #navigation-wrapper ul.menu li.first a {
     margin-left: 12px;
-    background: url(../images/menu.png) 0 -95px no-repeat;
+    background: transparent url(../images/admin-tools.png) 0 -380px no-repeat;
     text-indent: 14px;
 }
 
 
 #header #navigation-wrapper ul.menu li:hover,
-#header #navigation-wrapper ul.menu li.hover {
-    background: url(../images/menu.png) repeat-x 0 -40px;
-}
-
-#header #navigation-wrapper ul.menu li a.active {
-    color: #6389b8;
-    background: url(../images/admin.png) -320px -358px no-repeat;
+#header #navigation-wrapper ul.menu li.hover,
+#header #navigation-wrapper ul.menu li.active {
+    background: url(../images/admin-tools.png) repeat-x 0 -245px;
 }
 
 #header #navigation-wrapper ul li span.icon {
-    display: block;
     float: right;
     width: 20px;
     height: 10px;
-    background: url(../images/menu.png) no-repeat 0 -75px;
+    background: transparent url(../images/admin-tools.png) no-repeat 0 -360px;
 }
 
 #header #navigation-wrapper ul.menu li ul {
     position: absolute;
     top: 100%;
     left: 0;
-    background: #fff;
-}
-
-#header #navigation-wrapper ul.menu li ul li ul {
-    left: 100%;
-    top: -1px;
-}
-
-#header #navigation-wrapper ul li ul li a em {
-    display: none;
+    margin-left: -1px;
+    margin-top: -1px;
 }
 
 #header #navigation-wrapper ul.menu li ul li {
-    position: relative;
-    display: block;
+    padding: 0;
     float: none;
     background: none;
-    border: 1px solid #ededed;
-    border-width: 0 1px 1px 1px;
-    min-width: 170px;
-}
-
-#header #navigation-wrapper ul.menu li ul li ul {
-    border-top: 1px solid #ededed;
-}
-
-#header #navigation-wrapper ul.menu li ul li.first {
-    margin: 0;
 }
 
 #header #navigation-wrapper ul.menu li ul li a {
     float: none;
     display: block;
-    color: #666 !important;
-    border: 0;
-    padding: 7px 20px 7px 16px;
+    border: 1px solid #ededed;
+    border-width: 0 1px 1px 1px;
+    text-transform: none;
+    min-width: 170px;
+    margin: 0;
+}
+
+#header #navigation-wrapper ul.menu li ul li ul {
+    left: 100%;
+    top: 0;
+    border-top: 1px solid #ededed;
+}
+
+#header #navigation-wrapper ul.menu li ul li ul li a {
     white-space: nowrap;
-    text-transform: none;
-    background-color: #fafafa;
-    background-image: none;
 }
 
 #header #navigation-wrapper ul li ul li span.icon {
-    background-position: 0 -85px;
-    margin: -14px -10px 0 0;
-}
-
-#header #navigation-wrapper ul.menu li:hover ul,
-#header #navigation-wrapper ul.menu li.hover ul {
-    display: block;
+    background-position: 0 -370px;
 }
 
 #header #navigation-wrapper ul.menu li:hover ul li ul,
     display: none;
 }
 
+#header #navigation-wrapper ul.menu li:hover ul,
+#header #navigation-wrapper ul.menu li.hover ul,
 #header #navigation-wrapper ul.menu li ul li:hover ul,
 #header #navigation-wrapper ul.menu li ul li.hover ul {
     display: block;
 }
 
 #header #navigation-wrapper ul.menu li:hover ul li,
-#header #navigation-wrapper ul.menu li.hover ul li {
-    background: none;
+#header #navigation-wrapper ul.menu li.hover ul li,
+#header #navigation-wrapper ul.menu li ul li:hover ul li,
+#header #navigation-wrapper ul.menu li ul li.hover ul li {
+    background: transparent url(../images/admin-tools.png) repeat-x 0 -285px;
 }
 
-#header #navigation-wrapper ul.menu li ul li:hover a,
-#header #navigation-wrapper ul.menu li ul li.hover a {
-    background: #f3f3f4;
+#header #navigation-wrapper ul.menu li ul li:hover,
+#header #navigation-wrapper ul.menu li ul li.hover,
+#header #navigation-wrapper ul.menu li ul li ul li:hover,
+#header #navigation-wrapper ul.menu li ul li ul li.hover {
+    background: transparent url(../images/admin-tools.png) repeat-x 0 -245px;
 }
-
-#header #navigation-wrapper ul.menu li ul li:hover ul li a,
-#header #navigation-wrapper ul.menu li ul li.hover ul li a {
-    background: none;
-}
-
-#header #navigation-wrapper ul.menu li ul li ul li:hover a,
-#header #navigation-wrapper ul.menu li ul li ul li.hover a {
-    background: #f3f3f4;
-}

File admin_tools/media/admin_tools/css/theming.css

-/* header logo and user tools */
+/** 
+ * theming styles
+ * 
+ */
 
 #header {
-    overflow: visible;
-    height: auto;
-    background-color: #fff;
+    background: url(../images/admin-tools.png) 0 0 repeat-x;
 }
 
-#header #branding {
-    border: 1px solid #ededed;
-    border-width: 1px 0;
+#header #branding h1 {
     margin: 0;
-    background: url(../images/admin.png) 0 0 repeat-x;
+    padding: 5px 10px;
+    text-indent: -9999px;
+    background: transparent url(../images/django.png) 10px 5px no-repeat;
+    height: 31px;
+    width: 93px;
 }
 
-#header #branding a {
+div.breadcrumbs {
     display: block;
-    height: 32px;
-    width: 105px;
-    background: transparent url(../images/admin.png) 0 -122px no-repeat;
+    padding: 10px 15px;
+    border: 0;
+    background-position: 0 -8px;
+    border-bottom: 1px solid #ededed;
 }
 
-#header #branding a h1 span {
-    display: none;
+div.breadcrumbs a {
+    display: inline;
 }
-
-#header #user-tools {
-    color: #656565;
-    font-size: 12px;
-    padding: 10px;
-}
-
-#header #user-tools a:link, #header #user-tools a:visited {
-    color: #5b80b2;
-    text-decoration: none;
-}

File admin_tools/media/admin_tools/images/admin-tools.png

Added
New image

File admin_tools/media/admin_tools/images/admin.png

Removed
Old image

File admin_tools/media/admin_tools/images/dashboard.png

Removed
Old image

File admin_tools/media/admin_tools/images/menu.png

Removed
Old image

File admin_tools/theming/templates/admin/base.html

+{% load theming_tags %}
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" lang="{{ LANGUAGE_CODE }}" xml:lang="{{ LANGUAGE_CODE }}" {% if LANGUAGE_BIDI %}dir="rtl"{% endif %}>
+<head>
+<title>{% block title %}{% endblock %}</title>
+<link rel="stylesheet" type="text/css" href="{% block stylesheet %}{% load adminmedia %}{% admin_media_prefix %}css/base.css{% endblock %}" />
+{% block extrastyle %}{% endblock %}
+<!--[if lte IE 7]><link rel="stylesheet" type="text/css" href="{% block stylesheet_ie %}{% load adminmedia %}{% admin_media_prefix %}css/ie.css{% endblock %}" /><![endif]-->
+{% if LANGUAGE_BIDI %}<link rel="stylesheet" type="text/css" href="{% block stylesheet_rtl %}{% admin_media_prefix %}css/rtl.css{% endblock %}" />{% endif %}
+{% render_theming_css %}
+{% block extrahead %}{% endblock %}
+{% block blockbots %}<meta name="robots" content="NONE,NOARCHIVE" />{% endblock %}
+</head>
+{% load i18n %}
+
+<body class="{% if is_popup %}popup {% endif %}{% block bodyclass %}{% endblock %}">
+
+<!-- Container -->
+<div id="container">
+
+    {% if not is_popup %}
+    <!-- Header -->
+    <div id="header">
+        <div id="branding">
+        {% block branding %}{% endblock %}
+        </div>
+        {% if user.is_authenticated and user.is_staff %}
+        <div id="user-tools">
+            {% trans 'Welcome,' %}
+            <strong>{% firstof user.first_name user.username %}</strong>.
+            {% block userlinks %}
+                {% url django-admindocs-docroot as docsroot %}
+                {% if docsroot %}
+                    <a href="{{ docsroot }}">{% trans 'Documentation' %}</a> /
+                {% endif %}
+                {% url admin:password_change as password_change_url %}
+                {% if password_change_url %}
+                    <a href="{{ password_change_url }}">
+                {% else %}
+                    <a href="{{ root_path }}password_change/">
+                {% endif %}
+                {% trans 'Change password' %}</a> /
+                {% url admin:logout as logout_url %}
+                {% if logout_url %}
+                    <a href="{{ logout_url }}">
+                {% else %}
+                    <a href="{{ root_path }}logout/">
+                {% endif %}
+                {% trans 'Log out' %}</a>
+            {% endblock %}
+        </div>
+        {% endif %}
+        {% block nav-global %}{% endblock %}
+    </div>
+    <!-- END Header -->
+    {% block breadcrumbs %}<div class="breadcrumbs"><a href="/">{% trans 'Home' %}</a>{% if title %} &rsaquo; {{ title }}{% endif %}</div>{% endblock %}
+    {% endif %}
+
+        {% if messages %}
+        <ul class="messagelist">{% for message in messages %}<li>{{ message }}</li>{% endfor %}</ul>
+        {% endif %}
+
+    <!-- Content -->
+    <div id="content" class="{% block coltype %}colM{% endblock %}">
+        {% block pretitle %}{% endblock %}
+        {% block content_title %}{% if title %}<h1>{{ title }}</h1>{% endif %}{% endblock %}
+        {% block content %}
+        {% block object-tools %}{% endblock %}
+        {{ content }}
+        {% endblock %}
+        {% block sidebar %}{% endblock %}
+        <br class="clear" />
+    </div>
+    <!-- END Content -->
+
+    {% block footer %}<div id="footer"></div>{% endblock %}
+</div>
+<!-- END Container -->
+
+</body>
+</html>

File admin_tools/theming/templatetags/__init__.py

Empty file added.

File admin_tools/theming/templatetags/theming_tags.py

+"""
+Theming template tags.
+
+To load the theming tags just do: ``{% load theming_tags %}``.
+"""
+
+import os.path
+from django import template
+from django.conf import settings
+
+register = template.Library()
+
+def render_theming_css():
+    """
+    Template tag that renders the needed css files for the theming app.
+    """
+    css = getattr(settings, 'ADMIN_TOOLS_THEMING_CSS', False)
+    if css:
+        css = os.path.join(settings.MEDIA_URL, css)
+    else:
+        css = os.path.join(
+            getattr(settings, 'ADMIN_TOOLS_MEDIA_URL', settings.MEDIA_URL),
+            'admin_tools',
+            'css',
+            'theming.css'
+        )
+    return '<link rel="stylesheet" type="text/css" media="screen" href="%s" />' % css
+register.simple_tag(render_theming_css)