Mercurial > wikked

comparison static/bootstrap/less/thumbnails.less @ 61:130eccd396d8

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
Now using Boostrap with LESS.
author Ludovic Chabant <ludovic@chabant.com>
date Wed, 06 Feb 2013 08:22:31 -0800
parents
children a5a3d454eac9
comparison
equal deleted inserted replaced
60:8250c977bc50 61:130eccd396d8
1 //
2 // Thumbnails
3 // --------------------------------------------------
4
5
6 // Note: `.thumbnails` and `.thumbnails > li` are overriden in responsive files
7
8 // Make wrapper ul behave like the grid
9 .thumbnails {
10 margin-left: -@gridGutterWidth;
11 list-style: none;
12 .clearfix();
13 }
14 // Fluid rows have no left margin
15 .row-fluid .thumbnails {
16 margin-left: 0;
17 }
18
19 // Float li to make thumbnails appear in a row
20 .thumbnails > li {
21 float: left; // Explicity set the float since we don't require .span* classes
22 margin-bottom: @baseLineHeight;
23 margin-left: @gridGutterWidth;
24 }
25
26 // The actual thumbnail (can be `a` or `div`)
27 .thumbnail {
28 display: block;
29 padding: 4px;
30 line-height: @baseLineHeight;
31 border: 1px solid #ddd;
32 .border-radius(@baseBorderRadius);
33 .box-shadow(0 1px 3px rgba(0,0,0,.055));
34 .transition(all .2s ease-in-out);
35 }
36 // Add a hover state for linked versions only
37 a.thumbnail:hover {
38 border-color: @linkColor;
39 .box-shadow(0 1px 4px rgba(0,105,214,.25));
40 }
41
42 // Images and captions
43 .thumbnail > img {
44 display: block;
45 max-width: 100%;
46 margin-left: auto;
47 margin-right: auto;
48 }
49 .thumbnail .caption {
50 padding: 9px;
51 color: @gray;
52 }