Change opacity on landing page header

Site URL: https://elk-flamingo-2j9s.squarespace.com/config/help

Hi everyone

My landing page image is to bright and I would like to have the header slightly more opaque so it gets easier to read the menu. Could you please let me know how I can do this and making sure I just change the opacity on this specific page?

Thank you

Your page is private, please set up a site wide password so us can check

Hi @bangank36

Sorry, I missed that bit. Password is: imaginar

Let me know if you could help! Thank you so much in advance!

On 11/14/2020 at 4:37 AM, Imaginar said:

Hi @bangank36

Sorry, I missed that bit. Password is: imaginar

Let me know if you could help! Thank you so much in advance!

Add this to Design->Custom Css, you can change the value from 0 - 1 to test

section[data-section-id="5fad070e54d01722c157eb5a"] .section-background-overlay {
  opacity: 0.55 !important;
}

Thank you for this @bangank36 but I was hoping to just make the bit of the site header more opaque, I would like to keep the rest of the section (image) on the original color. Is this possible?

Thank you

On 11/18/2020 at 5:53 PM, Imaginar said:

Thank you for this @bangank36 but I was hoping to just make the bit of the site header more opaque, I would like to keep the rest of the section (image) on the original color. Is this possible?

Thank you

Have you solved this yet?

On 11/21/2020 at 3:46 PM, tuanphan said:

Have you solved this yet?

No.. could you please help @tuanphan?

Thank you very much.

3 hours ago, Imaginar said:

No.. could you please help @tuanphan?

Thank you very much.

Please try this snippet

body[data-menu-overlay-theme-switcher="true"] .header:after {
  content: '';
  position: absolute;
  width: 100%;
  height: 100%;
  background: #000;
  top: 0;
  left: 0;
  opacity: 0.55
}

19 hours ago, bangank36 said:

Please try this snippet

body[data-menu-overlay-theme-switcher="true"] .header:after {
  content: '';
  position: absolute;
  width: 100%;
  height: 100%;
  background: #000;
  top: 0;
  left: 0;
  opacity: 0.55
}

 

Hi @bangank36

Thank you.

Please see how this shows up..I don't think the code is right..