Permalink
Browse files

clean up styles

  • Loading branch information...
1 parent 5e4db94 commit 481428154084a9fafd31d8654157d6f6f78231d0 @fat fat committed Feb 6, 2013
@@ -5290,7 +5290,6 @@ input[type="submit"].btn.btn-mini {
position: absolute;
z-index: 1030;
display: block;
- padding: 5px;
font-size: 11px;
line-height: 1.4;
opacity: 0;
@@ -5304,18 +5303,22 @@ input[type="submit"].btn.btn-mini {
}
.tooltip.top {
+ padding: 5px 0;
margin-top: -3px;
}
.tooltip.right {
+ padding: 0 5px;
margin-left: 3px;
}
.tooltip.bottom {
+ padding: 5px 0;
margin-top: 3px;
}
.tooltip.left {
+ padding: 0 5px;
margin-left: -3px;
}
@@ -152,15 +152,58 @@
break
}
- $tip
- .offset(tp)
- .addClass(placement)
- .addClass('in')
-
+ this.applyPlacement(tp, placement)
this.$element.trigger('shown')
}
}
+ , applyPlacement: function(offset, placement){
+ var $tip = this.tip()
+ , width = $tip[0].offsetWidth
+ , height = $tip[0].offsetHeight
+ , actualWidth
+ , actualHeight
+ , delta
+ , replace
+
+ $tip
+ .offset(offset)
+ .addClass(placement)
+ .addClass('in')
+
+ actualWidth = $tip[0].offsetWidth
+ actualHeight = $tip[0].offsetHeight
+
+ if (placement == 'top' && actualHeight != height) {
+ offset.top = offset.top + height - actualHeight
+ replace = true
+ }
+
+ if (placement == 'bottom' || placement == 'top') {
+ delta = 0
+
+ if (offset.left < 0){
+ delta = offset.left * -2
+ offset.left = 0
+ $tip.offset(offset)
+ actualWidth = $tip[0].offsetWidth
+ actualHeight = $tip[0].offsetHeight
+ }
+
+ this.replaceArrow(delta - width + actualWidth, actualWidth, 'left')
+ } else {
+ this.replaceArrow(actualHeight - height, actualHeight, 'top')
+ }
+
+ if (replace) $tip.offset(offset)
+ }
+
+ , replaceArrow: function(delta, dimension, position){
+ this
+ .arrow()
+ .css(position, delta ? (50 * (1 - delta / dimension) + "%") : '')
+ }
+
, setContent: function () {
var $tip = this.tip()
, title = this.getTitle()
@@ -233,6 +276,10 @@
return this.$tip = this.$tip || $(this.options.template)
}
+ , arrow: function(){
+ return this.$arrow = this.$arrow || this.tip().find(".tooltip-arrow")
+ }
+
, validate: function () {
if (!this.$element[0].parentNode) {
this.hide()
@@ -1194,15 +1194,58 @@
break
}
- $tip
- .offset(tp)
- .addClass(placement)
- .addClass('in')
-
+ this.applyPlacement(tp, placement)
this.$element.trigger('shown')
}
}
+ , applyPlacement: function(offset, placement){
+ var $tip = this.tip()
+ , width = $tip[0].offsetWidth
+ , height = $tip[0].offsetHeight
+ , actualWidth
+ , actualHeight
+ , delta
+ , replace
+
+ $tip
+ .offset(offset)
+ .addClass(placement)
+ .addClass('in')
+
+ actualWidth = $tip[0].offsetWidth
+ actualHeight = $tip[0].offsetHeight
+
+ if (placement == 'top' && actualHeight != height) {
+ offset.top = offset.top + height - actualHeight
+ replace = true
+ }
+
+ if (placement == 'bottom' || placement == 'top') {
+ delta = 0
+
+ if (offset.left < 0){
+ delta = offset.left * -2
+ offset.left = 0
+ $tip.offset(offset)
+ actualWidth = $tip[0].offsetWidth
+ actualHeight = $tip[0].offsetHeight
+ }
+
+ this.replaceArrow(delta - width + actualWidth, actualWidth, 'left')
+ } else {
+ this.replaceArrow(actualHeight - height, actualHeight, 'top')
+ }
+
+ if (replace) $tip.offset(offset)
+ }
+
+ , replaceArrow: function(delta, dimension, position){
+ this
+ .arrow()
+ .css(position, delta ? (50 * (1 - delta / dimension) + "%") : '')
+ }
+
, setContent: function () {
var $tip = this.tip()
, title = this.getTitle()
@@ -1275,6 +1318,10 @@
return this.$tip = this.$tip || $(this.options.template)
}
+ , arrow: function(){
+ return this.$arrow = this.$arrow || this.tip().find(".tooltip-arrow")
+ }
+
, validate: function () {
if (!this.$element[0].parentNode) {
this.hide()

Large diffs are not rendered by default.

Oops, something went wrong.
View
@@ -153,66 +153,56 @@
}
this.applyPlacement(tp, placement)
-
this.$element.trigger('shown')
}
}
, applyPlacement: function(offset, placement){
- var $tip
- , width
- , height
- , actualWidth
- , actualHeight
- , delta
- , replace = false
-
- $tip = this.tip()
-
- width = $tip[0].offsetWidth
- height = $tip[0].offsetHeight
-
- $tip
- .offset(offset)
- .addClass(placement)
- .addClass('in')
-
- actualWidth = $tip[0].offsetWidth
- actualHeight = $tip[0].offsetHeight
-
- if (placement == "top" && actualHeight != height){
- offset.top = offset.top + height - actualHeight
- replace = true
- }
+ var $tip = this.tip()
+ , width = $tip[0].offsetWidth
+ , height = $tip[0].offsetHeight
+ , actualWidth
+ , actualHeight
+ , delta
+ , replace
- if (placement == "bottom" || placement == "top"){
- delta = 0
+ $tip
+ .offset(offset)
+ .addClass(placement)
+ .addClass('in')
- if (offset.left < 0){
- delta = -offset.left * 2
- offset.left = 0
- $tip.offset(offset)
- actualWidth = $tip[0].offsetWidth
- actualHeight = $tip[0].offsetHeight
+ actualWidth = $tip[0].offsetWidth
+ actualHeight = $tip[0].offsetHeight
+
+ if (placement == 'top' && actualHeight != height) {
+ offset.top = offset.top + height - actualHeight
+ replace = true
}
- this.replaceArrow(delta - width + actualWidth, actualWidth, "left")
- }else{
- this.replaceArrow(actualHeight - height, actualHeight, "top")
- }
+ if (placement == 'bottom' || placement == 'top') {
+ delta = 0
- if (replace) $tip.offset(offset)
- }
+ if (offset.left < 0){
+ delta = offset.left * -2
+ offset.left = 0
+ $tip.offset(offset)
+ actualWidth = $tip[0].offsetWidth
+ actualHeight = $tip[0].offsetHeight
+ }
- , replaceArrow: function(delta, dimension, position){
- var $arrow = this.arrow()
+ this.replaceArrow(delta - width + actualWidth, actualWidth, 'left')
+ } else {
+ this.replaceArrow(actualHeight - height, actualHeight, 'top')
+ }
- if (delta !== 0){
- $arrow.css(position, 50 * (1 - delta / dimension) + "%")
- }else{
- $arrow.css(position, "")
+ if (replace) $tip.offset(offset)
+ }
+
+ , replaceArrow: function(delta, dimension, position){
+ this
+ .arrow()
+ .css(position, delta ? (50 * (1 - delta / dimension) + "%") : '')
}
- }
, setContent: function () {
var $tip = this.tip()
@@ -287,8 +277,8 @@
}
, arrow: function(){
- return this.$arrow = this.$arrow || this.tip().find(".tooltip-arrow")
- }
+ return this.$arrow = this.$arrow || this.tip().find(".tooltip-arrow")
+ }
, validate: function () {
if (!this.$element[0].parentNode) {
View
@@ -29,9 +29,6 @@
<script src="../../js/bootstrap-typeahead.js"></script>
<script src="../../js/bootstrap-affix.js"></script>
- <!-- Needed for testing -->
- <link rel="stylesheet" type="text/css" href="unit/bootstrap-tooltip.css" />
-
<!-- unit tests -->
<script src="unit/bootstrap-transition.js"></script>
<script src="unit/bootstrap-alert.js"></script>
@@ -1,13 +0,0 @@
-
-
-.tooltip{
- position: absolute;
-}
-
-.tooltip-inner{
- max-width: 200px;
-}
-
-.tooltip.top .tooltip-arrow{
- position: absolute;
-}
@@ -291,25 +291,4 @@ $(function () {
container.remove()
}, 100)
})
-
- test("arrow should point to element", function(){
- var container = $("<div />").appendTo("body")
- .css({position: "absolute", bottom: 0, left: 0, textAlign: "right", width: 300, height: 300})
- , p = $("<p style='margin-top:200px' />").appendTo(container)
- , tooltiped = $("<a href='#' title='very very very very very very very long tooltip'>Hover me</a>")
- .css({marginTop: 200})
- .appendTo(p)
- .tooltip({placement: "top", animate: false})
- .tooltip("show")
-
- stop()
-
- setTimeout(function(){
- var arrow = container.find(".tooltip-arrow")
-
- start()
- ok(Math.abs(arrow.offset().left - tooltiped.offset().left - tooltiped.outerWidth()/2) <= 1)
- container.remove()
- }, 100)
- })
})
View
@@ -13,10 +13,10 @@
line-height: 1.4;
.opacity(0);
&.in { .opacity(80); }
- &.top { margin-top: -3px; padding: 5px 0;}
- &.right { margin-left: 3px; padding: 0 5px;}
- &.bottom { margin-top: 3px; padding: 5px 0;}
- &.left { margin-left: -3px; padding: 0 5px;}
+ &.top { margin-top: -3px; padding: 5px 0; }
+ &.right { margin-left: 3px; padding: 0 5px; }
+ &.bottom { margin-top: 3px; padding: 5px 0; }
+ &.left { margin-left: -3px; padding: 0 5px; }
}
// Wrapper for the tooltip content

0 comments on commit 4814281

Please sign in to comment.