Debut Theme - Make the Header Transparent

Tourist
4 0 2

Has anyone figured this out?

New Member
2 0 0

I only see theme.css in my asset folder. And adding the included code doesn't make my header transparent. Is there an update to the theme? 

 

https://exo-6.com/

pw: cohbos

0 Likes
New Member
1 0 0

Same here, there is no theme.scss.liquid. Can't find any solution

0 Likes
Shopify Partner
6 0 4

Please check this. It will solve the problem for Debut theme. Not the best way but no problem in this solution. Thanks

 

 

//Adding ID to header and header-grid

To header => id="site-header"
To header => id="site-header-grid" 


// Navbar transparent css

#site-header {
  position: fixed;
  padding: 0px 20px 0px 20px;
  z-index: 1;
  background: #00ffff00;
}
#site-header-grid {
  background: #faebd700 !important;
}

Javscript:

// Navbar transparent and fixed header
var nav = document.getElementById('site-header');
var nav_grid = document.getElementById("site-header-grid");

window.onscroll  = function(){
	if (window.pageYOffset > 100 ){
		nav.style.background = "#fff";
      	nav_grid.style.background = "#fff";
      	
	}
	else{
		nav.style.background = "#00ffff00";
      	nav_grid.style.background = "#00ffff00";
	}
}
0 Likes
New Member
1 0 0

I need help with the warehouse theme. 

I need the header to be transparent and when scrolling it turns the background into white. I already tried to make it transparent and I have done it but it I use sticky header it doesn't look good.

Thanks,

0 Likes
Visitor
1 0 0

hello i tried this code on my store but it doesn't work on centered menu 

0 Likes