51 lines
1.8 KiB
Plaintext
51 lines
1.8 KiB
Plaintext
|
<div class="widget-gallery gallery card-group widget4 no-print">
|
||
|
|
<h3 class="widget-title">
|
||
|
|
<span>{{widget-title}}</span>
|
||
|
|
</h3>
|
||
|
|
<% OrbitHelper.render_css_in_head(["gallery_card.css"]) %>
|
||
|
|
<div class="row widget-content" data-level="0" data-list="images">
|
||
|
|
<div class="card card-flip h-100">
|
||
|
|
<div class="card-front">
|
||
|
|
<div class="card-body" style="padding:0;">
|
||
|
|
<img
|
||
|
|
srcset="
|
||
|
|
{{thumb-large-src}} 1024w,
|
||
|
|
{{thumb-src}} 768w"
|
||
|
|
src="{{thumb-src}}"
|
||
|
|
alt="{{alt_title}}"
|
||
|
|
>
|
||
|
|
<div class="card-footer">
|
||
|
|
<h3 class="card-title">{{image_short_description}}</h3>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="card-back">
|
||
|
|
<div class="card-body" style="background-color: {{album_color}};color: {{album_card_text_color}};">
|
||
|
|
<h3 class="card-title">{{image_short_description}}</h3>
|
||
|
|
{{image_description}}
|
||
|
|
<div class="card-button-group">
|
||
|
|
<a href="{{link_to_show}}" class="btn btn-secondary view ">
|
||
|
|
<i class="fa fa-link" aria-hidden="true"></i>
|
||
|
|
</a>
|
||
|
|
<a href="{{src}}" data-toggle="lightbox" data-gallery="gallery" class="btn btn-secondary preview" data-title="{{alt_title}}" data-type="image" target="_blank">
|
||
|
|
<i class="fa fa-eye" aria-hidden="true"></i>
|
||
|
|
</a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<script>
|
||
|
|
$(document).ready(function(){
|
||
|
|
$('[data-subpart-id="{{subpart-id}}"] .card-body a').on('focusin', function(){
|
||
|
|
var _this = $(this);
|
||
|
|
var card_flip = _this.parents('.card-flip');
|
||
|
|
card_flip.addClass('hover-class');
|
||
|
|
var off_hover = function(){
|
||
|
|
card_flip.removeClass('hover-class');
|
||
|
|
}
|
||
|
|
_this.one('focusout', off_hover);
|
||
|
|
})
|
||
|
|
})
|
||
|
|
</script>
|
||
|
|
</div>
|