src/pyams_default_theme/component/gallery/templates/renderer-default.pt
changeset 222 fa1df486025b
parent 177 610811d72a10
child 230 951d11442e0b
equal deleted inserted replaced
221:52c1c11d0a0f 222:fa1df486025b
     1 <div i18n:domain="pyams_content">
     1 <div tal:define="cache_key tales:cache_key(context)"
     2 	<tal:loop repeat="image context.get_visible_medias()">
     2 	 i18n:domain="pyams_default_theme"
     3 		<picture tal:define="image_data i18n:image.data;
     3 	 id="carousel-${cache_key}"
     4 							 image_url tales:absolute_url(image_data);
     4 	 class="gallery gallery-grid" data-ride="carousel">
     5 							 timestamp tales:timestamp(image);">
     5 	<div tal:repeat="image context.get_visible_medias()"
     6 			<!-- xs source -->
     6 		 class="item col-lg-3 col-md-4 col-sm-4 col-xs-6">
     7 			<source media="(max-width: 767px)"
     7 		<div class="legend">${i18n:image.title}</div>
     8 					srcset="${image_url}/++thumb++w768?_=${timestamp}" />
     8 		<tal:var define="image_data i18n:image.data;
     9 			<!-- sm source -->
     9 						 alt i18n:image.title;">
    10 			<source media="(max-width: 991px)"
    10 			${structure:tales:picture(image_data, lg_width=3, md_width=4, sm_width=4,
    11 					srcset="${image_url}/++thumb++w992?_=${timestamp}" />
    11 									  xs_width=6, css_class='img_responsive', alt=alt)}
    12 			<!-- md source -->
    12 		</tal:var>
    13 			<source media="(max-width: 1199px)"
    13 		<div class="author">${i18n:image.author}</div>
    14 					srcset="${image_url}/++thumb++w1200?_=${timestamp}" />
    14 	</div>
    15 			<!-- lg source -->
       
    16 			<source media="(min-width: 1200px)"
       
    17 					srcset="${image_url}/++thumb++w1600?_=${timestamp}" />
       
    18 			<!-- fallback image -->
       
    19 			<img style="width: 100%;"
       
    20 				 tal:attributes="alt i18n:image.alt_title; src image_url" />
       
    21 		</picture>
       
    22 	</tal:loop>
       
    23 </div>
    15 </div>