tuanphan

#1. Use this code footer.site-footer .html-block a { border-bottom: 1px solid; } #2. Use this CSS /* underline phone on hover */ div#block-31a2d8d0954cfd1ceb86 a:hover { border-bottom: 1px solid; }

Edit page where you want to place this > Add a Code Block > Paste this code into Code BLock <div class='container1'> <div class='img background-img'></div> <div class='img foreground-img'></div> <input type="range" min="1" max="100" value="50" class="slider" name='slider' id="slider"> <div class='slider-button'></div> </div> <style> .container1 { position: relative; width: 900px; height: 600px; border: 2px solid white; } .container1 .img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-size: 900px 100%; } .container1 .background-img { background-image: url("https://i.imgur.com/s08MkXC.jpg"); } .container1 .foreground-img { background-image: url("https://i.imgur.com/PfIWek4.jpg"); width: 50%; } .container1 .slider { position: absolute; -webkit-appearance: none; appearance: none; width: 100%; height: 100%; background: rgba(242, 242, 242, 0.3); outline: none; margin: 0; transition: all 0.2s; display: flex; justify-content: center; align-items: center; } .container1 .slider:hover { background: rgba(242, 242, 242, 0.1); } .container1 .slider::-webkit-slider-thumb { -webkit-appearance: none; appearance: none; width: 6px; height: 600px; background: white; cursor: pointer; } .container1 .slider::-moz-range-thumb { width: 6px; height: 600px; background: white; cursor: pointer; } .container1 .slider-button { pointer-events: none; position: absolute; width: 30px; height: 30px; border-radius: 50%; background-color: white; left: calc(50% - 18px); top: calc(50% - 18px); display: flex; justify-content: center; align-items: center; } .container1 .slider-button:after { content: ""; padding: 3px; display: inline-block; border: solid #5D5D5D; border-width: 0 2px 2px 0; transform: rotate(-45deg); } .container1 .slider-button:before { content: ""; padding: 3px; display: inline-block; border: solid #5D5D5D; border-width: 0 2px 2px 0; transform: rotate(135deg); } </style> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.1/jquery.min.js"></script> <script> $("#slider").on("input change", (e)=>{ const sliderPos = e.target.value; // Update the width of the foreground image $('.foreground-img').css('width', `${sliderPos}%`) // Update the position of the slider button $('.slider-button').css('left', `calc(${sliderPos}% - 18px)`) }); </script>

Hi, Which white space are you referring to?

You can add to Page Header Code Injection then share link to Event Page, we can give code to remove it on Event List Page

Hi, No way to make it fullwidth, the only thing I can do is increase its width Add to Design > Custom CSS div#block-yui_3_17_2_1_1674657316389_2960 { width: 100% !important; } div#block-yui_3_17_2_1_1674241498182_131440 { width: 100%; }

Hi, What is page url? We can help easier

Hi, Can you share link to page? We can check easier

Add to Design > Custom CSS > then save & reload the site @media screen and (max-width:900px) { section#home-banner { height: 250px; } }

Use this CSS code .collection-type-gallery.hide-meta .meta { right: unset !important; left: 20px !important; }

Hi, You mean this image?

Hi, What is your site url? We can check easier

Hi, Currently I don't see button. Can you check it again? https://www.chicagoawakening.church/awknevents/

Add this to Design > Custom CSS .mobile-branding-wrapper .mobile-logo-image a { max-width: 100px !important; }

Can you take a screenshot this section? I don't see Strips now

Hi, Where is "Offer"?

Try this CSS .select-calendar .select-label:not(.babel-ignore) { font-size: 0; } .select-calendar .select-label:not(.babel-ignore):before { content: "At..."; font-size: 16px; }

What is your site url?

Hi, Center these text?

Add this code to The Mental Kitchen Mold Page Header <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.1/jquery.min.js"></script> <script> $(document).ready(function() { $('header#header a.btn').attr('href','tel:0123456789'); $("header#header a.btn").html(function() { return $(this).html().replace("Call Us 07889859941", "Call Us 0123456789"); }); }); </script>

The url doesn't exist now. Can you check it again?

Can you share link to this page? We can check problem easier

Add this code under <style> .product-quantity-input, .sqs-add-to-cart-button-wrapper { display: none !important; } </style>

Can you share link to pages where you have problem? We can adjust code easier

It looks like an invalid symbol. Can you send all current code?

Hi, It looks like you figured it out?