Skip to content
GitLab
Commit 07286c98 authored by XhmikosR's avatar XhmikosR
Browse files

Merge pull request #17373 from twbs/v4-dev-xmr-holderjs 

Update Holder.js to v2.8.2.
parents cab79b13 1ba807f1
44 merge requests!28721Hot test,!27561Adds font-weight-medium to font weight classes,!26437merge,!26197V4 dev xmr,!20778V4 dev,!20539Allow multiple modals,!18047#17986,!18988Blockquote border width,!20854Fixes 15534,!19272V4 dev xmr grunt html,!19581V4 fix popover,!18283Tether docs fix,!20493V4 dev display,!20636Fix docs for heading sizes,!19824blockquote-center,!22547Finished a new translation for bootstrap,!19534Docs 17264,!19533Npm deps,!22143Fix selectable disabled toggle radio buttons,!19084V4 rhythm,!18085Ie9 click comment,!22598test,!18829Add prefix to carousel classes,!18581Check getting started files for broken links - Issue 18568,!18067replace grunt-autoprefixer with gruntpostcss + autoprefixer,!20099V4.0.0 alpha.3,!18477add utility color-contrast function,!18864Feature/navbar toggler support color schemes,!19602V4 palettes arun,!18311V4 dev xmr,!19448New pull request for testing,!19358XXL grid size,!19825.blockquote-center,!17508Fix usage of “its” and “it’s” (v4 docs),!25326Adjust examples,!23995Add back cursor: pointer for .btn-link,!23178Spinner,!19754Issue template,!19753Card img overlay padding,!19747Blockquote border width,!19580ExitStars,!18684Docs: change "Button" to "Go somewhere",!18661Docs: accessibility fix-up of collapsible content navbar, change site-wide main navbar,!17021v4
Expand all Hide whitespace changes
Inline Side-by-side
Showing
with 33 additions and 32 deletions
+33 -32
docs/assets/js/docs.min.js
+ 4
- 3
View file @ 07286c98
This diff is collapsed.
docs/assets/js/vendor/holder.min.js
+ 3
- 3
View file @ 07286c98
This diff is collapsed.
docs/components/card.md
+ 16
- 16
View file @ 07286c98
......@@ -19,7 +19,7 @@ Cards require a small amount of markup and classes to provide you with as much c
{% example html %}
<div class="card">
<img class="card-img-top" data-src="holder.js/100%x180/" alt="Card image cap">
<img class="card-img-top" data-src="holder.js/100px180/" alt="Card image cap">
<div class="card-block">
<h4 class="card-title">Card title</h4>
<p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
......@@ -34,7 +34,7 @@ Cards support a wide variety of content, including images, text, list groups, li
{% example html %}
<div class="card">
<img class="card-img-top" data-src="holder.js/100%x180/?text=Image cap" alt="Card image cap">
<img class="card-img-top" data-src="holder.js/100px180/?text=Image cap" alt="Card image cap">
<div class="card-block">
<h4 class="card-title">Card title</h4>
<p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
......@@ -53,7 +53,7 @@ Cards support a wide variety of content, including images, text, list groups, li
{% example html %}
<div class="card">
<img class="card-img-top" data-src="holder.js/100%x180/?text=Image cap" alt="Card image cap">
<img class="card-img-top" data-src="holder.js/100px180/?text=Image cap" alt="Card image cap">
<div class="card-block">
<p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
</div>
......@@ -75,7 +75,7 @@ Cards support a wide variety of content, including images, text, list groups, li
<h4 class="card-title">Card title</h4>
<h6 class="card-subtitle text-muted">Support card subtitle</h6>
</div>
<img data-src="holder.js/100%x180/?text=Image" alt="Card image">
<img data-src="holder.js/100px180/?text=Image" alt="Card image">
<div class="card-block">
<p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
<a href="#" class="card-link">Card link</a>
......@@ -196,7 +196,7 @@ Similar to headers and footers, cards include top and bottom image caps.
{% example html %}
<div class="card">
<img class="card-img-top" data-src="holder.js/100%x180/" alt="Card image cap">
<img class="card-img-top" data-src="holder.js/100px180/" alt="Card image cap">
<div class="card-block">
<h4 class="card-title">Card title</h4>
<p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p>
......@@ -209,7 +209,7 @@ Similar to headers and footers, cards include top and bottom image caps.
<p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p>
<p class="card-text"><small class="text-muted">Last updated 3 mins ago</small></p>
</div>
<img class="card-img-bottom" data-src="holder.js/100%x180/" alt="Card image cap">
<img class="card-img-bottom" data-src="holder.js/100px180/" alt="Card image cap">
</div>
{% endexample %}
......@@ -219,7 +219,7 @@ Turn an image into a card background and overlay your card's text. Depending on
{% example html %}
<div class="card card-inverse">
<img class="card-img" data-src="holder.js/100%x270/#55595c:#373a3c/text:Card image" alt="Card image">
<img class="card-img" data-src="holder.js/100px270/#55595c:#373a3c/text:Card image" alt="Card image">
<div class="card-img-overlay">
<h4 class="card-title">Card title</h4>
<p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p>
......@@ -298,7 +298,7 @@ Use card groups to render cards as a single, attached element with equal width a
{% example html %}
<div class="card-group">
<div class="card">
<img class="card-img-top" data-src="holder.js/100%x180/" alt="Card image cap">
<img class="card-img-top" data-src="holder.js/100px180/" alt="Card image cap">
<div class="card-block">
<h4 class="card-title">Card title</h4>
<p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p>
......@@ -306,7 +306,7 @@ Use card groups to render cards as a single, attached element with equal width a
</div>
</div>
<div class="card">
<img class="card-img-top" data-src="holder.js/100%x180/" alt="Card image cap">
<img class="card-img-top" data-src="holder.js/100px180/" alt="Card image cap">
<div class="card-block">
<h4 class="card-title">Card title</h4>
<p class="card-text">This card has supporting text below as a natural lead-in to additional content.</p>
......@@ -314,7 +314,7 @@ Use card groups to render cards as a single, attached element with equal width a
</div>
</div>
<div class="card">
<img class="card-img-top" data-src="holder.js/100%x180/" alt="Card image cap">
<img class="card-img-top" data-src="holder.js/100px180/" alt="Card image cap">
<div class="card-block">
<h4 class="card-title">Card title</h4>
<p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional content. This card has even longer content than the first to show that equal height action.</p>
......@@ -334,7 +334,7 @@ Need a set of equal width and height cards that aren't attached to one another?
<div class="card-deck-wrapper">
<div class="card-deck">
<div class="card">
<img class="card-img-top" data-src="holder.js/100%x200/" alt="Card image cap">
<img class="card-img-top" data-src="holder.js/100px200/" alt="Card image cap">
<div class="card-block">
<h4 class="card-title">Card title</h4>
<p class="card-text">This is a longer card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p>
......@@ -342,7 +342,7 @@ Need a set of equal width and height cards that aren't attached to one another?
</div>
</div>
<div class="card">
<img class="card-img-top" data-src="holder.js/100%x200/" alt="Card image cap">
<img class="card-img-top" data-src="holder.js/100px200/" alt="Card image cap">
<div class="card-block">
<h4 class="card-title">Card title</h4>
<p class="card-text">This card has supporting text below as a natural lead-in to additional content.</p>
......@@ -350,7 +350,7 @@ Need a set of equal width and height cards that aren't attached to one another?
</div>
</div>
<div class="card">
<img class="card-img-top" data-src="holder.js/100%x200/" alt="Card image cap">
<img class="card-img-top" data-src="holder.js/100px200/" alt="Card image cap">
<div class="card-block">
<h4 class="card-title">Card title</h4>
<p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional content. This card has even longer content than the first to show that equal height action.</p>
......@@ -370,7 +370,7 @@ Cards can be organized into [Masonry](http://masonry.desandro.com)-like columns
{% example html %}
<div class="card-columns">
<div class="card">
<img class="card-img-top" data-src="holder.js/100%x160/" alt="Card image cap">
<img class="card-img-top" data-src="holder.js/100px160/" alt="Card image cap">
<div class="card-block">
<h4 class="card-title">Card title that wraps to a new line</h4>
<p class="card-text">This is a longer card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p>
......@@ -387,7 +387,7 @@ Cards can be organized into [Masonry](http://masonry.desandro.com)-like columns
</blockquote>
</div>
<div class="card">
<img class="card-img-top" data-src="holder.js/100%x160/" alt="Card image cap">
<img class="card-img-top" data-src="holder.js/100px160/" alt="Card image cap">
<div class="card-block">
<h4 class="card-title">Card title</h4>
<p class="card-text">This card has supporting text below as a natural lead-in to additional content.</p>
......@@ -410,7 +410,7 @@ Cards can be organized into [Masonry](http://masonry.desandro.com)-like columns
<p class="card-text"><small class="text-muted">Last updated 3 mins ago</small></p>
</div>
<div class="card">
<img class="card-img" data-src="holder.js/100%x260/" alt="Card image">
<img class="card-img" data-src="holder.js/100px260/" alt="Card image">
</div>
<div class="card card-block text-right">
<blockquote class="card-blockquote">
......
docs/content/images.md
+ 1
- 1
View file @ 07286c98
......@@ -16,7 +16,7 @@ Opt your images into responsive behavior (so they never become larger than their
Images in Bootstrap are made responsive with `.img-fluid`. `max-width: 100%;` and `height: auto;` are applied to the image so that it scales with the parent element.
<div class="bd-example">
<img data-src="holder.js/100%x250" class="img-fluid" alt="Generic responsive image">
<img data-src="holder.js/100px250" class="img-fluid" alt="Generic responsive image">
</div>
{% highlight html %}
......
docs/examples/album/index.html
+ 9
- 9
View file @ 07286c98
......@@ -63,41 +63,41 @@
<div class="row">
<div class="card">
<img data-src="holder.js/100%x280/thumb" alt="Card image cap">
<img data-src="holder.js/100px280/thumb" alt="Card image cap">
<p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p>
</div>
<div class="card">
<img data-src="holder.js/100%x280/thumb" alt="Card image cap">
<img data-src="holder.js/100px280/thumb" alt="Card image cap">
<p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p>
</div>
<div class="card">
<img data-src="holder.js/100%x280/thumb" alt="Card image cap">
<img data-src="holder.js/100px280/thumb" alt="Card image cap">
<p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p>
</div>
<div class="card">
<img data-src="holder.js/100%x280/thumb" alt="Card image cap">
<img data-src="holder.js/100px280/thumb" alt="Card image cap">
<p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p>
</div>
<div class="card">
<img data-src="holder.js/100%x280/thumb" alt="Card image cap">
<img data-src="holder.js/100px280/thumb" alt="Card image cap">
<p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p>
</div>
<div class="card">
<img data-src="holder.js/100%x280/thumb" alt="Card image cap">
<img data-src="holder.js/100px280/thumb" alt="Card image cap">
<p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p>
</div>
<div class="card">
<img data-src="holder.js/100%x280/thumb" alt="Card image cap">
<img data-src="holder.js/100px280/thumb" alt="Card image cap">
<p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p>
</div>
<div class="card">
<img data-src="holder.js/100%x280/thumb" alt="Card image cap">
<img data-src="holder.js/100px280/thumb" alt="Card image cap">
<p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p>
</div>
<div class="card">
<img data-src="holder.js/100%x280/thumb" alt="Card image cap">
<img data-src="holder.js/100px280/thumb" alt="Card image cap">
<p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p>
</div>
</div>
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment