diff --git a/docs/4.0/components/popovers.md b/docs/4.0/components/popovers.md index cd6599158..123c3c3be 100644 --- a/docs/4.0/components/popovers.md +++ b/docs/4.0/components/popovers.md @@ -52,32 +52,32 @@ Four options are available: top, right, bottom, and left aligned.
-

Popover top

-
+

Popover top

+

Sed posuere consectetur est at lobortis. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum.

-

Popover right

-
+

Popover right

+

Sed posuere consectetur est at lobortis. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum.

-

Popover bottom

-
+

Popover bottom

+

Sed posuere consectetur est at lobortis. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum.

-

Popover left

-
+

Popover left

+

Sed posuere consectetur est at lobortis. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum.

@@ -228,11 +228,11 @@ Options can be passed via data attributes or JavaScript. For data attributes, ap template string - '<div class="popover" role="tooltip"><div class="arrow"></div><h3 class="popover-title"></h3><div class="popover-content"></div></div>' + '<div class="popover" role="tooltip"><div class="arrow"></div><h3 class="popover-header"></h3><div class="popover-body"></div></div>'

Base HTML to use when creating the popover.

-

The popover's title will be injected into the .popover-title.

-

The popover's content will be injected into the .popover-content.

+

The popover's title will be injected into the .popover-header.

+

The popover's content will be injected into the .popover-body.

.arrow will become the popover's arrow.

The outermost wrapper element should have the .popover class.

diff --git a/js/dist/popover.js b/js/dist/popover.js index ecc89c81f..e60fcf6bc 100644 --- a/js/dist/popover.js +++ b/js/dist/popover.js @@ -35,7 +35,7 @@ var Popover = function ($) { placement: 'right', trigger: 'click', content: '', - template: '' + template: '' }); var DefaultType = $.extend({}, Tooltip.DefaultType, { @@ -48,8 +48,8 @@ var Popover = function ($) { }; var Selector = { - TITLE: '.popover-title', - CONTENT: '.popover-content' + TITLE: '.popover-header', + CONTENT: '.popover-body' }; var Event = { diff --git a/js/dist/popover.js.map b/js/dist/popover.js.map index 483f253ac..f8e648ab4 100644 --- a/js/dist/popover.js.map +++ b/js/dist/popover.js.map @@ -1 +1 @@ -{"version":3,"sources":["../src/popover.js"],"names":["Popover","$","NAME","VERSION","DATA_KEY","EVENT_KEY","JQUERY_NO_CONFLICT","fn","CLASS_PREFIX","BSCLS_PREFIX_REGEX","RegExp","Default","extend","Tooltip","placement","trigger","content","template","DefaultType","ClassName","FADE","SHOW","Selector","TITLE","CONTENT","Event","HIDE","HIDDEN","SHOWN","INSERTED","CLICK","FOCUSIN","FOCUSOUT","MOUSEENTER","MOUSELEAVE","isWithContent","getTitle","_getContent","addAttachmentClass","attachment","getTipElement","addClass","tip","config","setContent","$tip","setElementContent","find","removeClass","element","getAttribute","call","_cleanTipClass","tabClass","attr","match","length","join","_jQueryInterface","each","data","_config","test","undefined","Error","Constructor","noConflict","jQuery"],"mappings":"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","file":"popover.js","sourcesContent":["import Tooltip from './tooltip'\n\n\n/**\n * --------------------------------------------------------------------------\n * Bootstrap (v4.0.0-alpha.6): popover.js\n * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)\n * --------------------------------------------------------------------------\n */\n\nconst Popover = (($) => {\n\n\n /**\n * ------------------------------------------------------------------------\n * Constants\n * ------------------------------------------------------------------------\n */\n\n const NAME = 'popover'\n const VERSION = '4.0.0-alpha.6'\n const DATA_KEY = 'bs.popover'\n const EVENT_KEY = `.${DATA_KEY}`\n const JQUERY_NO_CONFLICT = $.fn[NAME]\n const CLASS_PREFIX = 'bs-popover'\n const BSCLS_PREFIX_REGEX = new RegExp(`(^|\\\\s)${CLASS_PREFIX}\\\\S+`, 'g')\n\n const Default = $.extend({}, Tooltip.Default, {\n placement : 'right',\n trigger : 'click',\n content : '',\n template : '
'\n + '
'\n + '

'\n + '
'\n })\n\n const DefaultType = $.extend({}, Tooltip.DefaultType, {\n content : '(string|element|function)'\n })\n\n const ClassName = {\n FADE : 'fade',\n SHOW : 'show'\n }\n\n const Selector = {\n TITLE : '.popover-title',\n CONTENT : '.popover-content'\n }\n\n const Event = {\n HIDE : `hide${EVENT_KEY}`,\n HIDDEN : `hidden${EVENT_KEY}`,\n SHOW : `show${EVENT_KEY}`,\n SHOWN : `shown${EVENT_KEY}`,\n INSERTED : `inserted${EVENT_KEY}`,\n CLICK : `click${EVENT_KEY}`,\n FOCUSIN : `focusin${EVENT_KEY}`,\n FOCUSOUT : `focusout${EVENT_KEY}`,\n MOUSEENTER : `mouseenter${EVENT_KEY}`,\n MOUSELEAVE : `mouseleave${EVENT_KEY}`\n }\n\n\n /**\n * ------------------------------------------------------------------------\n * Class Definition\n * ------------------------------------------------------------------------\n */\n\n class Popover extends Tooltip {\n\n\n // getters\n\n static get VERSION() {\n return VERSION\n }\n\n static get Default() {\n return Default\n }\n\n static get NAME() {\n return NAME\n }\n\n static get DATA_KEY() {\n return DATA_KEY\n }\n\n static get Event() {\n return Event\n }\n\n static get EVENT_KEY() {\n return EVENT_KEY\n }\n\n static get DefaultType() {\n return DefaultType\n }\n\n\n // overrides\n\n isWithContent() {\n return this.getTitle() || this._getContent()\n }\n\n addAttachmentClass(attachment) {\n $(this.getTipElement()).addClass(`${CLASS_PREFIX}-${attachment}`)\n }\n\n getTipElement() {\n return this.tip = this.tip || $(this.config.template)[0]\n }\n\n setContent() {\n const $tip = $(this.getTipElement())\n\n // we use append for html objects to maintain js events\n this.setElementContent($tip.find(Selector.TITLE), this.getTitle())\n this.setElementContent($tip.find(Selector.CONTENT), this._getContent())\n\n $tip.removeClass(`${ClassName.FADE} ${ClassName.SHOW}`)\n }\n\n // private\n\n _getContent() {\n return this.element.getAttribute('data-content')\n || (typeof this.config.content === 'function' ?\n this.config.content.call(this.element) :\n this.config.content)\n }\n\n _cleanTipClass() {\n const $tip = $(this.getTipElement())\n const tabClass = $tip.attr('class').match(BSCLS_PREFIX_REGEX)\n if (tabClass !== null && tabClass.length > 0) {\n $tip.removeClass(tabClass.join(''))\n }\n }\n\n\n // static\n\n static _jQueryInterface(config) {\n return this.each(function () {\n let data = $(this).data(DATA_KEY)\n const _config = typeof config === 'object' ? config : null\n\n if (!data && /destroy|hide/.test(config)) {\n return\n }\n\n if (!data) {\n data = new Popover(this, _config)\n $(this).data(DATA_KEY, data)\n }\n\n if (typeof config === 'string') {\n if (data[config] === undefined) {\n throw new Error(`No method named \"${config}\"`)\n }\n data[config]()\n }\n })\n }\n }\n\n\n /**\n * ------------------------------------------------------------------------\n * jQuery\n * ------------------------------------------------------------------------\n */\n\n $.fn[NAME] = Popover._jQueryInterface\n $.fn[NAME].Constructor = Popover\n $.fn[NAME].noConflict = function () {\n $.fn[NAME] = JQUERY_NO_CONFLICT\n return Popover._jQueryInterface\n }\n\n return Popover\n\n})(jQuery)\n\nexport default Popover\n"]} \ No newline at end of file +{"version":3,"sources":["../src/popover.js"],"names":["Popover","$","NAME","VERSION","DATA_KEY","EVENT_KEY","JQUERY_NO_CONFLICT","fn","CLASS_PREFIX","BSCLS_PREFIX_REGEX","RegExp","Default","extend","Tooltip","placement","trigger","content","template","DefaultType","ClassName","FADE","SHOW","Selector","TITLE","CONTENT","Event","HIDE","HIDDEN","SHOWN","INSERTED","CLICK","FOCUSIN","FOCUSOUT","MOUSEENTER","MOUSELEAVE","isWithContent","getTitle","_getContent","addAttachmentClass","attachment","getTipElement","addClass","tip","config","setContent","$tip","setElementContent","find","removeClass","element","getAttribute","call","_cleanTipClass","tabClass","attr","match","length","join","_jQueryInterface","each","data","_config","test","undefined","Error","Constructor","noConflict","jQuery"],"mappings":"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","file":"popover.js","sourcesContent":["import Tooltip from './tooltip'\n\n\n/**\n * --------------------------------------------------------------------------\n * Bootstrap (v4.0.0-alpha.6): popover.js\n * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)\n * --------------------------------------------------------------------------\n */\n\nconst Popover = (($) => {\n\n\n /**\n * ------------------------------------------------------------------------\n * Constants\n * ------------------------------------------------------------------------\n */\n\n const NAME = 'popover'\n const VERSION = '4.0.0-alpha.6'\n const DATA_KEY = 'bs.popover'\n const EVENT_KEY = `.${DATA_KEY}`\n const JQUERY_NO_CONFLICT = $.fn[NAME]\n const CLASS_PREFIX = 'bs-popover'\n const BSCLS_PREFIX_REGEX = new RegExp(`(^|\\\\s)${CLASS_PREFIX}\\\\S+`, 'g')\n\n const Default = $.extend({}, Tooltip.Default, {\n placement : 'right',\n trigger : 'click',\n content : '',\n template : '
'\n + '
'\n + '

'\n + '
'\n })\n\n const DefaultType = $.extend({}, Tooltip.DefaultType, {\n content : '(string|element|function)'\n })\n\n const ClassName = {\n FADE : 'fade',\n SHOW : 'show'\n }\n\n const Selector = {\n TITLE : '.popover-header',\n CONTENT : '.popover-body'\n }\n\n const Event = {\n HIDE : `hide${EVENT_KEY}`,\n HIDDEN : `hidden${EVENT_KEY}`,\n SHOW : `show${EVENT_KEY}`,\n SHOWN : `shown${EVENT_KEY}`,\n INSERTED : `inserted${EVENT_KEY}`,\n CLICK : `click${EVENT_KEY}`,\n FOCUSIN : `focusin${EVENT_KEY}`,\n FOCUSOUT : `focusout${EVENT_KEY}`,\n MOUSEENTER : `mouseenter${EVENT_KEY}`,\n MOUSELEAVE : `mouseleave${EVENT_KEY}`\n }\n\n\n /**\n * ------------------------------------------------------------------------\n * Class Definition\n * ------------------------------------------------------------------------\n */\n\n class Popover extends Tooltip {\n\n\n // getters\n\n static get VERSION() {\n return VERSION\n }\n\n static get Default() {\n return Default\n }\n\n static get NAME() {\n return NAME\n }\n\n static get DATA_KEY() {\n return DATA_KEY\n }\n\n static get Event() {\n return Event\n }\n\n static get EVENT_KEY() {\n return EVENT_KEY\n }\n\n static get DefaultType() {\n return DefaultType\n }\n\n\n // overrides\n\n isWithContent() {\n return this.getTitle() || this._getContent()\n }\n\n addAttachmentClass(attachment) {\n $(this.getTipElement()).addClass(`${CLASS_PREFIX}-${attachment}`)\n }\n\n getTipElement() {\n return this.tip = this.tip || $(this.config.template)[0]\n }\n\n setContent() {\n const $tip = $(this.getTipElement())\n\n // we use append for html objects to maintain js events\n this.setElementContent($tip.find(Selector.TITLE), this.getTitle())\n this.setElementContent($tip.find(Selector.CONTENT), this._getContent())\n\n $tip.removeClass(`${ClassName.FADE} ${ClassName.SHOW}`)\n }\n\n // private\n\n _getContent() {\n return this.element.getAttribute('data-content')\n || (typeof this.config.content === 'function' ?\n this.config.content.call(this.element) :\n this.config.content)\n }\n\n _cleanTipClass() {\n const $tip = $(this.getTipElement())\n const tabClass = $tip.attr('class').match(BSCLS_PREFIX_REGEX)\n if (tabClass !== null && tabClass.length > 0) {\n $tip.removeClass(tabClass.join(''))\n }\n }\n\n\n // static\n\n static _jQueryInterface(config) {\n return this.each(function () {\n let data = $(this).data(DATA_KEY)\n const _config = typeof config === 'object' ? config : null\n\n if (!data && /destroy|hide/.test(config)) {\n return\n }\n\n if (!data) {\n data = new Popover(this, _config)\n $(this).data(DATA_KEY, data)\n }\n\n if (typeof config === 'string') {\n if (data[config] === undefined) {\n throw new Error(`No method named \"${config}\"`)\n }\n data[config]()\n }\n })\n }\n }\n\n\n /**\n * ------------------------------------------------------------------------\n * jQuery\n * ------------------------------------------------------------------------\n */\n\n $.fn[NAME] = Popover._jQueryInterface\n $.fn[NAME].Constructor = Popover\n $.fn[NAME].noConflict = function () {\n $.fn[NAME] = JQUERY_NO_CONFLICT\n return Popover._jQueryInterface\n }\n\n return Popover\n\n})(jQuery)\n\nexport default Popover\n"]} \ No newline at end of file diff --git a/js/src/popover.js b/js/src/popover.js index 13c109b2c..5c2b65b86 100644 --- a/js/src/popover.js +++ b/js/src/popover.js @@ -31,8 +31,8 @@ const Popover = (($) => { content : '', template : '' + + '

' + + '
' }) const DefaultType = $.extend({}, Tooltip.DefaultType, { @@ -45,8 +45,8 @@ const Popover = (($) => { } const Selector = { - TITLE : '.popover-title', - CONTENT : '.popover-content' + TITLE : '.popover-header', + CONTENT : '.popover-body' } const Event = { diff --git a/js/tests/unit/popover.js b/js/tests/unit/popover.js index a7762bfab..f9c1b429d 100644 --- a/js/tests/unit/popover.js +++ b/js/tests/unit/popover.js @@ -95,8 +95,8 @@ $(function () { $popover.bootstrapPopover('show') assert.notEqual($('.popover').length, 0, 'popover was inserted') - assert.strictEqual($('.popover .popover-title').text(), '@fat', 'title correctly inserted') - assert.strictEqual($('.popover .popover-content').text(), 'loves writing tests （╯°□°）╯︵ ┻━┻', 'content correctly inserted') + assert.strictEqual($('.popover .popover-header').text(), '@fat', 'title correctly inserted') + assert.strictEqual($('.popover .popover-body').text(), 'loves writing tests （╯°□°）╯︵ ┻━┻', 'content correctly inserted') $popover.bootstrapPopover('hide') @@ -114,10 +114,10 @@ $(function () { $popover.bootstrapPopover('show') assert.notEqual($('.popover').length, 0, 'popover inserted') - assert.strictEqual($('.popover .popover-title').text(), '@glebm <3 writing tests', 'title inserted') + assert.strictEqual($('.popover .popover-header').text(), '@glebm <3 writing tests', 'title inserted') assert.ok($.contains($('.popover').get(0), title), 'title node moved, not copied') // toLowerCase because IE8 will return ... - assert.strictEqual($('.popover .popover-content').html().toLowerCase(), '¯\\_(ツ)_/¯', 'content inserted') + assert.strictEqual($('.popover .popover-body').html().toLowerCase(), '¯\\_(ツ)_/¯', 'content inserted') assert.ok($.contains($('.popover').get(0), content), 'content node moved, not copied') }) @@ -132,9 +132,9 @@ $(function () { $popover.bootstrapPopover('show') assert.notEqual($('.popover').length, 0, 'popover inserted') - assert.strictEqual($('.popover .popover-title').text(), '@glebm <3 writing tests', 'title inserted') + assert.strictEqual($('.popover .popover-header').text(), '@glebm <3 writing tests', 'title inserted') assert.ok(!$.contains($('.popover').get(0), title), 'title node copied, not moved') - assert.strictEqual($('.popover .popover-content').html(), '¯\\_(ツ)_/¯', 'content inserted') + assert.strictEqual($('.popover .popover-body').html(), '¯\\_(ツ)_/¯', 'content inserted') assert.ok(!$.contains($('.popover').get(0), content), 'content node copied, not moved') }) @@ -154,14 +154,14 @@ $(function () { $popover.bootstrapPopover('show') assert.notEqual($('.popover').length, 0, 'popover was inserted') - assert.equal($('.popover .popover-content').html(), $div[0].outerHTML, 'content correctly inserted') + assert.equal($('.popover .popover-body').html(), $div[0].outerHTML, 'content correctly inserted') $popover.bootstrapPopover('hide') assert.strictEqual($('.popover').length, 0, 'popover was removed') $popover.bootstrapPopover('show') assert.notEqual($('.popover').length, 0, 'popover was inserted') - assert.equal($('.popover .popover-content').html(), $div[0].outerHTML, 'content correctly inserted') + assert.equal($('.popover .popover-body').html(), $div[0].outerHTML, 'content correctly inserted') $popover.bootstrapPopover('hide') assert.strictEqual($('.popover').length, 0, 'popover was removed') @@ -175,8 +175,8 @@ $(function () { .bootstrapPopover('show') assert.notEqual($('.popover').length, 0, 'popover was inserted') - assert.strictEqual($('.popover .popover-title').text(), '@mdo', 'title correctly inserted') - assert.strictEqual($('.popover .popover-content').text(), 'loves data attributes (づ｡◕‿‿◕｡)づ ︵ ┻━┻', 'content correctly inserted') + assert.strictEqual($('.popover .popover-header').text(), '@mdo', 'title correctly inserted') + assert.strictEqual($('.popover .popover-body').text(), 'loves data attributes (づ｡◕‿‿◕｡)づ ︵ ┻━┻', 'content correctly inserted') $popover.bootstrapPopover('hide') assert.strictEqual($('.popover').length, 0, 'popover was removed') @@ -193,8 +193,8 @@ $(function () { .bootstrapPopover('show') assert.notEqual($('.popover').length, 0, 'popover was inserted') - assert.strictEqual($('.popover .popover-title').text(), '@mdo', 'title correctly inserted') - assert.strictEqual($('.popover .popover-content').text(), 'loves data attributes (づ｡◕‿‿◕｡)づ ︵ ┻━┻', 'content correctly inserted') + assert.strictEqual($('.popover .popover-header').text(), '@mdo', 'title correctly inserted') + assert.strictEqual($('.popover .popover-body').text(), 'loves data attributes (づ｡◕‿‿◕｡)づ ︵ ┻━┻', 'content correctly inserted') $popover.bootstrapPopover('hide') assert.strictEqual($('.popover').length, 0, 'popover was removed') @@ -380,8 +380,8 @@ $(function () { content: 7 }) .on('shown.bs.popover', function () { - assert.strictEqual($('.popover .popover-title').text(), '5') - assert.strictEqual($('.popover .popover-content').text(), '7') + assert.strictEqual($('.popover .popover-header').text(), '5') + assert.strictEqual($('.popover .popover-body').text(), '7') done() }) diff --git a/scss/_popover.scss b/scss/_popover.scss index e3a0d9d6d..950d6ca39 100644 --- a/scss/_popover.scss +++ b/scss/_popover.scss @@ -120,8 +120,8 @@ border-bottom-color: $popover-arrow-color; } - // This will remove the popover-title's border just below the arrow - .popover-title::before { + // This will remove the popover-header's border just below the arrow + .popover-header::before { position: absolute; top: 0; left: 50%; @@ -129,7 +129,7 @@ width: 20px; margin-left: -10px; content: ""; - border-bottom: 1px solid $popover-title-bg; + border-bottom: 1px solid $popover-header-bg; } } @@ -174,13 +174,13 @@ // Offset the popover to account for the popover arrow -.popover-title { - padding: $popover-title-padding-y $popover-title-padding-x; +.popover-header { + padding: $popover-header-padding-y $popover-header-padding-x; margin-bottom: 0; // Reset the default from Reboot font-size: $font-size-base; - color: $popover-title-color; - background-color: $popover-title-bg; - border-bottom: $popover-border-width solid darken($popover-title-bg, 5%); + color: $popover-header-color; + background-color: $popover-header-bg; + border-bottom: $popover-border-width solid darken($popover-header-bg, 5%); $offset-border-width: calc(#{$border-radius-lg} - #{$popover-border-width}); @include border-top-radius($offset-border-width); @@ -189,7 +189,7 @@ } } -.popover-content { - padding: $popover-content-padding-y $popover-content-padding-x; - color: $popover-content-color; +.popover-body { + padding: $popover-body-padding-y $popover-body-padding-x; + color: $popover-body-color; } diff --git a/scss/_variables.scss b/scss/_variables.scss index 92d5e11e0..e106282ed 100644 --- a/scss/_variables.scss +++ b/scss/_variables.scss @@ -673,14 +673,14 @@ $popover-border-width: $border-width !default; $popover-border-color: rgba($black,.2) !default; $popover-box-shadow: 0 5px 10px rgba($black,.2) !default; -$popover-title-bg: darken($popover-bg, 3%) !default; -$popover-title-color: $headings-color !default; -$popover-title-padding-y: 8px !default; -$popover-title-padding-x: 14px !default; +$popover-header-bg: darken($popover-bg, 3%) !default; +$popover-header-color: $headings-color !default; +$popover-header-padding-y: 8px !default; +$popover-header-padding-x: 14px !default; -$popover-content-color: $body-color !default; -$popover-content-padding-y: 9px !default; -$popover-content-padding-x: 14px !default; +$popover-body-color: $body-color !default; +$popover-body-padding-y: 9px !default; +$popover-body-padding-x: 14px !default; $popover-arrow-width: 10px !default; $popover-arrow-height: 5px !default;