tonyair/silverstripe-elemental-basics
1
0
Fork 0
mirror of https://github.com/a2nt/silverstripe-elemental-basics.git synced 2024-10-22 17:05:54 +02:00
Code Issues 1 Projects Releases Wiki Activity

IMPR: glide slider

Browse Source
This commit is contained in:
Tony Air 2023-08-04 18:09:44 +02:00
parent 0d7e238268
commit 61d704226a
2 changed files with 13 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
templates/A2nt/ElementalBasics/Elements/SliderElement.ss
View File

@ -8,29 +8,27 @@
<% end_if %> <% end_if %>
<% if $SlideShow %> <% if $SlideShow %>
<div class="element__content"> <div class="element__content<% if $SlidesInRow >1 %> container<% end_if %>">
<div <div
id="Carousel{$ID}" id="Carousel{$ID}"
class="element__carousel carousel slide js-carousel class="glide
<% if $SlidesInRow > 1 %> <% if $SlidesInRow > 1 %>
carousel-multislide carousel-multislide
<% end_if %>" <% end_if %>"
<% if $SlidesInRow > 1 %> data-per-view="<% if $SlidesInRow >1 %>{$SlidesInRow}<% else %>1<% end_if %>"
data-length="{$SlidesInRow}"
<% end_if %>
<% if $SlideShow.count > 1 %> <% if $SlideShow.count > 1 %>
<% if $Interval %> data-bs-interval="$Interval"<% end_if %> <% if $Interval %> data-bs-interval="$Interval"<% end_if %>
data-bs-indicators="true" data-bs-arrows="true" data-bs-indicators="true" data-bs-arrows="true"
<% end_if %> <% end_if %>
> >
<div class="carousel-inner"> <div class="glide__track" data-glide-el="track">
<% loop $SlideShow %> <ul class="glide__slides">
<div class="carousel-item carousel-item-{$SlideType}<% if no $Controls %> carousel-item-nocontrols<% end_if %><% if $First %> active<% end_if %>"> <% loop $SlideShow %>
<div class="carousel-slide"> <li class="glide__slide">
<% include SlideItem %> <% include SlideItem %>
</div> </li>
</div> <% end_loop %>
<% end_loop %> </ul>
</div> </div>
</div> </div>
</div> </div>

6
templates/Includes/SlideItem_media.ss
View File

@ -11,9 +11,9 @@
<% else %> <% else %>
<% if $Image || $ImageURL %> <% if $Image || $ImageURL %>
<span class="img"> <span class="img">
<img class="carousel__img" <img class="glide__img"
src="<% if $ImageURL %>$ImageURL<% else %>$Image.FocusFill($SlideWidth,$SlideHeight).URL<% end_if %>" src="{$EmptyImgSrc}"
loading="lazy" data-lazy-src="<% if $ImageURL %>$ImageURL<% else %>$Image.FocusFill($SlideWidth,$SlideHeight).URL<% end_if %>"
alt="<% if $Headline %>$Headline.XML<% end_if %>" alt="<% if $Headline %>$Headline.XML<% end_if %>"
/> />
</span> </span>