Home page unnecessary white space

Solved
Highlighted
Excursionist
30 2 5

Hi all,

I am using the brooklyn theme and I have recently implemented a sticky header. I am not sure if this is what caused the issue with the unnecessary white space on the home page, since I noticed it a few hours later. Here are two pictures of what I exactly mean:

1. https://gyazo.com/fc383410428fa2c24da0c6088e9b9f3c

2. https://gyazo.com/8880b4e218559456eda0b87f4c3ad370

 

The white space as seen above only applies to the home page and not product pages for example. 

 

The additional code that I implemented (not sure if this is the issue): 

/* Sticky header code */ 

.header-wrapper, .header-container {
  position: fixed;
  z-index: 1;
  background-color: rgba({{ settings.color_body_bg }}, 0.0);
  width: 100%;
}
.header-sticky .header-wrapper {
  background-color: rgba({{ settings.color_body_bg }}, 1);
  @include at-query($min, $medium) {
  .logo img{
    height: 60px;
   }
  }
  .site-nav {
      transition: all .3s ease, height .8s ease;
   -webkit-transition: all .3s ease, height .8s ease;
    -o-transition: all .3s ease, height .8s ease;
    margin-top:0 !important;
  }
}
.header-sticky .header-wrapper {
}
.main-content { 
  padding-top: 0px; 
}

/*Bof padding non index pages*/
body:not(.template-index) .main-content {
    padding-top: 150px;/*this is based on 260px above but that seems huge!*/
}
/*Eof padding non index pages*/

.shopify-payment-button {
  z-index: 0; 
}

Hope that you guys can help me! Thanks in advance.

 

0 Likes
Excursionist
30 2 5

This is an accepted solution.

Fixed. Was a custom html section that was the issue, which I never touched. 

0 Likes