info@53: // info@53: // Popovers info@53: // -------------------------------------------------- info@53: info@53: info@53: .popover { info@53: position: absolute; info@53: top: 0; info@53: left: 0; info@53: z-index: @zindex-popover; info@53: display: none; info@53: max-width: @popover-max-width; info@53: padding: 1px; info@53: text-align: left; // Reset given new insertion method info@53: background-color: @popover-bg; info@53: background-clip: padding-box; info@53: border: 1px solid @popover-fallback-border-color; info@53: border: 1px solid @popover-border-color; info@53: border-radius: @border-radius-large; info@53: .box-shadow(0 5px 10px rgba(0,0,0,.2)); info@53: info@53: // Overrides for proper insertion info@53: white-space: normal; info@53: info@53: // Offset the popover to account for the popover arrow info@53: &.top { margin-top: -10px; } info@53: &.right { margin-left: 10px; } info@53: &.bottom { margin-top: 10px; } info@53: &.left { margin-left: -10px; } info@53: } info@53: info@53: .popover-title { info@53: margin: 0; // reset heading margin info@53: padding: 8px 14px; info@53: font-size: @font-size-base; info@53: font-weight: normal; info@53: line-height: 18px; info@53: background-color: @popover-title-bg; info@53: border-bottom: 1px solid darken(@popover-title-bg, 5%); info@53: border-radius: 5px 5px 0 0; info@53: } info@53: info@53: .popover-content { info@53: padding: 9px 14px; info@53: } info@53: info@53: // Arrows info@53: // info@53: // .arrow is outer, .arrow:after is inner info@53: info@53: .popover .arrow { info@53: &, info@53: &:after { info@53: position: absolute; info@53: display: block; info@53: width: 0; info@53: height: 0; info@53: border-color: transparent; info@53: border-style: solid; info@53: } info@53: } info@53: .popover .arrow { info@53: border-width: @popover-arrow-outer-width; info@53: } info@53: .popover .arrow:after { info@53: border-width: @popover-arrow-width; info@53: content: ""; info@53: } info@53: info@53: .popover { info@53: &.top .arrow { info@53: left: 50%; info@53: margin-left: -@popover-arrow-outer-width; info@53: border-bottom-width: 0; info@53: border-top-color: @popover-arrow-outer-fallback-color; // IE8 fallback info@53: border-top-color: @popover-arrow-outer-color; info@53: bottom: -@popover-arrow-outer-width; info@53: &:after { info@53: content: " "; info@53: bottom: 1px; info@53: margin-left: -@popover-arrow-width; info@53: border-bottom-width: 0; info@53: border-top-color: @popover-arrow-color; info@53: } info@53: } info@53: &.right .arrow { info@53: top: 50%; info@53: left: -@popover-arrow-outer-width; info@53: margin-top: -@popover-arrow-outer-width; info@53: border-left-width: 0; info@53: border-right-color: @popover-arrow-outer-fallback-color; // IE8 fallback info@53: border-right-color: @popover-arrow-outer-color; info@53: &:after { info@53: content: " "; info@53: left: 1px; info@53: bottom: -@popover-arrow-width; info@53: border-left-width: 0; info@53: border-right-color: @popover-arrow-color; info@53: } info@53: } info@53: &.bottom .arrow { info@53: left: 50%; info@53: margin-left: -@popover-arrow-outer-width; info@53: border-top-width: 0; info@53: border-bottom-color: @popover-arrow-outer-fallback-color; // IE8 fallback info@53: border-bottom-color: @popover-arrow-outer-color; info@53: top: -@popover-arrow-outer-width; info@53: &:after { info@53: content: " "; info@53: top: 1px; info@53: margin-left: -@popover-arrow-width; info@53: border-top-width: 0; info@53: border-bottom-color: @popover-arrow-color; info@53: } info@53: } info@53: info@53: &.left .arrow { info@53: top: 50%; info@53: right: -@popover-arrow-outer-width; info@53: margin-top: -@popover-arrow-outer-width; info@53: border-right-width: 0; info@53: border-left-color: @popover-arrow-outer-fallback-color; // IE8 fallback info@53: border-left-color: @popover-arrow-outer-color; info@53: &:after { info@53: content: " "; info@53: right: 1px; info@53: border-right-width: 0; info@53: border-left-color: @popover-arrow-color; info@53: bottom: -@popover-arrow-width; info@53: } info@53: } info@53: info@53: }