diff --git a/lib/QUI/Bricks/Controls/ContentSwitcher.css b/lib/QUI/Bricks/Controls/ContentSwitcher.css index 245b2e2115ac4a7c7c866798f174ed33b9fc714f..f25b2cfd2ffa44751d3b6215cb93574d66b870bd 100644 --- a/lib/QUI/Bricks/Controls/ContentSwitcher.css +++ b/lib/QUI/Bricks/Controls/ContentSwitcher.css @@ -1,6 +1,6 @@ .content-switcher { display: flex; - min-height: 460px; + min-height: 360px; align-items: center; flex-direction: row; } @@ -22,7 +22,11 @@ @media screen and (max-width: 767px){ .content-switcher { flex-direction: column; - border-bottom: 2px solid #e4e4e4; + border-bottom: 2px solid #f5f5f5; + } + + .content-switcher:last-child { + border-bottom: none; } .content-switcher-image { diff --git a/lib/QUI/Bricks/Controls/ContentSwitcher.html b/lib/QUI/Bricks/Controls/ContentSwitcher.html index 233c574d346194fa61beb63db16b9833646564ff..d7a08a395a0eff125a609484f333acc8053933b2 100644 --- a/lib/QUI/Bricks/Controls/ContentSwitcher.html +++ b/lib/QUI/Bricks/Controls/ContentSwitcher.html @@ -2,7 +2,9 @@ {foreach from=$entries item=entry key=key} {assign var=img value=$entry.img} -<div class="content-switcher"> + +<!-- display on desktops, replace text and image position by adding a new entry --> +<div class="content-switcher hide-on-mobile"> {assign var=modKey value=$key+1} {if $modKey && $modKey % 2 !== 0 } <div class="content-switcher-image"> @@ -31,4 +33,20 @@ </div> {/if} </div> + +<!-- for small screens: image always comes above the text --> +<div class="content-switcher hide-on-desktop"> + <div class="content-switcher-image"> + {if $img != ""} + <img width=300 height=auto src="{$entry.img}"/> + {else} + <img style="display: none;"> + {/if} + </div> + <div class="content-switcher-content"> + <h1>{$entry.title}</h1> + <p>{$entry.content}</p> + </div> +</div> + {/foreach} \ No newline at end of file diff --git a/lib/QUI/Bricks/Controls/GoogleMaps.html b/lib/QUI/Bricks/Controls/GoogleMaps.html index 26a582654157e304b8613689c1128c7781dd36b6..a13fdab04ab46609380395a57576837c6756a45f 100644 --- a/lib/QUI/Bricks/Controls/GoogleMaps.html +++ b/lib/QUI/Bricks/Controls/GoogleMaps.html @@ -1,3 +1,4 @@ +<script src="http://maps.googleapis.com/maps/api/js"></script> <script> var myCenter = new google.maps.LatLng(51.149168, 7.106579);