Adds flickr style gradient.

owncloud · Oct 29, 2015 · be343a1 · be343a1
1 parent 0039356
commit be343a1
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 2 deletions.
diff --git a/css/styles.css b/css/styles.css
@@ -130,7 +130,12 @@ div.crumb.last a {
 
 #gallery .item-container .album-label,
 #gallery .item-container .image-label {
-	background: rgba(0, 0, 0, 0.4);
+	position: absolute;
+	width: 100%;
+	height: 100%;
+	transition: opacity 200ms linear;
+	opacity: 1;
+	background-image: linear-gradient(rgba(0,0,0,0) 65%,rgba(0,0,0,0.35));
 }
 
 #gallery .item-container .image-label .title {
@@ -143,6 +148,8 @@ div.crumb.last a {
 	overflow-x: hidden;
 	white-space: nowrap;
 	text-overflow: ellipsis;
+	bottom: 10px;
+	position: absolute;
 }
 
 #gallery .item-container .image-label .title:hover {

diff --git a/js/galleryimage.js b/js/galleryimage.js
@@ -120,7 +120,7 @@
 		 * @private
 		 */
 		_addLabel: function (container) {
-			var imageLabel = $('<span/>')
+			var imageLabel = $('<div/>')
 				.addClass('image-label');
 			var imageTitle = $('<span/>')
 				.addClass('title').text(