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 | |
| 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')
| -rw-r--r-- | less/bootstrap.less | 1 | ||||
| -rw-r--r-- | less/media.less | 68 | ||||
| -rw-r--r-- | less/responsive.less | 14 |
3 files changed, 83 insertions, 0 deletions
diff --git a/less/bootstrap.less b/less/bootstrap.less index d115e9567..4802fb4f6 100644 --- a/less/bootstrap.less +++ b/less/bootstrap.less @@ -52,6 +52,7 @@ // Components: Misc @import "thumbnails.less"; +@import "media.less"; @import "labels.less"; @import "badges.less"; @import "progress-bars.less"; 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 diff --git a/less/responsive.less b/less/responsive.less index 98485eebd..b72aa90e2 100644 --- a/less/responsive.less +++ b/less/responsive.less @@ -106,6 +106,20 @@ padding-left: 10px; padding-right: 10px; } + + // Medias + .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; + } // Modals .modal { |