diff options
| author | Lester Caine <lester@lsces.co.uk> | 2026-06-18 09:42:03 +0100 |
|---|---|---|
| committer | Lester Caine <lester@lsces.co.uk> | 2026-06-18 09:42:03 +0100 |
| commit | 150ae5fc5dc2275ea54d6490fcc41a4a847c6d64 (patch) | |
| tree | 345d806bdc49d3ddc3a6151dee21121b477200c7 | |
| parent | e72592f4aa254e3b96d82a6edc95bcc8b8b41982 (diff) | |
| download | fisheye-150ae5fc5dc2275ea54d6490fcc41a4a847c6d64.tar.gz fisheye-150ae5fc5dc2275ea54d6490fcc41a4a847c6d64.tar.bz2 fisheye-150ae5fc5dc2275ea54d6490fcc41a4a847c6d64.zip | |
Replace float+clear grid with flexbox in auto_flow gallery
Float+clear can't produce equal-height rows — variable-height thumbnails
caused items to misalign regardless of where clears fired. Switch the
container to .fisheye-flow (flex, flex-wrap:wrap): Bootstrap col-* widths
still control breakpoints, flex rows are automatically equal-height.
Removed counter, clear divs, and redundant col-xs-12 from inner elements.
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
| -rwxr-xr-x | gallery_views/auto_flow/fisheye_auto_flow_inc.tpl | 17 |
1 files changed, 5 insertions, 12 deletions
diff --git a/gallery_views/auto_flow/fisheye_auto_flow_inc.tpl b/gallery_views/auto_flow/fisheye_auto_flow_inc.tpl index 6a57b6b..e1a1f4f 100755 --- a/gallery_views/auto_flow/fisheye_auto_flow_inc.tpl +++ b/gallery_views/auto_flow/fisheye_auto_flow_inc.tpl @@ -17,32 +17,25 @@ {include file="bitpackage:liberty/services_inc.tpl" serviceLocation='body' serviceHash=$gContent->mInfo} - <div class="col-xs-12"> - {counter assign="imageCount" start="0" print=false} - {assign var="max" value=100} + <div class="fisheye-flow"> {foreach from=$gContent->mItems item=galItem key=itemContentId} <div class="col-lg-3 col-md-4 col-sm-6 col-xs-12"> <!-- Begin Image Cell --> - <div class="col-xs-12 gallery-box"> + <div class="gallery-box"> <a href="{if empty($galItem->mInfo.display_url)}/fisheye/gallery/{$galItem->mInfo.gallery_id} {else}{$galItem->mInfo.display_url}{/if}"> - <div class="col-xs-12 gallery-img table-cell"> - <img class="col-xs-12 thumb" src="{$galItem->getThumbnailUri($gContent->getField('thumbnail_size'))}" alt="{$galItem->mInfo.title|escape|default:'image'}" /> + <div class="gallery-img"> + <img class="thumb img-responsive" src="{$galItem->getThumbnailUri($gContent->getField('thumbnail_size'))}" alt="{$galItem->mInfo.title|escape|default:'image'}" /> </div> - <div class="col-xs-12 gallery-img-title table-cell center"> + <div class="gallery-img-title center"> <h3>{$galItem->mInfo.title|escape}</h3> </div> </a> </div> </div> <!-- End Image Cell --> - {counter assign="imageCount"} - {if $imageCount % 2 == 0}<div class="visible-sm-block clear"></div>{/if} - {if $imageCount % 3 == 0}<div class="visible-md-block clear"></div>{/if} - {if $imageCount % 4 == 0}<div class="visible-lg-block clear"></div>{/if} {foreachelse} <div class="norecords">{tr}This gallery is empty{/tr}. <a href="{$smarty.const.FISHEYE_PKG_URL}upload.php?gallery_id={$galleryId}">Upload pictures!</a></div> {/foreach} </div> - <div class="clear"></div> </div> <!-- end .body --> |