diff options
| author | Giuliano Velli <[email protected]> | 2012-04-20 17:54:51 +0200 |
|---|---|---|
| committer | Giuliano Velli <[email protected]> | 2012-04-24 17:19:17 +0200 |
| commit | 4fbb400754986b969b40fc12eacfd332ace1a174 (patch) | |
| tree | c837b75461b7a430347225dfd20bbc653472545b /less/media.less | |
| parent | 6506ede6323ee60d4d7f8171937d92141a64e09e (diff) | |
| download | bootstrap-4fbb400754986b969b40fc12eacfd332ace1a174.tar.xz bootstrap-4fbb400754986b969b40fc12eacfd332ace1a174.zip | |
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 <[email protected]>
Diffstat (limited to 'less/media.less')
| -rw-r--r-- | less/media.less | 68 |
1 files changed, 68 insertions, 0 deletions
diff --git a/less/media.less b/less/media.less new file mode 100644 index 000000000..87ea1bc1e --- /dev/null +++ b/less/media.less @@ -0,0 +1,68 @@ +// COMMON STYLES +// ------------- + +.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; +} + +// Media list +.medias { + margin-top: 20px; + margin-left: 0; + list-style-type: none; +} +.medias .media { + padding-bottom: 10px; + border-bottom: 1px solid rgba(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 +.media-box { + margin-bottom: 19px; + padding: 10px; + background-color: #fff; + border: 1px solid rgba(0,0,0,.09); + .border-radius(4px); + .box-shadow(1px 1px 2px rgba(0, 0, 0, 0.1)); +} + +@media (max-width: 480px) { + .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; + } +}
\ No newline at end of file |