Naomi-lifelab

I found a solution for this! I hope I can help more people
#URL-SLUG .Index-page-content {
  padding-left: 0px;
  padding-right: 0px;
  padding-top: 10px;
  padding-bottom: 10px;
  max-width: 100%;
}
 

No problem, glad I spotted that, can be tricky to find coding "errors" (not really an error , just a misplaced bracket). Can you mark my post as the solution to your question and give it a thumbs up? Thanks!

It looks like you have a closing } too early, try this as a replacement for all that code:
/* Landing page spaces photo preview summary arrows */ div#block-yui_3_17_2_1_1648549152222_22108 { .sqs-gallery-controls .next { position: absolute !important; top: 35% !important; transform: translateY(100%); font-size: 30px !important; right: -100px !important; overflow: visible; } .sqs-gallery-controls .previous { position: absolute !important; top: 35% !important; transform: translateY(100%); font-size: 30px !important; left: -100px !important; overflow: visible; } .summary-carousel-pager .sqs-gallery-controls { overflow: visible; } .sqs-gallery-controls .previous { right: unset !important; left: 20px !important; color: white; background-color: rgba(255, 255, 255,.5) } .sqs-gallery-controls .next { right: 10px !important; color: #fff; background-color: rgba(255, 255, 255,.5) } .sqs-gallery-controls .next:before { font-size: 100px; color: #fff; } .sqs-gallery-controls .previous:before { font-size: 100px; color: #fff; } .sqs-gallery-design-carousel .sqs-gallery-controls .previous:before { font-size: 50px; width: 50px; height: 5px; line-height: 5px; color: #fff; } .sqs-gallery-design-carousel .sqs-gallery-controls .previous:before { font-family: 'squarespace-ui-font'; font-style: normal; speak: none; font-weight: bold; -webkit-font-smoothing: antialiased; content: "\E02C"; text-align: center; display: inline-block; vertical-align: middle; color: #fff!important; } .sqs-gallery-design-carousel .sqs-gallery-controls .next:before { font-size: 50px; width: 50px; height: 5px; line-height: 5px; color: #fff; } .sqs-gallery-design-carousel .sqs-gallery-controls .next:before { font-family: 'squarespace-ui-font'; font-style: normal; speak: none; font-weight: bold; -webkit-font-smoothing: antialiased; content: "\E02D"; text-align: center; display: inline-block; vertical-align: middle; } } /* Landing page setiing summary arrows */ div#block-yui_3_17_2_1_1649142326010_3915 { .sqs-gallery-controls .next { position: absolute !important; top: 45%!important; transform: translateY(-50%); font-size: 30px !important; right: 100px !important; color: white; } .sqs-gallery-controls .previous { position: absolute !important; top: 45%!important; transform: translateY(-50%); font-size: 30px !important; right: 100px !important; color: white; } //left arrow// .sqs-gallery-design-carousel .sqs-gallery-controls .previous:before { font-family: 'squarespace-ui-font'; font-style: normal; speak: none; font-weight: bold; -webkit-font-smoothing: antialiased; content: "\E02C"; text-align: center; display: inline-block; vertical-align: middle; color: #fff; } //right arrow// .sqs-gallery-design-carousel .sqs-gallery-controls .next:before { font-family: 'squarespace-ui-font'; font-style: normal; speak: none; font-weight: bold; -webkit-font-smoothing: antialiased; content: "\E02D"; text-align: center; display: inline-block; vertical-align: middle; } .sqs-gallery-controls .previous { right: unset !important; left: 20px !important; color:#fff; } .sqs-gallery-controls .next { right: 50px !important; color: #fff; } .sqs-gallery-controls .next:before { font-size: 80px; color:#fff; } .sqs-gallery-controls .previous:before { font-size: 80px; } } Let me know if that worked.

There are lots of different scripts on your site and not all of them are well written, so  it is difficult to know where to start 🤣.
Perhaps you can get a developer to run through each script one at a time with you and help you to improve them. With a little help you could make each script less fragile (so they do not break when you add new scripts) and improve overall site performance by avoiding repeated code. 

If you look through the scripts on the website you'll see two copies of this:
  const translate = {     Jan: "Jän",         Feb: "Feb",         Mar: "März",         Apr: "Apr",         May: "Mai",         Jun: "Juni",         Jul: "Juli",         Aug: "Aug",         Sep: "Sept",         Oct: "Okt",         Nov: "Nov",         Dec: "Dek" } const translate1 = {         January: "Januar",         February: "Februar",         March: "März",         April: "April",         May: "Mai",         June: "Juni",         July: "Juli",         August: "August",         September: "September",         October: "Oktober",         November: "November",         December: "Dezember" } There should only be one (and there is no benefit in having two).
Once the browser finds this problem it goes 🤯 and doesn't execute any of the other code that follows 🙂

Add to Last Line in Code Injection > Footer
<script> $(document).ready(function() { $('body.body-de .sqs-search-page input').attr('placeholder','enter de text'); }); </script>  

I have discovered the code
 
{ .summary-item {
   height: 70%;
     width:100%!important;
}
}
 
I hope this helps others

Hi @paul2009,
thank you for getting back to me. 🙂
I have indeed contacted CSS support, and was advised to remove the CSS codes and slowly add them portion by portion. The codes started working again as I followed the instructions of the agent. Thank you for being helpful with all of us. 🙏

@Naomi-lifelab If some Custom CSS is now working for you, then any problems with CSS are unlikely to be related to the recent fault.
I recommend you start a new thread, telling us the CSS you are using and detailing what is or isn't happening as expected. Screenshots are always helpful 🙂.

Add this CSS
/* Landing page summary arrows */ div#block-yui_3_17_2_1_1649142326010_3915 { .sqs-gallery-controls .next, .sqs-gallery-controls .previous { position: absolute !important; top: 50% !important; transform: translateY(-50%); font-size: 30px !important; right: 50px !important; } .sqs-gallery-controls .previous { right: unset !important; left: 50px !important; } .sqs-gallery-controls .next:before { font-size: 30px; background-color: white; } .sqs-gallery-controls .previous:before { font-size: 30px; background-color: red !Important; }}  

Remove this code from Page Header or Code Injection Header
.Footer, .Mobile-bar { display: none !important; }  

Hello @tuanphan
I was able to resolve it using this code on the height of the block
#footer-landing-page {
min-height: 30vh!important;
}
It didn't need any class how foolish of me. 😅 Thank you for extending your help on this. It took me days to figure this out. 

It totally works! Thank you so much @Jia 🙏

Hi, it appears there's a minimum height set for the section. Try adding this code:
.tweak-index-page-fullscreen-first-page-only .Index-page:first-child, .tweak-index-page-fullscreen-pages-with-backgrounds-only .Index-page--has-image, .tweak-index-page-fullscreen-all-pages .Index-page { min-height:0px; } And if you'd like to remove the additional padding, add this:
.tweak-index-page-fullscreen-first-page-only .Index-page:first-child .Index-page-content, .tweak-index-page-fullscreen-pages-with-backgrounds-only .Index-page--has-image .Index-page-content { padding-top:0px !important; padding-bottom:0px !important; } Let me know how it goes 🙂 

Hello @bangank36
Thank you for helping me on this! 🙏 I have been searching for it in a few days now. I searched wrongly in CSS. I should have also check code injection. Thank you again!

Hi @bangank36

Here is link https://lifelab.world/footer-landing-page

It is originally on the bottom of this page https://lifelab.world/landing-page-sample-1
 
I have attached a video for reference. I hope it helps.
My Video.mp4   All resolved! Thank you so much! I did a work around by using a different method

I did a workaround on this, my client wanted to change the design. All good for now

First, remove your code
<style> .Header, .Footer, .Mobile-bar{ display:none !important; } </style> Next, add this new code
<style> .Footer, .Mobile-bar { display: none !important; } header.Header.Header--top { position: fixed; top: 0; z-index: 99999; background-color: transparent; } nav.Header-nav { visibility: hidden; } </style>  

You can check the following code

It works! Thank you so much! 🙏

Try
@media only screen and (max-width: 767px) { #block-yui_3_17_2_1_1647937945910_5480,#block-yui_3_17_2_1_1647429683089_4990 { padding-top:0 !important; padding-bottom:0 !important; } } Let me know how it works on your site

Hi @tuanphan
I changed the design to slideshow and removed the thumbnails and it totally works! Thank you for this. 🙏 

Thank you so much @Jia

No worries, add this code for mobile:
@media screen and (max-width: 640px) { .sqs-row+.sqs-row .sqs-block:not(.float):first-child { padding:0px !important; } }

It works! I have been trying to put the correct block-yui. But I was really confused. Thank you so much @Jia