Commit 077f63ba authored by Sébastiaan Versteeg's avatar Sébastiaan Versteeg

Merge branch '904-photos-show-rotated' into 'master'

Photos show rotated

Closes #904

See merge request !1337
parents 05be3346 c654a2f0
#page-content {
#photos-index, #photos-album {
.rotate90 {
img {
transform: rotate(90deg);
}
}
.rotate180 {
img {
transform: rotate(180deg);
}
}
.rotate270 {
img {
transform: rotate(270deg);
}
}
.grayscale {
img {
filter: grayscale(1);
}
}
.grid-item.grayscale {
.overlay {
background-color: rgba(88, 88, 88, 0.6);
.grid-item {
&.grayscale {
.overlay {
background-color: rgba(88, 88, 88, 0.6);
}
}
@each $rotation in '90' '180' '270' {
&.rotate#{$rotation}:hover .image img {
-moz-transform: scale(1.05) rotate(#{$rotation}deg);
-webkit-transform: scale(1.05) rotate(#{$rotation}deg);
transform: scale(1.05) rotate(#{$rotation}deg);
}
}
}
......@@ -38,3 +33,11 @@
}
}
}
@each $rotation in '90' '180' '270' {
.rotate#{$rotation} img {
-moz-transform: rotate(#{$rotation}deg);
-webkit-transform: rotate(#{$rotation}deg);
transform: rotate(#{$rotation}deg);
}
}
......@@ -36,8 +36,8 @@ def album_card(album):
@register.inclusion_tag('includes/grid_item.html')
def photo_card(photo):
class_name = 'photo-card rotate{}'.format(photo.rotation)
anchor_attrs = (f'data-fancybox-rotation="{photo.rotation}" '
class_name = 'photo-card'
anchor_attrs = (f'data-rotation="{photo.rotation}" '
f'data-fancybox="gallery"')
if photo.album.shareable:
......@@ -53,6 +53,8 @@ def photo_card(photo):
if photo.rotation > 0:
class_name += ' rotate{}'.format(photo.rotation)
anchor_attrs += f' data-options=' \
f'\'{{"slideClass": "rotate{photo.rotation}"}}\''
return grid_item(
title='',
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment