Template:SidescrollSlides: Difference between revisions

Newer edit →

Revision as of 06:21, 23 August 2026

User:AvidConanContributor/sandbox/Template:SidescrollSlides

@@ Line 1: / Line 1: @@
-<p style="border: 1px solid black; margin-bottom: 8px;">Lorem ipsum dolor sit amet consectetur adipiscing elit. Ex sapien vitae pellentesque sem placerat in id. Pretium tellus duis convallis tempus leo eu aenean. Urna tempor pulvinar vivamus fringilla lacus nec metus. Iaculis massa nisl malesuada lacinia integer nunc posuere.</p>
+<includeonly><div class="sidescroll-container sidescroll-container-can-hover" style="--slide-min-width:{{{slide-min-width}}};--control-bar-width: 60%;--button-height:{{{button-height}}};--auto-advance-delay:{{{auto-advance-delay}}}s;--scroll-transition-duration:{{{scroll-transition-duration}}}s;--progress-bar-fill-duration:{{#expr: {{{auto-advance-delay}}} + {{{scroll-transition-duration}}}}};"><div class="sidescroll-top-container"><div class="sidescroll-view-all">[View all]</div><!-- This would eventually become a link to a page containing all the slides. --></div><div class="sidescroll-slide-container"><div style="overflow-x: clip;"><div class="sidescroll" style="transition-duration: 0s;">{{#if: {{{slides|}}} | {{{slides}}} | <div class="error">'''No slides were given. Insert them using [[Template:SidescrollSlides/Slide|SidescrollSlides/Slide]].'''</div>}}</div></div></div><div class="sidescroll-bottom-container"><div class="sidescroll-controls" style="background: #f3f3f3; --button-border-color: #b4b4b4;"><div class="sidescroll-button-container"><div class="sidescroll-button" tabindex="0" role="button"><div class="sidescroll-button-chevron sidescroll-button-chevron-left"></div></div><div class="sidescroll-button" tabindex="0" role="button" style="flex-basis: 50%; margin: 0 1px;"><div class="sidescroll-button-pause-play"><div class="sidescroll-button-pause-icon"></div></div></div><div class="sidescroll-button" tabindex="0" role="button"><div class="sidescroll-button-chevron sidescroll-button-chevron-right"></div></div></div><div class="sidescroll-progress-bar-container"><div class="sidescroll-progress-bar-background"><div class="sidescroll-progress-bar"></div></div></div></div></div></div></includeonly><noinclude>
-<div class="sidescroll-container sidescroll-container-can-hover" style="--slide-height: 150px; --slide-min-width: 250px;--control-bar-width: 60%;--button-height: 32px;--auto-advance-delay: 5s;--scroll-transition-duration: 0.55s;--progress-bar-fill-duration: 5.55;"><div class="sidescroll-top-container"><div class="sidescroll-view-all">[View all]</div><!-- This would eventually become a link to a page containing all the slides. --></div><div class="sidescroll-slide-container"><div style="overflow-x: clip;"><div class="sidescroll" style="transition-duration: 0s;"><span class="sidescroll-slide" style="background: #df207c; color:#fff">Hello</span><span class="sidescroll-slide" style="background: #ffd036">Bonjour</span><span class="sidescroll-slide" style="background: #238fe1">Kon'nichwa</span></div></div></div><div class="sidescroll-bottom-container"><div class="sidescroll-controls" style="background: #f3f3f3; --button-border-color: #b4b4b4;"><div class="sidescroll-button-container"><div class="sidescroll-button" tabindex="0" role="button"><div class="sidescroll-button-chevron sidescroll-button-chevron-left"></div></div><div class="sidescroll-button" tabindex="0" role="button" style="flex-basis: 50%; margin: 0 1px;"><div class="sidescroll-button-pause-play"><div class="sidescroll-button-pause-icon"></div></div></div><div class="sidescroll-button" tabindex="0" role="button"><div class="sidescroll-button-chevron sidescroll-button-chevron-right"></div></div></div><div class="sidescroll-progress-bar-container"><div class="sidescroll-progress-bar-background"><div class="sidescroll-progress-bar"></div></div></div></div></div></div>
-<p style="border: 1px solid black; margin: 0;">Semper vel class aptent taciti sociosqu ad litora. Conubia nostra inceptos himenaeos orci varius natoque penatibus. Dis parturient montes nascetur ridiculus mus donec rhoncus. Nulla molestie mattis scelerisque maximus eget fermentum odio. Purus est efficitur laoreet mauris pharetra vestibulum fusce.</p>
+{{User:AvidConanContributor/sandbox/Template:SidescrollSlides|slide-min-width=250px|button-height=32px|auto-advance-delay=5|scroll-transition-duration=0.55|slides=
+{{User:AvidConanContributor/sandbox/Template:SidescrollSlides/Slide|}}
+{{User:AvidConanContributor/sandbox/Template:SidescrollSlides/Slide|}}
+{{User:AvidConanContributor/sandbox/Template:SidescrollSlides/Slide|}}}}
+</noinclude>