From 6a5bc636495815b1510aaa7ecb74afd0206d22bf Mon Sep 17 00:00:00 2001
From: Chris Rebert <code@rebertia.com>
Date: Wed, 17 Dec 2014 18:58:01 -0800
Subject: [PATCH] rename .arrow => .popover-arrow
---
docs/_includes/js/popovers.html | 12 ++++++------
docs/javascript/popovers.md | 12 ++++++------
js/popover.js | 4 ++--
js/tests/unit/popover.js | 2 +-
scss/_popover.scss | 16 ++++++++--------
5 files changed, 23 insertions(+), 23 deletions(-)
diff --git a/docs/_includes/js/popovers.html b/docs/_includes/js/popovers.html
index ab33baccbd..3182d8c4de 100644
--- a/docs/_includes/js/popovers.html
+++ b/docs/_includes/js/popovers.html
@@ -40,7 +40,7 @@ $(function () {
<p>Four options are available: top, right, bottom, and left aligned.</p>
<div class="bs-example bs-example-popover">
<div class="popover top">
- <div class="arrow"></div>
+ <div class="popover-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>
@@ -48,7 +48,7 @@ $(function () {
</div>
<div class="popover right">
- <div class="arrow"></div>
+ <div class="popover-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>
@@ -56,7 +56,7 @@ $(function () {
</div>
<div class="popover bottom">
- <div class="arrow"></div>
+ <div class="popover-arrow"></div>
<h3 class="popover-title">Popover bottom</h3>
<div class="popover-content">
@@ -65,7 +65,7 @@ $(function () {
</div>
<div class="popover left">
- <div class="arrow"></div>
+ <div class="popover-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>
@@ -207,12 +207,12 @@ sagittis lacus vel augue laoreet rutrum faucibus.">
<tr>
<td>template</td>
<td>string</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><code>'<div class="popover" role="tooltip"><div class="popover-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>
<p>The popover's <code>content</code> will be injected into the <code>.popover-content</code>.</p>
- <p><code>.arrow</code> will become the popover's arrow.</p>
+ <p><code>.popover-arrow</code> will become the popover's arrow.</p>
<p>The outermost wrapper element should have the <code>.popover</code> class.</p>
</td>
</tr>
diff --git a/docs/javascript/popovers.md b/docs/javascript/popovers.md
index 0844621ba3..f84d52bbeb 100644
--- a/docs/javascript/popovers.md
+++ b/docs/javascript/popovers.md
@@ -44,7 +44,7 @@ Four options are available: top, right, bottom, and left aligned.
<div class="bs-example bs-example-popover">
<div class="popover top">
- <div class="arrow"></div>
+ <div class="popover-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>
@@ -52,7 +52,7 @@ Four options are available: top, right, bottom, and left aligned.
</div>
<div class="popover right">
- <div class="arrow"></div>
+ <div class="popover-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>
@@ -60,7 +60,7 @@ Four options are available: top, right, bottom, and left aligned.
</div>
<div class="popover bottom">
- <div class="arrow"></div>
+ <div class="popover-arrow"></div>
<h3 class="popover-title">Popover bottom</h3>
<div class="popover-content">
@@ -69,7 +69,7 @@ Four options are available: top, right, bottom, and left aligned.
</div>
<div class="popover left">
- <div class="arrow"></div>
+ <div class="popover-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>
@@ -222,12 +222,12 @@ 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"></div><h3 class="popover-title"></h3><div class="popover-content"></div></div>'</code></td>
+ <td><code>'<div class="popover" role="tooltip"><div class="popover-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>
<p>The popover's <code>content</code> will be injected into the <code>.popover-content</code>.</p>
- <p><code>.arrow</code> will become the popover's arrow.</p>
+ <p><code>.popover-arrow</code> will become the popover's arrow.</p>
<p>The outermost wrapper element should have the <code>.popover</code> class.</p>
</td>
</tr>
diff --git a/js/popover.js b/js/popover.js
index db272bdee4..8aed51d2b1 100644
--- a/js/popover.js
+++ b/js/popover.js
@@ -25,7 +25,7 @@
placement: 'right',
trigger: 'click',
content: '',
- template: '<div class="popover" role="tooltip"><div class="arrow"></div><h3 class="popover-title"></h3><div class="popover-content"></div></div>'
+ template: '<div class="popover" role="tooltip"><div class="popover-arrow"></div><h3 class="popover-title"></h3><div class="popover-content"></div></div>'
})
@@ -72,7 +72,7 @@
}
Popover.prototype.arrow = function () {
- return (this.$arrow = this.$arrow || this.tip().find('.arrow'))
+ return (this.$arrow = this.$arrow || this.tip().find('.popover-arrow'))
}
Popover.prototype.tip = function () {
diff --git a/js/tests/unit/popover.js b/js/tests/unit/popover.js
index 466ebace26..8f59d3483a 100644
--- a/js/tests/unit/popover.js
+++ b/js/tests/unit/popover.js
@@ -141,7 +141,7 @@ $(function () {
.bootstrapPopover({
title: 'Test',
content: 'Test',
- template: '<div class="popover foobar"><div class="arrow"></div><div class="inner"><h3 class="title"/><div class="content"><p/></div></div></div>'
+ template: '<div class="popover foobar"><div class="popover-arrow"></div><div class="inner"><h3 class="title"/><div class="content"><p/></div></div></div>'
})
$popover.bootstrapPopover('show')
diff --git a/scss/_popover.scss b/scss/_popover.scss
index 63928a4fce..11b6acaaac 100644
--- a/scss/_popover.scss
+++ b/scss/_popover.scss
@@ -47,9 +47,9 @@
// Arrows
//
-// .arrow is outer, .arrow:after is inner
+// .popover-arrow is outer, .popover-arrow:after is inner
-.popover > .arrow {
+.popover > .popover-arrow {
&,
&:after {
position: absolute;
@@ -60,16 +60,16 @@
border-style: solid;
}
}
-.popover > .arrow {
+.popover > .popover-arrow {
border-width: $popover-arrow-outer-width;
}
-.popover > .arrow:after {
+.popover > .popover-arrow:after {
content: "";
border-width: $popover-arrow-width;
}
.popover {
- &.top > .arrow {
+ &.top > .popover-arrow {
bottom: -$popover-arrow-outer-width;
left: 50%;
margin-left: -$popover-arrow-outer-width;
@@ -83,7 +83,7 @@
border-bottom-width: 0;
}
}
- &.right > .arrow {
+ &.right > .popover-arrow {
top: 50%;
left: -$popover-arrow-outer-width;
margin-top: -$popover-arrow-outer-width;
@@ -97,7 +97,7 @@
border-left-width: 0;
}
}
- &.bottom > .arrow {
+ &.bottom > .popover-arrow {
top: -$popover-arrow-outer-width;
left: 50%;
margin-left: -$popover-arrow-outer-width;
@@ -112,7 +112,7 @@
}
}
- &.left > .arrow {
+ &.left > .popover-arrow {
top: 50%;
right: -$popover-arrow-outer-width;
margin-top: -$popover-arrow-outer-width;
--
GitLab