Userbar now uses AwesomeFonts. #177

static/cranefly/css/cranefly.css

@@ -739,28 +739,25 @@ footer .container .credits p{margin-bottom:0;color:#555;font-size:90%}footer .co
 .navbar-header .navbar-inner .navbar-search-form .navbar-search-border>.extra .extra-form .control select{margin:0;width:100%}
 .navbar-header .navbar-inner .navbar-search-form .navbar-search-border>.extra .extra-form .control input[type="text"]{margin:0;width:282px}
 .navbar-header .navbar-inner .navbar-search-form .navbar-search-border>.extra .extra-form .control .checkbox{margin-bottom:-3px}
-.navbar-header .navbar-inner .navbar-search-form .navbar-search-border>.extra .form-actions{border-radius:0 0 2px;margin:0;margin-top:7px;margin-bottom:0;padding:8px}.navbar-header .navbar-inner .navbar-search-form .navbar-search-border>.extra .form-actions .btn{margin:0}
+.navbar-header .navbar-inner .navbar-search-form .navbar-search-border>.extra .form-actions{border-radius:0 0 2px;margin:0;margin-top:7px;margin-bottom:0;padding:8px}.navbar-header .navbar-inner .navbar-search-form .navbar-search-border>.extra .form-actions .btn{margin:0;color:#fff}
 .navbar-header .navbar-inner .navbar-search-form .navbar-search-border>.extra .form-actions a:link,.navbar-header .navbar-inner .navbar-search-form .navbar-search-border>.extra .form-actions a:visited{margin-left:7px;position:relative;top:1px;color:#999;font-weight:bold}
 .navbar-header .navbar-inner .navbar-search-form .navbar-search-border>.extra .form-actions a:active,.navbar-header .navbar-inner .navbar-search-form .navbar-search-border>.extra .form-actions a:hover{color:#333}
 .navbar-header .navbar-inner .navbar-blocks{margin-left:6px}.navbar-header .navbar-inner .navbar-blocks li{margin-left:6px}.navbar-header .navbar-inner .navbar-blocks li form{margin:0;padding:0}
-.navbar-header .navbar-inner .navbar-blocks li a:link,.navbar-header .navbar-inner .navbar-blocks li a:visited,.navbar-header .navbar-inner .navbar-blocks li .btn-link{background-color:#f8f8f8;border:1px solid #dadada;border-radius:3px;padding:5px 8px;margin-top:9px}.navbar-header .navbar-inner .navbar-blocks li a:link i,.navbar-header .navbar-inner .navbar-blocks li a:visited i,.navbar-header .navbar-inner .navbar-blocks li .btn-link i{opacity:.7;filter:alpha(opacity=70)}
-.navbar-header .navbar-inner .navbar-blocks li a:link .label,.navbar-header .navbar-inner .navbar-blocks li a:visited .label,.navbar-header .navbar-inner .navbar-blocks li .btn-link .label{background-color:#cf402e;margin-left:4px;padding-left:6px;padding-right:5px;position:relative;bottom:1px}
-.navbar-header .navbar-inner .navbar-blocks li a:hover,.navbar-header .navbar-inner .navbar-blocks li a:active,.navbar-header .navbar-inner .navbar-blocks li .btn-link:hover,.navbar-header .navbar-inner .navbar-blocks li .btn-link:active{background-color:#08c;border-color:#069}.navbar-header .navbar-inner .navbar-blocks li a:hover.danger,.navbar-header .navbar-inner .navbar-blocks li a:active.danger,.navbar-header .navbar-inner .navbar-blocks li .btn-link:hover.danger,.navbar-header .navbar-inner .navbar-blocks li .btn-link:active.danger{background-color:#cf402e;border-color:#a53325}
-.navbar-header .navbar-inner .navbar-blocks li a:hover.hot,.navbar-header .navbar-inner .navbar-blocks li a:active.hot,.navbar-header .navbar-inner .navbar-blocks li .btn-link:hover.hot,.navbar-header .navbar-inner .navbar-blocks li .btn-link:active.hot{background-color:#f89406;border-color:#c67605}
-.navbar-header .navbar-inner .navbar-blocks li a:hover.fresh,.navbar-header .navbar-inner .navbar-blocks li a:active.fresh,.navbar-header .navbar-inner .navbar-blocks li .btn-link:hover.fresh,.navbar-header .navbar-inner .navbar-blocks li .btn-link:active.fresh{background-color:#46a546;border-color:#378137}
-.navbar-header .navbar-inner .navbar-blocks li a:hover i,.navbar-header .navbar-inner .navbar-blocks li a:active i,.navbar-header .navbar-inner .navbar-blocks li .btn-link:hover i,.navbar-header .navbar-inner .navbar-blocks li .btn-link:active i{background-image:url("../img/glyphicons-halflings-white.png");opacity:1;filter:alpha(opacity=100)}
-.navbar-header .navbar-inner .navbar-blocks li a:hover .label,.navbar-header .navbar-inner .navbar-blocks li a:active .label,.navbar-header .navbar-inner .navbar-blocks li .btn-link:hover .label,.navbar-header .navbar-inner .navbar-blocks li .btn-link:active .label{background-color:#eee;color:#333}
-.navbar-header .navbar-inner .navbar-blocks li.user-profile a:link,.navbar-header .navbar-inner .navbar-blocks li.user-profile a:visited,.navbar-header .navbar-inner .navbar-blocks li.user-profile a:hover,.navbar-header .navbar-inner .navbar-blocks li.user-profile a:active{background:none;border:none;margin-right:8px;margin-top:5px;font-weight:bold;text-shadow:none}.navbar-header .navbar-inner .navbar-blocks li.user-profile a:link img,.navbar-header .navbar-inner .navbar-blocks li.user-profile a:visited img,.navbar-header .navbar-inner .navbar-blocks li.user-profile a:hover img,.navbar-header .navbar-inner .navbar-blocks li.user-profile a:active img{border-radius:3px;margin-right:6px;width:32px;height:32px;position:relative;bottom:1px}
+.navbar-header .navbar-inner .navbar-blocks li a:link,.navbar-header .navbar-inner .navbar-blocks li a:visited,.navbar-header .navbar-inner .navbar-blocks li .btn-link{background-color:#f8f8f8;border:1px solid #dfdfdf;border-radius:3px;padding:5px 0;margin-top:9px;min-width:30px;color:#555;text-align:center}.navbar-header .navbar-inner .navbar-blocks li a:link .label,.navbar-header .navbar-inner .navbar-blocks li a:visited .label,.navbar-header .navbar-inner .navbar-blocks li .btn-link .label{background-color:#cf402e;margin-left:4px;padding-left:6px;padding-right:5px;position:relative;bottom:1px}
+.navbar-header .navbar-inner .navbar-blocks li a:hover,.navbar-header .navbar-inner .navbar-blocks li a:active,.navbar-header .navbar-inner .navbar-blocks li .btn-link:hover,.navbar-header .navbar-inner .navbar-blocks li .btn-link:active{background-color:#08c;border-color:#069;color:#fff;text-shadow:0 1px 1px #069}.navbar-header .navbar-inner .navbar-blocks li a:hover.danger,.navbar-header .navbar-inner .navbar-blocks li a:active.danger,.navbar-header .navbar-inner .navbar-blocks li .btn-link:hover.danger,.navbar-header .navbar-inner .navbar-blocks li .btn-link:active.danger{background-color:#cf402e;border-color:#a53325;text-shadow:0 1px 1px #a53325}
+.navbar-header .navbar-inner .navbar-blocks li a:hover.hot,.navbar-header .navbar-inner .navbar-blocks li a:active.hot,.navbar-header .navbar-inner .navbar-blocks li .btn-link:hover.hot,.navbar-header .navbar-inner .navbar-blocks li .btn-link:active.hot{background-color:#f89406;border-color:#c67605;text-shadow:0 1px 1px #c67605}
+.navbar-header .navbar-inner .navbar-blocks li a:hover.fresh,.navbar-header .navbar-inner .navbar-blocks li a:active.fresh,.navbar-header .navbar-inner .navbar-blocks li .btn-link:hover.fresh,.navbar-header .navbar-inner .navbar-blocks li .btn-link:active.fresh{background-color:#46a546;border-color:#378137;text-shadow:0 1px 1px #378137}
+.navbar-header .navbar-inner .navbar-blocks li a:hover .label,.navbar-header .navbar-inner .navbar-blocks li a:active .label,.navbar-header .navbar-inner .navbar-blocks li .btn-link:hover .label,.navbar-header .navbar-inner .navbar-blocks li .btn-link:active .label{background-color:#fff;color:#08c}
+.navbar-header .navbar-inner .navbar-blocks li.user-profile a:link,.navbar-header .navbar-inner .navbar-blocks li.user-profile a:visited,.navbar-header .navbar-inner .navbar-blocks li.user-profile a:hover,.navbar-header .navbar-inner .navbar-blocks li.user-profile a:active{background:none;border:none;margin-right:8px;margin-top:5px;color:#222;font-weight:bold;text-shadow:none}.navbar-header .navbar-inner .navbar-blocks li.user-profile a:link img,.navbar-header .navbar-inner .navbar-blocks li.user-profile a:visited img,.navbar-header .navbar-inner .navbar-blocks li.user-profile a:hover img,.navbar-header .navbar-inner .navbar-blocks li.user-profile a:active img{border-radius:3px;margin-right:6px;width:32px;height:32px;position:relative;bottom:1px}
 .navbar-header .navbar-inner .navbar-compact{display:none}.navbar-header .navbar-inner .navbar-compact li.user-profile>a:link,.navbar-header .navbar-inner .navbar-compact li.user-profile>a:visited{-webkit-border-radius:0;-moz-border-radius:0;border-radius:0;margin-top:0;padding:14px;padding-top:10px;padding-bottom:8px}.navbar-header .navbar-inner .navbar-compact li.user-profile>a:link img,.navbar-header .navbar-inner .navbar-compact li.user-profile>a:visited img{margin-right:0;margin-left:6px}
 .navbar-header .navbar-inner .navbar-compact li.user-profile>a:link .caret-border,.navbar-header .navbar-inner .navbar-compact li.user-profile>a:visited .caret-border{background-color:#fbfbfb;border:1px solid #dfdfdf;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;margin-left:8px;padding:0 4px}.navbar-header .navbar-inner .navbar-compact li.user-profile>a:link .caret-border .caret,.navbar-header .navbar-inner .navbar-compact li.user-profile>a:visited .caret-border .caret{margin:0;padding:0;position:relative;top:13px}
 .navbar-header .navbar-inner .navbar-compact li.user-profile>a:hover,.navbar-header .navbar-inner .navbar-compact li.user-profile>a:active{background-color:#fbfbfb}.navbar-header .navbar-inner .navbar-compact li.user-profile>a:hover .caret-border,.navbar-header .navbar-inner .navbar-compact li.user-profile>a:active .caret-border{border-color:#999}
-.navbar-header .navbar-inner .navbar-compact li.user-profile.open .dropdown-toggle:link,.navbar-header .navbar-inner .navbar-compact li.user-profile.open .dropdown-toggle:visited,.navbar-header .navbar-inner .navbar-compact li.user-profile.open .dropdown-toggle:hover,.navbar-header .navbar-inner .navbar-compact li.user-profile.open .dropdown-toggle:focus{background-color:#fbfbfb}.navbar-header .navbar-inner .navbar-compact li.user-profile.open .dropdown-toggle:link .caret-border,.navbar-header .navbar-inner .navbar-compact li.user-profile.open .dropdown-toggle:visited .caret-border,.navbar-header .navbar-inner .navbar-compact li.user-profile.open .dropdown-toggle:hover .caret-border,.navbar-header .navbar-inner .navbar-compact li.user-profile.open .dropdown-toggle:focus .caret-border{background:#cf402e;border-color:#cf402e}.navbar-header .navbar-inner .navbar-compact li.user-profile.open .dropdown-toggle:link .caret-border .caret,.navbar-header .navbar-inner .navbar-compact li.user-profile.open .dropdown-toggle:visited .caret-border .caret,.navbar-header .navbar-inner .navbar-compact li.user-profile.open .dropdown-toggle:hover .caret-border .caret,.navbar-header .navbar-inner .navbar-compact li.user-profile.open .dropdown-toggle:focus .caret-border .caret{border-top-color:#fff}
+.navbar-header .navbar-inner .navbar-compact li.user-profile.open .dropdown-toggle:link,.navbar-header .navbar-inner .navbar-compact li.user-profile.open .dropdown-toggle:visited,.navbar-header .navbar-inner .navbar-compact li.user-profile.open .dropdown-toggle:hover,.navbar-header .navbar-inner .navbar-compact li.user-profile.open .dropdown-toggle:focus{background-color:#fbfbfb}.navbar-header .navbar-inner .navbar-compact li.user-profile.open .dropdown-toggle:link .caret-border,.navbar-header .navbar-inner .navbar-compact li.user-profile.open .dropdown-toggle:visited .caret-border,.navbar-header .navbar-inner .navbar-compact li.user-profile.open .dropdown-toggle:hover .caret-border,.navbar-header .navbar-inner .navbar-compact li.user-profile.open .dropdown-toggle:focus .caret-border{background:#cf402e;border-color:#cf402e;color:#fff;text-shadow:0 1px 1px #a53325}
 .navbar-header .navbar-inner .navbar-compact li.user-profile .dropdown-menu{border:none;border:1px solid #c5c5c5;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;-webkit-box-shadow:0 4px 3px rgba(85,85,85,0.7);-moz-box-shadow:0 4px 3px rgba(85,85,85,0.7);box-shadow:0 4px 3px rgba(85,85,85,0.7);margin:0;margin-top:-6px;margin-right:0;padding:4px 0;width:270px}.navbar-header .navbar-inner .navbar-compact li.user-profile .dropdown-menu:before{margin-right:11px}
 .navbar-header .navbar-inner .navbar-compact li.user-profile .dropdown-menu:after{border-bottom:6px solid #fff;margin-top:0;margin-right:11px}
 .navbar-header .navbar-inner .navbar-compact li.user-profile .dropdown-menu>li{margin:0;padding:0}.navbar-header .navbar-inner .navbar-compact li.user-profile .dropdown-menu>li .label{float:right;margin:0;margin-top:2px}
-.navbar-header .navbar-inner .navbar-compact li.user-profile .dropdown-menu>li a,.navbar-header .navbar-inner .navbar-compact li.user-profile .dropdown-menu>li .btn-link{-webkit-border-radius:0;-moz-border-radius:0;border-radius:0;clear:none;display:block;float:none;margin:0;padding:6px 12px;color:#333;font-weight:normal;text-align:left}.navbar-header .navbar-inner .navbar-compact li.user-profile .dropdown-menu>li a i,.navbar-header .navbar-inner .navbar-compact li.user-profile .dropdown-menu>li .btn-link i{opacity:1;filter:alpha(opacity=100)}
+.navbar-header .navbar-inner .navbar-compact li.user-profile .dropdown-menu>li a,.navbar-header .navbar-inner .navbar-compact li.user-profile .dropdown-menu>li .btn-link{-webkit-border-radius:0;-moz-border-radius:0;border-radius:0;clear:none;display:block;float:none;margin:0;padding:6px 12px;color:#333;font-weight:normal;text-align:left}.navbar-header .navbar-inner .navbar-compact li.user-profile .dropdown-menu>li a i,.navbar-header .navbar-inner .navbar-compact li.user-profile .dropdown-menu>li .btn-link i{margin-right:12px}
 .navbar-header .navbar-inner .navbar-compact li.user-profile .dropdown-menu>li a:link .label,.navbar-header .navbar-inner .navbar-compact li.user-profile .dropdown-menu>li .btn-link:link .label,.navbar-header .navbar-inner .navbar-compact li.user-profile .dropdown-menu>li a:active .label,.navbar-header .navbar-inner .navbar-compact li.user-profile .dropdown-menu>li .btn-link:active .label,.navbar-header .navbar-inner .navbar-compact li.user-profile .dropdown-menu>li a:visited .label,.navbar-header .navbar-inner .navbar-compact li.user-profile .dropdown-menu>li .btn-link:visited .label,.navbar-header .navbar-inner .navbar-compact li.user-profile .dropdown-menu>li a:hover .label,.navbar-header .navbar-inner .navbar-compact li.user-profile .dropdown-menu>li .btn-link:hover .label{background-color:#cf402e;float:right;color:#fff;text-shadow:0 1px 0 #7c261b}
-.navbar-header .navbar-inner .navbar-compact li.user-profile .dropdown-menu>li a:link,.navbar-header .navbar-inner .navbar-compact li.user-profile .dropdown-menu>li a:visited{opacity:.8;filter:alpha(opacity=80)}
 .navbar-header .navbar-inner .navbar-compact li.user-profile .dropdown-menu>li a:hover{background-color:#555;opacity:1;filter:alpha(opacity=100);color:#fff}
 .navbar-header .navbar-inner .navbar-compact li.user-profile .dropdown-menu>li .btn-link{background:none;border:none;width:100%}.navbar-header .navbar-inner .navbar-compact li.user-profile .dropdown-menu>li .btn-link:hover,.navbar-header .navbar-inner .navbar-compact li.user-profile .dropdown-menu>li .btn-link:active{background:#cf402e;opacity:1;filter:alpha(opacity=100);color:#fff;text-shadow:0 1px 0 #7c261b}
 .navbar-header .navbar-inner .navbar-compact li.user-profile .dropdown-menu>li .btn-link i{position:relative;top:0}
@@ -795,22 +792,15 @@ footer .breadcrumb li.active{color:#555}
 .form-container form.form-horizontal .form-actions{padding-left:200px}
 .form-container .form-actions{border-radius:0 0 3px 3px;margin:-20px;margin-top:10px}.form-container .form-actions .form-actions-protip{margin-left:14px;color:#555;font-weight:bold}
 textarea{resize:vertical}
-@media (min-width:1200px){.form-container.container-horizontal{margin:0 -21px;margin-bottom:20px}}.btn{background:none;background-color:#fbfbfb;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;font-weight:bold}.btn i{opacity:.6;filter:alpha(opacity=60);position:relative;bottom:1px}
-.btn:hover,.btn:active{background-color:#fff;border-color:#a6a6a6}.btn:hover i,.btn:active i{opacity:.9;filter:alpha(opacity=90)}
+@media (min-width:1200px){.form-container.container-horizontal{margin:0 -21px;margin-bottom:20px}}.btn{background:none;background-color:#fbfbfb;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;font-weight:bold}.btn i{position:relative;bottom:1px}
+.btn:hover,.btn:active{background-color:#fff;border-color:#a6a6a6;color:#333}
 .btn.btn-primary{background-color:#3c85a3;border-color:#357690;text-shadow:0 1px 0 #27576b}.btn.btn-primary:hover:enabled,.btn.btn-primary:active:enabled{background-color:#268eb9;border-color:#217ea4}
-.btn.btn-primary i{background-image:url("../img/glyphicons-halflings-white.png")}
 .btn.btn-info{background-color:#587987;border-color:#4e6b78;text-shadow:0 1px 0 #3a5059}.btn.btn-info:hover:enabled,.btn.btn-info:active:enabled{background-color:#478098;border-color:#3f7286}
-.btn.btn-info i{background-image:url("../img/glyphicons-halflings-white.png")}
 .btn.btn-success{background-color:#589358;border-color:#4e834e;text-shadow:0 1px 0 #2f6f2f}.btn.btn-success:hover:enabled,.btn.btn-success:active:enabled{background-color:#46a546;border-color:#3e933e}
-.btn.btn-success i{background-image:url("../img/glyphicons-halflings-white.png")}
 .btn.btn-warning{background-color:#e59119;border-color:#ce8217;text-shadow:0 1px 0 #ad6704}.btn.btn-warning:hover:enabled,.btn.btn-warning:active:enabled{background-color:#f89406;border-color:#df8505}
-.btn.btn-warning i{background-image:url("../img/glyphicons-halflings-white.png")}
 .btn.btn-danger{background-color:#cf402e;border-color:#ba3a29;text-shadow:0 1px 0 #902d20}.btn.btn-danger:hover:enabled,.btn.btn-danger:active:enabled{background-color:#e82c15;border-color:#d12813}
-.btn.btn-danger i{background-image:url("../img/glyphicons-halflings-white.png")}
 .btn.btn-inverse{background-color:#333;border-color:#262626;text-shadow:0 1px 0 #0d0d0d}.btn.btn-inverse:hover:enabled,.btn.btn-inverse:active:enabled{background-color:#262626;border-color:#1a1a1a}
-.btn.btn-inverse i{background-image:url("../img/glyphicons-halflings-white.png")}
 .btn.btn-link{background:none;border:none;opacity:.7;filter:alpha(opacity=70);color:#333}.btn.btn-link:hover:enabled,.btn.btn-link:active:enabled,.btn.btn-link:focus:enabled{opacity:.9;filter:alpha(opacity=90);text-decoration:none}
-.btn.btn-primary i,.btn.btn-info i,.btn.btn-success i,.btn.btn-warning i,.btn.btn-danger i,.btn.btn-inverse i,.btn.btn-link i{opacity:1;filter:alpha(opacity=100)}
 a.btn-link:hover,a.btn-link:active,a.btn-link:focus{opacity:.9;filter:alpha(opacity=90);color:#333;text-decoration:none}
 .pagination{margin:0;padding:0}.pagination .count{margin-right:10.5px;padding:4px 0;color:#999}
 .pagination ul{-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}.pagination ul li{float:left;margin:0;margin-right:4.666666666666667px;padding:0}.pagination ul li a:link,.pagination ul li a:visited{background-color:#fff;border:1px solid #f0f0f0;border-radius:3px;padding:3px 7px;color:#999}.pagination ul li a:link i,.pagination ul li a:visited i{opacity:.55;filter:alpha(opacity=55)}

static/cranefly/css/cranefly/buttons.less

@@ -7,9 +7,8 @@
   .box-shadow(none);
 
   font-weight: bold;
-  
+
   i {
-    .opacity(60);
     position: relative;
     bottom: 1px;
   }
@@ -17,10 +16,8 @@
   &:hover, &:active {
     background-color: @white;
     border-color: lighten(@grayLight, 5%);
-  
-    i {
-      .opacity(90);
-    }
+
+  	color: @grayDark;
   }
 
   &.btn-primary {
@@ -35,10 +32,6 @@
         border-color: darken(saturate(@bluePale, 20%), 5%);
       }
     }
-
-    i {
-      background-image: url("@{iconWhiteSpritePath}");
-    }
   }
 
   &.btn-info {
@@ -53,10 +46,6 @@
         border-color: darken(desaturate(@bluePale, 10%), 5%);
       }
     }
-
-    i {
-      background-image: url("@{iconWhiteSpritePath}");
-    }
   }
 
   &.btn-success {
@@ -71,10 +60,6 @@
         border-color: darken(@green, 5%);
       }
     }
-
-    i {
-      background-image: url("@{iconWhiteSpritePath}");
-    }
   }
 
   &.btn-warning {
@@ -89,10 +74,6 @@
         border-color: darken(@orange, 5%);
       }
     }
-
-    i {
-      background-image: url("@{iconWhiteSpritePath}");
-    }
   }
 
   &.btn-danger {
@@ -107,10 +88,6 @@
         border-color: darken(saturate(@red, 20%), 5%);
       }
     }
-
-    i {
-      background-image: url("@{iconWhiteSpritePath}");
-    }
   }
 
   &.btn-inverse {
@@ -125,10 +102,6 @@
         border-color: darken(@textColor, 10%);
       }
     }
-
-    i {
-      background-image: url("@{iconWhiteSpritePath}");
-    }
   }
 
   &.btn-link {
@@ -141,18 +114,11 @@
     &:hover, &:active, &:focus {
       &:enabled {
         .opacity(90);
-        
+
         text-decoration: none;
       }
     }
   }
-
-
-  &.btn-primary, &.btn-info, &.btn-success, &.btn-warning, &.btn-danger, &.btn-inverse, &.btn-link {
-    i {
-      .opacity(100);
-    }
-  }
 }
 
 a.btn-link {

static/cranefly/css/cranefly/navbar.less

@@ -24,7 +24,7 @@
 
         span {
           color: @navbarMottoColor;
-        } 
+        }
       }
     }
 
@@ -122,6 +122,8 @@
 
             .btn {
               margin: 0px;
+
+              color: @white;
             }
 
             a:link, a:visited {
@@ -154,14 +156,14 @@
 
         a:link, a:visited, .btn-link {
           background-color: lighten(@navbarBackground, 2%);
-          border: 1px solid darken(@navbarBorder, 2%);
+          border: 1px solid @navbarBorder;
           border-radius: @baseBorderRadius;
-          padding: 5px 8px;
+          padding: 5px 0px;
           margin-top: ((@navbarHeight - @baseLineHeight) / 2) - 6;
+          min-width: 30px;
 
-          i {
-            .opacity(70);
-          }
+          color: @gray;
+          text-align: center;
 
           .label {
             background-color: @red;
@@ -177,30 +179,31 @@
           background-color: @linkColor;
           border-color: darken(@linkColor, 10%);
 
+          color: @white;
+          text-shadow: 0px 1px 1px darken(@linkColor, 10%);
+
           &.danger {
             background-color: @red;
-            border-color: darken(@red, 10%);
+          	border-color: darken(@red, 10%);
+          	text-shadow: 0px 1px 1px darken(@red, 10%);
           }
 
           &.hot {
             background-color: @orange;
-            border-color: darken(@orange, 10%);
+          	border-color: darken(@orange, 10%);
+          	text-shadow: 0px 1px 1px darken(@orange, 10%);
           }
 
           &.fresh {
             background-color: @green;
-            border-color: darken(@green, 10%);
-          }
-
-          i {
-            background-image: url("@{iconWhiteSpritePath}");
-            .opacity(100);
+          	border-color: darken(@green, 10%);
+          	text-shadow: 0px 1px 1px darken(@green, 10%);
           }
 
           .label {
-            background-color: @grayLighter;
+            background-color: @white;
 
-            color: @textColor;
+            color: @linkColor;
           }
         }
 
@@ -211,6 +214,7 @@
             margin-right: 8px;
             margin-top: 5px;
 
+            color: @grayDarker;
             font-weight: bold;
             text-shadow: none;
 
@@ -229,7 +233,7 @@
 
     .navbar-compact {
       display: none;
-      
+
       li {
         &.user-profile {
           &>a {
@@ -278,9 +282,8 @@
                 background: @red;
                 border-color: @red;
 
-                .caret {
-                  border-top-color: @white;
-                }
+                color: @white;
+                text-shadow: 0px 1px 1px darken(@red, 10%);
               }
             }
           }
@@ -327,9 +330,9 @@
                 color: @textColor;
                 font-weight: normal;
                 text-align: left;
-                
+
                 i {
-                  .opacity(100);
+                	margin-right: 12px;
                 }
 
                 &:link, &:active, &:visited, &:hover {
@@ -343,10 +346,6 @@
                 }
               }
 
-              a:link, a:visited {
-                .opacity(80);
-              }
-
               a:hover {
                 background-color: @gray;
                 .opacity(100);

templates/cranefly/layout.html

@@ -86,7 +86,7 @@
           {% endif %}
           {{ hook_user_menu_important_append|safe }}
           <li class="user-profile dropdown">
-            <a href="{{ url('user', user=user.id, username=user.username_slug) }}" class="dropdown-toggle" data-toggle="dropdown"><div>{{ user.username }} <img src="{{ user.get_avatar(28) }}" alt=""><span class="caret-border"><b class="caret"></b></span></div></a>
+            <a href="{{ url('user', user=user.id, username=user.username_slug) }}" class="dropdown-toggle" data-toggle="dropdown"><div>{{ user.username }} <img src="{{ user.get_avatar(28) }}" alt=""><span class="caret-border"><i class="icon-caret-down"></i></span></div></a>
             <ul class="dropdown-menu">
               <li><a href="{{ url('user', user=user.id, username=user.username_slug) }}"><i class="icon-user"></i> {% trans %}Your profile{% endtrans %}</a></li>
               <li><a href="{{ url('usercp') }}"><i class="icon-cog"></i> {% trans %}Change options{% endtrans %}</a></li>