aboutsummaryrefslogtreecommitdiff
path: root/docs
diff options
context:
space:
mode:
authorMark Otto <[email protected]>2013-07-18 00:43:48 -0700
committerMark Otto <[email protected]>2013-07-18 00:43:48 -0700
commit1363ffa473a7f68e540563632aaf8293cf1be5fc (patch)
tree2cec1c2cc4ab9a0fae56c12c2fb05a32485dbb53 /docs
parente7bc9e1c3d60c2ac748896fcc0e31855f63590ef (diff)
parent8a84da6341e19011ce8f8e518d7b1cb7f0931da5 (diff)
downloadbootstrap-1363ffa473a7f68e540563632aaf8293cf1be5fc.tar.xz
bootstrap-1363ffa473a7f68e540563632aaf8293cf1be5fc.zip
Merge branch '3.0.0-wip' of https://github.com/mauricew/bootstrap into mauricew-3.0.0-wip
Diffstat (limited to 'docs')
-rw-r--r--docs/assets/css/bootstrap.css16
-rw-r--r--docs/javascript.html16
2 files changed, 24 insertions, 8 deletions
diff --git a/docs/assets/css/bootstrap.css b/docs/assets/css/bootstrap.css
index e79177efa..888d0bbc8 100644
--- a/docs/assets/css/bootstrap.css
+++ b/docs/assets/css/bootstrap.css
@@ -4390,7 +4390,9 @@ a.list-group-item.active > .badge,
filter: alpha(opacity=90);
}
-.carousel-control .glyphicon {
+.carousel-control .glyphicon,
+.carousel-control .icon-prev,
+.carousel-control .icon-next {
position: absolute;
top: 50%;
left: 50%;
@@ -4402,6 +4404,14 @@ a.list-group-item.active > .badge,
margin-left: -10px;
}
+.carousel-control .icon-prev:before {
+ content: '\00ab';
+}
+
+.carousel-control .icon-next:before {
+ content: '\00bb';
+}
+
.carousel-indicators {
position: absolute;
bottom: 20px;
@@ -4450,7 +4460,9 @@ a.list-group-item.active > .badge,
}
@media screen and (min-width: 768px) {
- .carousel-control .glyphicon {
+ .carousel-control .glyphicon,
+ .carousel-control .icon-prev,
+ .carousel-control .icon-next {
width: 30px;
height: 30px;
margin-top: -15px;
diff --git a/docs/javascript.html b/docs/javascript.html
index af58be40f..089aa60ec 100644
--- a/docs/javascript.html
+++ b/docs/javascript.html
@@ -1518,10 +1518,10 @@ $('#myCollapsible').on('hidden.bs.collapse', function () {
</div>
</div>
<a class="left carousel-control" href="#carousel-example-generic" data-slide="prev">
- <span class="glyphicon glyphicon-chevron-left"></span>
+ <span class="icon-prev"></span>
</a>
<a class="right carousel-control" href="#carousel-example-generic" data-slide="next">
- <span class="glyphicon glyphicon-chevron-right"></span>
+ <span class="icon-next"></span>
</a>
</div>
</div><!-- /example -->
@@ -1547,13 +1547,17 @@ $('#myCollapsible').on('hidden.bs.collapse', function () {
<!-- Controls -->
<a class="left carousel-control" href="#carousel-example-generic" data-slide="prev">
- <span class="glyphicon glyphicon-chevron-left"></span>
+ <span class="icon-prev"></span>
</a>
<a class="right carousel-control" href="#carousel-example-generic" data-slide="next">
- <span class="glyphicon glyphicon-chevron-right"></span>
+ <span class="icon-next"></span>
</a>
</div>
{% endhighlight %}
+<div class="bs-callout">
+ <h4>Glyphicon Alternative</h4>
+ <p>With <a href="/css/#glyphicons">Glyphicons</a> available, you may choose to style the left and right toggle buttons with <code>.glyphicon-chevron-left</code> and <code>.glyphicon-chevron-right</code>.</p>
+</div>
<h3>Optional captions</h3>
<p>Add captions to your slides easily with the <code>.carousel-caption</code> element within any <code>.item</code>. Place just about any optional HTML within there and it will be automatically aligned and formatted.</p>
@@ -1592,10 +1596,10 @@ $('#myCollapsible').on('hidden.bs.collapse', function () {
</div>
</div>
<a class="left carousel-control" href="#carousel-example-captions" data-slide="prev">
- <span class="glyphicon glyphicon-chevron-left"></span>
+ <span class="icon-prev"></span>
</a>
<a class="right carousel-control" href="#carousel-example-captions" data-slide="next">
- <span class="glyphicon glyphicon-chevron-right"></span>
+ <span class="icon-next"></span>
</a>
</div>
</div><!-- /example -->