diff --git a/docs/4.0/components/popovers.md b/docs/4.0/components/popovers.md
index 6aa3bb269355a382004f27889c2ed3e76b79b58b..20ab3fe75b85321d1f0f535f8433c33fd885833c 100644
--- a/docs/4.0/components/popovers.md
+++ b/docs/4.0/components/popovers.md
@@ -51,7 +51,7 @@ Four options are available: top, right, bottom, and left aligned.
<div class="bd-example bd-example-popover-static">
<div class="popover bs-popover-top bs-popover-top-docs">
- <div class="arrow" x-arrow></div>
+ <div class="arrow"></div>
<h3 class="popover-title">Popover top</h3>
<div class="popover-content">
<p>Sed posuere consectetur est at lobortis. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum.</p>
@@ -59,7 +59,7 @@ Four options are available: top, right, bottom, and left aligned.
</div>
<div class="popover bs-popover-right bs-popover-right-docs">
- <div class="arrow" x-arrow></div>
+ <div class="arrow"></div>
<h3 class="popover-title">Popover right</h3>
<div class="popover-content">
<p>Sed posuere consectetur est at lobortis. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum.</p>
@@ -67,7 +67,7 @@ Four options are available: top, right, bottom, and left aligned.
</div>
<div class="popover bs-popover-bottom bs-popover-bottom-docs">
- <div class="arrow" x-arrow></div>
+ <div class="arrow"></div>
<h3 class="popover-title">Popover bottom</h3>
<div class="popover-content">
<p>Sed posuere consectetur est at lobortis. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum.</p>
@@ -75,7 +75,7 @@ Four options are available: top, right, bottom, and left aligned.
</div>
<div class="popover bs-popover-left bs-popover-left-docs">
- <div class="arrow" x-arrow></div>
+ <div class="arrow"></div>
<h3 class="popover-title">Popover left</h3>
<div class="popover-content">
<p>Sed posuere consectetur est at lobortis. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum.</p>
@@ -228,7 +228,7 @@ Options can be passed via data attributes or JavaScript. For data attributes, ap
<tr>
<td>template</td>
<td>string</td>
- <td><code>'<div class="popover" role="tooltip"><div class="arrow" x-arrow></div><h3 class="popover-title"></h3><div class="popover-content"></div></div>'</code></td>
+ <td><code>'<div class="popover" role="tooltip"><div class="arrow"></div><h3 class="popover-title"></h3><div class="popover-content"></div></div>'</code></td>
<td>
<p>Base HTML to use when creating the popover.</p>
<p>The popover's <code>title</code> will be injected into the <code>.popover-title</code>.</p>
diff --git a/docs/4.0/components/tooltips.md b/docs/4.0/components/tooltips.md
index baee524518d57d2dcdcc95e9d075e4cd853b8add..c6cf14dc93b7d6462644662ebc42c271845bfac9 100644
--- a/docs/4.0/components/tooltips.md
+++ b/docs/4.0/components/tooltips.md
@@ -46,25 +46,25 @@ Four options are available: top, right, bottom, and left aligned.
<div class="bd-example bd-example-tooltip-static">
<div class="tooltip bs-tooltip-top bs-tooltip-top-docs" role="tooltip">
- <div class="arrow" x-arrow></div>
+ <div class="arrow"></div>
<div class="tooltip-inner">
Tooltip on the top
</div>
</div>
<div class="tooltip bs-tooltip-right bs-tooltip-right-docs" role="tooltip">
- <div class="arrow" x-arrow></div>
+ <div class="arrow"></div>
<div class="tooltip-inner">
Tooltip on the right
</div>
</div>
<div class="tooltip bs-tooltip-bottom bs-tooltip-bottom-docs" role="tooltip">
- <div class="arrow" x-arrow></div>
+ <div class="arrow"></div>
<div class="tooltip-inner">
Tooltip on the bottom
</div>
</div>
<div class="tooltip bs-tooltip-left bs-tooltip-left-docs" role="tooltip">
- <div class="arrow" x-arrow></div>
+ <div class="arrow"></div>
<div class="tooltip-inner">
Tooltip on the left
</div>
@@ -134,7 +134,7 @@ You should only add tooltips to HTML elements that are traditionally keyboard-fo
<!-- Generated markup by the plugin -->
<div class="tooltip bs-tooltip-top" role="tooltip">
- <div class="arrow" x-arrow></div>
+ <div class="arrow"></div>
<div class="tooltip-inner">
Some tooltip text!
</div>
@@ -207,7 +207,7 @@ Options can be passed via data attributes or JavaScript. For data attributes, ap
<tr>
<td>template</td>
<td>string</td>
- <td><code>'<div class="tooltip" role="tooltip"><div class="arrow" x-arrow></div><div class="tooltip-inner"></div></div>'</code></td>
+ <td><code>'<div class="tooltip" role="tooltip"><div class="arrow"></div><div class="tooltip-inner"></div></div>'</code></td>
<td>
<p>Base HTML to use when creating the tooltip.</p>
<p>The tooltip's <code>title</code> will be injected into the <code>.tooltip-inner</code>.</p>
diff --git a/js/src/popover.js b/js/src/popover.js
index a068420d63cdc8be6b42273ca8a3812a6ba8b3ac..13c109b2c7c5e6c17bd9656f4bf1ff6e2b79a50b 100644
--- a/js/src/popover.js
+++ b/js/src/popover.js
@@ -30,7 +30,7 @@ const Popover = (($) => {
trigger : 'click',
content : '',
template : '<div class="popover" role="tooltip">'
- + '<div class="arrow" x-arrow></div>'
+ + '<div class="arrow"></div>'
+ '<h3 class="popover-title"></h3>'
+ '<div class="popover-content"></div></div>'
})
diff --git a/js/src/tooltip.js b/js/src/tooltip.js
index 1d53b0470ddf6159bb9019e24db79ca4a8a96fe6..c7c7b9f9d7a434acbc76b4b99ce913ac6dcb828e 100644
--- a/js/src/tooltip.js
+++ b/js/src/tooltip.js
@@ -61,7 +61,7 @@ const Tooltip = (($) => {
const Default = {
animation : true,
template : '<div class="tooltip" role="tooltip">'
- + '<div class="arrow" x-arrow></div>'
+ + '<div class="arrow"></div>'
+ '<div class="tooltip-inner"></div></div>',
trigger : 'hover focus',
title : '',
@@ -99,7 +99,8 @@ const Tooltip = (($) => {
const Selector = {
TOOLTIP : '.tooltip',
- TOOLTIP_INNER : '.tooltip-inner'
+ TOOLTIP_INNER : '.tooltip-inner',
+ ARROW : '.arrow'
}
const Trigger = {
@@ -288,16 +289,19 @@ const Tooltip = (($) => {
$(this.element).trigger(this.constructor.Event.INSERTED)
this._popper = new Popper(this.element, tip, {
- placement : attachment,
- modifiers : {
- offset : {
- offset : this.config.offset
+ placement: attachment,
+ modifiers: {
+ offset: {
+ offset: this.config.offset
},
- flip : {
- behavior : this.config.fallbackPlacement
+ flip: {
+ behavior: this.config.fallbackPlacement
+ },
+ arrow: {
+ element: Selector.ARROW
}
},
- onCreate : (data) => {
+ onCreate: (data) => {
if (data.originalPlacement !== data.placement) {
this._handlePopperPlacementChange(data)
}
diff --git a/package.json b/package.json
index e44d3018658f17c65a74bd69a9475f81ee8161c8..08fe1b40c62890a3a8b5e53f2534b13b36491b0a 100644
--- a/package.json
+++ b/package.json
@@ -77,7 +77,7 @@
"babel-cli": "^6.24.1",
"babel-eslint": "^7.2.3",
"babel-plugin-transform-es2015-modules-strip": "^0.1.1",
- "babel-preset-es2015": "^7.0.0-alpha.7",
+ "babel-preset-es2015": "^6.24.1",
"clean-css-cli": "^4.1.3",
"eslint": "^3.19.0",
"htmllint-cli": "^0.0.6",
diff --git a/scss/_variables.scss b/scss/_variables.scss
index 20826e8e0518541f58c1d2e1f30ba6990cd6d9b4..74e2fab730fa185f4c2d228ff90bea382518640a 100644
--- a/scss/_variables.scss
+++ b/scss/_variables.scss
@@ -677,7 +677,7 @@ $card-border-radius-inner: calc(#{$card-border-radius} - #{$card-border-width})
$card-cap-bg: $gray-lightest !default;
$card-bg: $white !default;
-$card-link-hover-color: $white !default;
+$card-inverse-link-hover-color: $white !default;
$card-img-overlay-padding: 1.25rem !default;
diff --git a/scss/mixins/_cards.scss b/scss/mixins/_cards.scss
index e535b316d7f67004e1a3b4cfa400f3bf27985fb8..c32ca689e22dd10821e696b281cbcf192c350c8f 100644
--- a/scss/mixins/_cards.scss
+++ b/scss/mixins/_cards.scss
@@ -47,7 +47,7 @@
}
.card-link {
@include hover-focus {
- color: $card-link-hover-color;
+ color: $card-inverse-link-hover-color;
}
}
}