]>
Commit | Line | Data |
---|---|---|
59c06b17 CS |
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(4px); | |
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 | } |