Merge pull request #180 from jtremback/tinyman

Tinyman

h/sass/app.scss

@@ -180,7 +180,7 @@ svg { -webkit-tap-highlight-color: rgba(255, 255, 255, 0); }
   width: 100%;
 }
 
-.sheet, .dropdown-menu {
+.sheet {
   @include box-shadow(5px 5px 40px hsla(0, 0%, 0%, .1));
   @include single-transition(all, .4s, ease-in-out);
   @include transform-origin(50%, 0);
@@ -222,52 +222,66 @@ svg { -webkit-tap-highlight-color: rgba(255, 255, 255, 0); }
   text-align: right;
 }
 
-//H BAR
+
+//TOOL BAR
 #toolbar {
+  @include pie-clearfix;
   @include smallshadow;
   background: white;
   border: 1px solid $grayLighter;
-  border-right: 0;
   border-top-left-radius: 4px;
   border-bottom-left-radius: 4px;
-  line-height: 1.2;
+  left: 1px;
   margin-top: .5em;
   padding: .3em;
-  padding-right: 1em;
   position: absolute;
   width: 100%;
   z-index: 5;
-
-  & > * {
-    display: inline-block;
-    vertical-align: bottom;
-  }
+  -webkit-box-sizing: content-box;
+  -moz-box-sizing: content-box;
+  box-sizing: content-box;
 
   .tri {
     @include icon("tri-left.png");
-    width: 1.2em;
-    height: 1.2em;
+    float: left;
+    display: inline-block;
+    width: 1.5em;
+    height: 1.5em;
     cursor: pointer;
   }
 
   &.shown {
     .tri {
       @include icon("tri-right.png");
+      margin-right: .7em;
     }
   }
 
-  .pull-right {
-    border-left: thin solid $grayLighter;
-    padding-left: .3em;
-  }
-
-  #persona {
-    span {
-      @extend .btn-link;
+  .tinyman {
+    margin-right: 1em;
+    border-left: 1px solid $grayLighter;
+    border-right: 1px solid $grayLighter;
+    padding: 0 .3em;
+    .avatar {
+      border-radius: 2px;
+    }
+    .dropdown-toggle {
+      @include linkbutton_right;
+      background-image: url("../images/dropdown_1.png");
+      .provider {
+        color: $grayLight;
+        display: none;
+      }
+      &:hover {
+        .provider {
+          display: inline;
+        }
+      }
     }
   }
 }
 
+
 #wrapper {
   height: 100%;
   overflow: auto;

h/sass/common.scss

@@ -305,10 +305,15 @@ blockquote {
 //DROPDOWNS
 .dropdown {
   position: relative;
+  span {
+    cursor: pointer;
+    &:hover {
+      color: black;
+    }
+  }
 }
 
 .dropdown-menu {
-  @include border-radius(0 0 .5em .5em);
   @include rotateX(90deg);
   @include smallshadow;
   background: $white;
@@ -316,18 +321,32 @@ blockquote {
   border-top: 0;
   left: 0;
   float: left;
-  list-style: none;
-  min-width: 0;
   opacity: 0;
-  padding: .5em;
   pointer-events: none;
   position: absolute;
-  top: 100%;
+
+  li {
+    line-height: 1.5;
+    margin: .25em .5em;
+    border-top: dotted 1px $grayLighter;
+    &:hover {
+      color: black;
+    }
+    &:first-child {
+      border-top: 0;
+    }
+  }
+
+  a {
+    text-decoration: none;
+    color: inherit;
+  }
 
   // Aligns the dropdown menu to right
   &.pull-right {
-    right: 0;
+    right: -1px;
     left: auto;
+    text-align: right;
   }
 }