diff --git a/view/templates/photo_album.tpl b/view/templates/photo_album.tpl index 5416066cf0..d3e7ca4874 100644 --- a/view/templates/photo_album.tpl +++ b/view/templates/photo_album.tpl @@ -9,9 +9,9 @@ {{/if}} {{foreach $photos as $photo}} -
- - {{if $photo.album.name}}{{$photo.album.name}}{{elseif $photo.desc}}{{$photo.desc}}{{elseif $photo.alt}}{{$photo.alt}}{{else}}{{$photo.unknown}}{{/if}} +
+ + {{if $photo.album.name}}{{$photo.album.name}}{{elseif $photo.desc}}{{$photo.desc}}{{elseif $photo.alt}}{{$photo.alt}}{{else}}{{$photo.unknown}}{{/if}}

{{$photo.desc}}

diff --git a/view/theme/vier/style.css b/view/theme/vier/style.css index cbb850c130..8454c7e0ae 100644 --- a/view/theme/vier/style.css +++ b/view/theme/vier/style.css @@ -3024,7 +3024,8 @@ a.btn#contact-edit-actions-button { } /* photo album page */ -.photo-top-image-wrapper { +.photo-top-image-wrapper, +.photo-album-image-wrapper { position: relative; float: left; margin-top: 15px; @@ -3054,11 +3055,33 @@ a.btn#contact-edit-actions-button { float: left; width: 175px; } -img.photo-top-photo { +img.photo-top-photo, +img.photo-album-photo { width: 100%; height: 100%; object-fit: cover; } +.photo-album-photo { + float: none; +} +.photo-album-image-wrapper .caption { + opacity: 0; + width: 100%; + position: absolute; + bottom: 0px; + padding: 3px 5px; + background-color: rgb(255, 255, 255); + margin: 0; + overflow: hidden; + -webkit-transition: all 0.5s ease-in-out; + -moz-transition: all 0.5s ease-in-out; + -o-transition: all 0.5s ease-in-out; + -ms-transition: all 0.5s ease-in-out; + transition: all 0.5s ease-in-out; +} +.photo-album-image-wrapper:hover .caption { + opacity: 1; +} .menu-profile-list{ height: auto;