add check for document.readyState, fallback for transparent borders

LinkedInAttic · Aug 8, 2012 · 3cc4ff8 · 3cc4ff8
1 parent fd22841
commit 3cc4ff8
Show file tree

Hide file tree

Showing 4 changed files with 40 additions and 10 deletions.
diff --git a/css/hopscotch.css b/css/hopscotch.css
diff --git a/css/hopscotch.less b/css/hopscotch.less
@@ -74,7 +74,7 @@ div#hopscotch-bubble {
     }
 
     &.up {
-      top: (@arrowWidth + @bubbleBorderWidth) * (-1);
+      top: 0 - @arrowWidth - @bubbleBorderWidth;
       left: @bubbleCornerRadius;
 
       .hopscotch-bubble-arrow {
@@ -85,6 +85,7 @@ div#hopscotch-bubble {
         top: 0 - @arrowWidth + (@borderAngledWidth);
       }
       .hopscotch-bubble-arrow-border {
+        border-bottom: @arrowWidth solid #000;
         border-bottom: @arrowWidth solid @borderColor;
         border-left: @arrowWidth solid transparent;
         border-right: @arrowWidth solid transparent;
@@ -102,6 +103,7 @@ div#hopscotch-bubble {
         top:          0 - @arrowWidth - (@borderAngledWidth);
       }
       .hopscotch-bubble-arrow-border {
+        border-top:   @arrowWidth solid #000;
         border-top:   @arrowWidth solid @borderColor;
         border-left:  @arrowWidth solid transparent;
         border-right: @arrowWidth solid transparent;
@@ -120,8 +122,9 @@ div#hopscotch-bubble {
         top: 0 - (2*@arrowWidth);
       }
       .hopscotch-bubble-arrow-border {
-        border-bottom: @arrowWidth solid transparent;
+        border-right:  @arrowWidth solid #000;
         border-right:  @arrowWidth solid @borderColor;
+        border-bottom: @arrowWidth solid transparent;
         border-top:    @arrowWidth solid transparent;
       }
     }
@@ -138,8 +141,9 @@ div#hopscotch-bubble {
         top: 0 - (2*@arrowWidth);
       }
       .hopscotch-bubble-arrow-border {
-        border-bottom: @arrowWidth solid transparent;
+        border-left:   @arrowWidth solid #000;
         border-left:   @arrowWidth solid @borderColor;
+        border-bottom: @arrowWidth solid transparent;
         border-top:    @arrowWidth solid transparent;
       }
     }