Added Medias code and documentation

Fix for Issue #1711

Added media.less and edited bootstrap.less and responsive.less to
manage media components.

Added a section to the documentation (Media, in components.html) outlining how Medias work. Edited bootstrap.css and bootstrap-responsive.css to add the code for the demos

Signed-off-by: Giuliano Velli <wpbrains@giusi.org>
This commit is contained in:
Giuliano Velli
2012-04-20 17:54:51 +02:00
parent 6506ede632
commit 4fbb400754
6 changed files with 308 additions and 2 deletions

View File

@@ -114,6 +114,18 @@
padding-left: 10px;
padding-right: 10px;
}
.media .pull-left,
.media .pull-right {
float: none;
display: block;
margin-bottom: 10px;
}
.media .pull-left {
margin-right: 0;
}
.media .pull-right {
margin-left: 0;
}
.modal {
position: absolute;
top: 10px;
@@ -169,9 +181,9 @@
width: 100%;
min-height: 28px;
/* Make inputs at least the height of their button counterpart */
/* Makes inputs behave like true block-level elements */
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-ms-box-sizing: border-box;

View File

@@ -3562,6 +3562,57 @@ a.thumbnail:hover {
.thumbnail .caption {
padding: 9px;
}
.media,
.media-body {
overflow: hidden;
*overflow: visible;
zoom: 1;
}
.media {
margin-bottom: 10px;
}
.media .media {
margin-top: 20px;
}
.media .pull-left {
margin-right: 10px;
}
.media .pull-right {
margin-left: 10px;
}
.media .media-object {
display: block;
}
.medias {
margin-top: 20px;
margin-left: 0;
list-style-type: none;
}
.medias .media {
padding-bottom: 10px;
border-bottom: 1px solid rgba(0, 0, 0, 0.07);
}
.medias > .media:last-child {
margin: 0;
border-bottom: none;
}
.medias > .media .media {
margin-bottom: 0;
padding-bottom: 0;
border-bottom: none;
}
.media-box {
margin-bottom: 19px;
padding: 10px;
background-color: #fff;
border: 1px solid rgba(0, 0, 0, 0.09);
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
-webkit-box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.1);
-moz-box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.1);
box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.1);
}
.label {
padding: 1px 4px 2px;
font-size: 10.998px;