Adds some icon for a better UX

Gregg · Aug 26, 2013 · 7a88899 · 7a88899
1 parent d433acc
commit 7a88899
Show file tree

Hide file tree

Showing 4 changed files with 46 additions and 4 deletions.
diff --git a/app/views/layouts/administration.html.erb b/app/views/layouts/administration.html.erb
@@ -59,15 +59,18 @@
       <div class='span2'>
         <div class='well' style='padding: 28px 0'>
           <ul class='nav nav-list'>
-            <li class='nav-header'>
+            <li class='nav-header'><i class='icon icon-home'></i>
               <%= _("Home") %>
             </li>
             <li class='<%= "active" if controller.controller_name == 'dashboard' %>'>
               <%= link_to _('Dashboard'), {:controller => 'admin/dashboard'} %>              
             </li>
             <li class="divider"></li>
             <% for pm in current_user.project_modules %>
-            <%= content_tag :li, _(pm.menus.first.name), :class => "nav-header" %>
+            <li class="nav-header">
+              <i class='icon icon-<%= pm.name %>'></i>
+              <%= _(pm.menus.first.name) %>
+            </li>            
               <%= subtabs_for(pm.name.to_sym)%>
               <li class="divider"></li>
             <% end %>

diff --git a/public/images/admin/glyphicons-halflings.png b/public/images/admin/glyphicons-halflings.png
diff --git a/public/stylesheets/administration_structure.css b/public/stylesheets/administration_structure.css
@@ -162,4 +162,43 @@ a.delete:focus {
   border-radius: 0px !important;
   border-collapse: collapse !important;
   background-image: none !important;
+}
+
+/* Classes for menu icons */
+
+.icon-articles {
+  background-position: 0 -72px;
+}
+
+.icon-pages {
+  background-position: -408px -120px;
+  width: 16px;
+
+}
+.icon-notes {
+  background-position: -264px -24px;
+}
+
+.icon-media {
+  background-position: -456px -48px;
+}
+
+.icon-users {
+  background-position: -168px 0;
+}
+
+.icon-themes {
+  background-position: -96px -120px;
+}
+
+.icon-seo {
+  background-position: -24px -72px;
+}
+
+.icon-settings {
+  background-position: -432px 0;
+}
+
+.icon-profile {
+  background-position: -240px 0;
 }
diff --git a/public/stylesheets/bootstrap.css b/public/stylesheets/bootstrap.css
@@ -2429,7 +2429,7 @@ input[type="submit"].btn.btn-mini {
   *margin-right: .3em;
   line-height: 14px;
   vertical-align: text-top;
-  background-image: url("../img/glyphicons-halflings.png");
+  background-image: url("../images/admin/glyphicons-halflings.png");
   background-position: 14px 14px;
   background-repeat: no-repeat;
   margin-top: 1px;
@@ -2452,7 +2452,7 @@ input[type="submit"].btn.btn-mini {
 .dropdown-submenu:focus > a > [class^="icon-"],
 .dropdown-submenu:hover > a > [class*=" icon-"],
 .dropdown-submenu:focus > a > [class*=" icon-"] {
-  background-image: url("../img/glyphicons-halflings-white.png");
+  background-image: url("../images/admin/glyphicons-halflings-white.png");
 }
 .icon-glass {
   background-position: 0      0;