← All changes
|
modules/tiled-gallery/tiled-gallery/tiled-gallery.css
+23
-9
12.4.2
→
16.3-beta
View file →
| @@ -5,15 +5,18 @@ | ||
| 5 | 5 | clear: both; |
| 6 | 6 | margin: 0 0 20px; |
| 7 | 7 | overflow: hidden; |
| 8 | 8 | } |
| 9 | + | |
| 9 | 10 | .tiled-gallery img { |
| 10 | 11 | margin: 2px !important; /* Ensure that this value isn't overridden by themes that give content images blanket margins */ |
| 11 | 12 | } |
| 13 | + | |
| 12 | 14 | .tiled-gallery .gallery-group { |
| 13 | 15 | float: left; |
| 14 | 16 | position: relative; |
| 15 | 17 | } |
| 18 | + | |
| 16 | 19 | .tiled-gallery .tiled-gallery-item { |
| 17 | 20 | float: left; |
| 18 | 21 | margin: 0; |
| 19 | 22 | position: relative; |
| @@ -18,11 +21,13 @@ | ||
| 18 | 21 | margin: 0; |
| 19 | 22 | position: relative; |
| 20 | 23 | width: inherit; /* prevents ie8 bug with inline width styles */ |
| 21 | 24 | } |
| 25 | + | |
| 22 | 26 | .tiled-gallery .gallery-row { |
| 23 | - overflow: hidden; | |
| 27 | + overflow: hidden; | |
| 24 | 28 | } |
| 29 | + | |
| 25 | 30 | .tiled-gallery .tiled-gallery-item a { /* Needs to reset some properties for theme compatibility */ |
| 26 | 31 | background: transparent; |
| 27 | 32 | border: none; |
| 28 | 33 | color: inherit; |
| @@ -30,8 +35,9 @@ | ||
| 30 | 35 | padding: 0; |
| 31 | 36 | text-decoration: none; |
| 32 | 37 | width: auto; |
| 33 | 38 | } |
| 39 | + | |
| 34 | 40 | .tiled-gallery .tiled-gallery-item img, |
| 35 | 41 | .tiled-gallery .tiled-gallery-item img:hover { /* Needs to reset some properties for theme compatibility */ |
| 36 | 42 | background: none; |
| 37 | 43 | border: none; |
| @@ -39,11 +45,12 @@ | ||
| 39 | 45 | max-width: 100%; |
| 40 | 46 | padding: 0; |
| 41 | 47 | vertical-align: middle; |
| 42 | 48 | } |
| 49 | + | |
| 43 | 50 | .tiled-gallery-caption { /* Captions */ |
| 44 | 51 | background: #f0f0f1; |
| 45 | - background: rgba( 255,255,255,0.8 ); | |
| 52 | + background: rgba(255, 255, 255, 0.8); | |
| 46 | 53 | color: #333; |
| 47 | 54 | font-size: 13px; |
| 48 | 55 | font-weight: 400; |
| 49 | 56 | overflow: hidden; |
| @@ -48,14 +55,15 @@ | ||
| 48 | 55 | font-weight: 400; |
| 49 | 56 | overflow: hidden; |
| 50 | 57 | padding: 10px 0; |
| 51 | 58 | position: absolute; |
| 52 | - bottom: 0; | |
| 59 | + bottom: 0; | |
| 53 | 60 | text-indent: 10px; |
| 54 | 61 | text-overflow: ellipsis; |
| 55 | 62 | width: 100%; |
| 56 | 63 | white-space: nowrap; |
| 57 | 64 | } |
| 65 | + | |
| 58 | 66 | .tiled-gallery .tiled-gallery-item-small .tiled-gallery-caption { /* Smaller captions */ |
| 59 | 67 | font-size: 11px; |
| 60 | 68 | } |
| 61 | 69 | |
| @@ -63,9 +71,9 @@ | ||
| 63 | 71 | Gallery widgets are almost guaranteed to need resizing, and |
| 64 | 72 | the jump is a little more obvious than galleries in content. */ |
| 65 | 73 | .widget-gallery .tiled-gallery-unresized { |
| 66 | 74 | visibility: hidden; |
| 67 | - height: 0px; | |
| 75 | + height: 0; | |
| 68 | 76 | overflow: hidden; |
| 69 | 77 | } |
| 70 | 78 | |
| 71 | 79 | /* =Greyscale |
| @@ -71,14 +79,19 @@ | ||
| 71 | 79 | /* =Greyscale |
| 72 | 80 | -------------------------------------------------------------- */ |
| 73 | 81 | |
| 74 | 82 | .tiled-gallery .tiled-gallery-item img.grayscale { |
| 75 | - position: absolute; | |
| 76 | - left: 0; | |
| 77 | - top: 0; | |
| 83 | + -webkit-filter: grayscale(1); | |
| 84 | + -ms-filter: grayscale(1); | |
| 85 | + -o-filter: grayscale(1); | |
| 86 | + filter: grayscale(1); | |
| 78 | 87 | } |
| 79 | -.tiled-gallery .tiled-gallery-item img.grayscale:hover { | |
| 80 | - opacity: 0; | |
| 88 | + | |
| 89 | +.tiled-gallery .tiled-gallery-item:hover img.grayscale { | |
| 90 | + -webkit-filter: none; | |
| 91 | + -ms-filter: none; | |
| 92 | + -o-filter: none; | |
| 93 | + filter: none; | |
| 81 | 94 | } |
| 82 | 95 | |
| 83 | 96 | |
| 84 | 97 | /* =Circles Layout |
| @@ -87,8 +100,9 @@ | ||
| 87 | 100 | .tiled-gallery.type-circle .tiled-gallery-item img { |
| 88 | 101 | border-radius: 50% !important; /* Ensure that circles are displayed in themes that add border-radius to all images as a default */ |
| 89 | 102 | object-fit: cover; |
| 90 | 103 | } |
| 104 | + | |
| 91 | 105 | .tiled-gallery.type-circle .tiled-gallery-caption { |
| 92 | 106 | display: none; |
| 93 | 107 | } |
| 94 | 108 | |