Commit c4364285 authored by Jacob Thornton's avatar Jacob Thornton
Browse files

add default margin for popover and twipsy

parent 0980a33b
19 merge requests!14752.0 wip,!1403warningText and warningBackground docs fix,!985Fix id anchor javascript,!906Twipsy now respects custom classes,!873Clicking a dropdown will always toggle it,!858Bordered Arrow Mixin - updated for 2.0,!13512.0 wip - relative font sizes,!1315[2.0-wip] Fix mustache glob when building,!1268[wip-2.0] IE 7/8 Typehead JS fix,!12362.0 wip - Fix for issue #1202,!1219Removed dotted outline on navbar dropdown menu,!1210Missing icon class from examples,!1195Fixed display of secondary container,!1090Fixed typo,!1084Default `.border-radius-custom` values,!1064Typo Fix in tables.less,!10572.0 wip,!1052Missing data attribute to close modal,!10212.0 wip
Showing with 44 additions and 6 deletions
+44 -6
......@@ -6,7 +6,7 @@
* http://www.apache.org/licenses/LICENSE-2.0
*
* Designed and built with all the love in the world @twitter by @mdo and @fat.
* Date: Tue Dec 20 19:08:51 PST 2011
* Date: Tue Dec 20 22:11:42 PST 2011
*/
html, body {
margin: 0;
......@@ -2364,6 +2364,18 @@ button.btn::-moz-focus-inner, input[type=submit].btn::-moz-focus-inner {
-moz-opacity: 0.8;
opacity: 0.8;
}
.twipsy.above {
margin-top: -2px;
}
.twipsy.right {
margin-left: 2px;
}
.twipsy.below {
margin-top: 2px;
}
.twipsy.left {
margin-left: -2px;
}
.twipsy.above .twipsy-arrow {
bottom: 0;
left: 50%;
......@@ -2420,6 +2432,18 @@ button.btn::-moz-focus-inner, input[type=submit].btn::-moz-focus-inner {
display: none;
padding: 5px;
}
.popover.above {
margin-top: -5px;
}
.popover.right {
margin-left: 5px;
}
.popover.below {
margin-top: 5px;
}
.popover.left {
margin-left: -5px;
}
.popover.above .arrow {
bottom: 0;
left: 50%;
......
......@@ -311,13 +311,21 @@ button.btn::-moz-focus-inner,input[type=submit].btn::-moz-focus-inner{padding:0;
.modal-footer:after{clear:both;}
.modal-footer .btn{float:right;margin-left:5px;}
.twipsy{position:absolute;z-index:1000;display:block;visibility:visible;padding:5px;font-size:11px;filter:alpha(opacity=0);-moz-opacity:0;opacity:0;}.twipsy.in{filter:alpha(opacity=80);-moz-opacity:0.8;opacity:0.8;}
.twipsy.above{margin-top:-2px;}
.twipsy.right{margin-left:2px;}
.twipsy.below{margin-top:2px;}
.twipsy.left{margin-left:-2px;}
.twipsy.above .twipsy-arrow{bottom:0;left:50%;margin-left:-5px;border-left:5px solid transparent;border-right:5px solid transparent;border-top:5px solid #000000;}
.twipsy.left .twipsy-arrow{top:50%;right:0;margin-top:-5px;border-top:5px solid transparent;border-bottom:5px solid transparent;border-left:5px solid #000000;}
.twipsy.below .twipsy-arrow{top:0;left:50%;margin-left:-5px;border-left:5px solid transparent;border-right:5px solid transparent;border-bottom:5px solid #000000;}
.twipsy.right .twipsy-arrow{top:50%;left:0;margin-top:-5px;border-top:5px solid transparent;border-bottom:5px solid transparent;border-right:5px solid #000000;}
.twipsy-inner{max-width:200px;padding:3px 8px;color:white;text-align:center;text-decoration:none;background-color:#000000;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;}
.twipsy-arrow{position:absolute;width:0;height:0;}
.popover{position:absolute;top:0;left:0;z-index:1000;display:none;padding:5px;}.popover.above .arrow{bottom:0;left:50%;margin-left:-5px;border-left:5px solid transparent;border-right:5px solid transparent;border-top:5px solid #000000;}
.popover{position:absolute;top:0;left:0;z-index:1000;display:none;padding:5px;}.popover.above{margin-top:-5px;}
.popover.right{margin-left:5px;}
.popover.below{margin-top:5px;}
.popover.left{margin-left:-5px;}
.popover.above .arrow{bottom:0;left:50%;margin-left:-5px;border-left:5px solid transparent;border-right:5px solid transparent;border-top:5px solid #000000;}
.popover.right .arrow{top:50%;left:0;margin-top:-5px;border-top:5px solid transparent;border-bottom:5px solid transparent;border-right:5px solid #000000;}
.popover.below .arrow{top:0;left:50%;margin-left:-5px;border-left:5px solid transparent;border-right:5px solid transparent;border-bottom:5px solid #000000;}
.popover.left .arrow{top:50%;right:0;margin-top:-5px;border-top:5px solid transparent;border-bottom:5px solid transparent;border-left:5px solid #000000;}
......
......@@ -8,10 +8,14 @@
z-index: 1000;
display: none;
padding: 5px;
&.above { margin-top: -5px; }
&.right { margin-left: 5px; }
&.below { margin-top: 5px; }
&.left { margin-left: -5px; }
&.above .arrow { #popoverArrow > .above(); }
&.right .arrow { #popoverArrow > .right(); }
&.below .arrow { #popoverArrow > .below(); }
&.left .arrow { #popoverArrow > .left(); }
&.left .arrow { #popoverArrow > .left(); }
.arrow {
position: absolute;
width: 0;
......
......@@ -9,9 +9,11 @@
padding: 5px;
font-size: 11px;
.opacity(0);
&.in {
.opacity(80);
}
&.in { .opacity(80); }
&.above { margin-top: -2px; }
&.right { margin-left: 2px; }
&.below { margin-top: 2px; }
&.left { margin-left: -2px; }
&.above .twipsy-arrow { #popoverArrow > .above(); }
&.left .twipsy-arrow { #popoverArrow > .left(); }
&.below .twipsy-arrow { #popoverArrow > .below(); }
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment