diff --git a/prosopopee/themes/exposure/static/css/style.css b/prosopopee/themes/exposure/static/css/style.css index f7b9992..c758378 100644 --- a/prosopopee/themes/exposure/static/css/style.css +++ b/prosopopee/themes/exposure/static/css/style.css @@ -556,6 +556,7 @@ nav ul ul ul li { .polaroid-line { width: 70vw; margin: auto; + position: relative; /* Needed when cust_pos becomes active and children are absolute positioned for this one */ } a.polaroid { @@ -577,6 +578,7 @@ a.polaroid { -o-transition: width 1s, height 1s,-o-transform 1s; text-align: center; overflow: hidden; /*Bullet-proofing*/ + margin: auto; } /* Remove rotation and make it visible (z-index) */ @@ -600,7 +602,7 @@ a.polaroid img { display: block; min-width: 10vw; max-width: 100%; - max-height: 100%; + max-height: 85%; /* Never hide the text this way! */ margin: auto; /* Centers wth display: block */ } diff --git a/prosopopee/themes/exposure/templates/sections/polaroid-group.html b/prosopopee/themes/exposure/templates/sections/polaroid-group.html index a98a647..a19ac9f 100644 --- a/prosopopee/themes/exposure/templates/sections/polaroid-group.html +++ b/prosopopee/themes/exposure/templates/sections/polaroid-group.html @@ -36,10 +36,8 @@ {% set z = loop.index %} {% endif %} - {% if image.w %} - {% set w = image.w %} - {% else %} - {% endif %} + {% set w = image.w %} + {% set h = image.h %} {% set image = Image(image) %} {{ image.copy() }} @@ -50,7 +48,7 @@ data-at-1366="{{ image.generate_thumbnail("x1366") }}" data-at-1920="{{ image.generate_thumbnail("x1920") }}" class="polaroid" - style="{% if custpos %}position:absolute;{% endif %}left: {{ x }}; top: {{ y }}; z-index: {{ z }}; -webkit-transform: rotate({{ angle }}deg); -moz-transform: rotate({{ angle }}deg); transform: rotate({{ angle }}deg);"> + style="{% if w %}width:{{ w }};{% endif %}{% if h %}height: {{ h }};{% endif %}{% if custpos %}position:absolute;{% endif %}left: {{ x }}; top: {{ y }}; z-index: {{ z }}; -webkit-transform: rotate({{ angle }}deg); -moz-transform: rotate({{ angle }}deg); transform: rotate({{ angle }}deg);"> {% if caption %} {{ caption }}
{{ caption }}