Removing text shadow from Debut

[secretsshop]

Hey! I would like to remove shadows from all heading on my main page. TRied to search the answer but could only fount unanswered thread. Does anybody accomplish that before? Any suggestions? Thanks! Page is secrets.shop

[KetanKumar]

Hello, @secretsshop 

Welcome to the Shopify community!
Please share your site URL,
So I will check and provide a solution here.

[secretsshop]

Hi! Secrets.shop

[KetanKumar · Accepted solution]

@secretsshop 

Thankd for URL.

1. Go to Online Store->Theme->Edit code
2. Asset->/theme.scss.liquid->paste below code at the bottom of the file.

.mega-title, .mega-subtitle {
    text-shadow: none !important;
}

[secretsshop]

Thanks! You are the best

[rjonsixteenth]

Hi 

I would like to to remove the text shadow from Debut image gallery captions. The above solution solved my heading dilemma but I would like to remove the shadow from all the text on my website.

Thank you

 

[KetanKumar]

Hello,, @rjonsixteenth 

Welcome to the Shopify community!
and Thanks for your question.

Please share your site URL,
So I will check and provide a solution here.

[rjonsixteenth]

Yes its on-sixteenth.myshopify.com

[KetanKumar]

@rjonsixteenth 

Thanks for your,

sorry but your store is password protect can you please share us.

[rjonsixteenth]

Hi, password now disabled. 

[KetanKumar]

@rjonsixteenth 

Thanks for update but sorry still same issue

[rjonsixteenth]

Whoops sorry! I didnt save it. Its live now

[KetanKumar]

@rjonsixteenth 

Thanks 

1. Go to Online Store->Theme->Edit code
2. Asset->/theme.scss.liquid->paste below code at the bottom of the file.

.image-bar__caption {
text-shadow: none;
}

[rjonsixteenth]

Amazing! It worked Thank you so much!

[KetanKumar]

@rjonsixteenth 

Thanks for your supoort and compliments.

[MRami]

Hi @KetanKumar !

Thanks for this, it works for me as well for the full screen site (image with text overlay). 

However, when resizing for mobile, the shadow returns. Do I need to add anything specific to remove the shadow also for the mobile version?

Thanks!

M

[KetanKumar]

@MRami 

Sorry you are facing this issue, it would be my pleasure to help you.

Welcome to the Shopify community!😊
Thanks for your good question.

Please share your site URL,
I will check out the issue and provide you a solution here.

[MRami]

Hi @KetanKumar !

Thanks, when I tried your solution, the fix was not responsive. Meaning that if I went below 750px width, the shadow would return. 

I solved the issue another way by putting the shadow values to 0. Is this a correct solution?

.mega-title,
.mega-subtitle {
  color: var(--color-overlay-title-text); }
  .hero .mega-title, .hero
  .mega-subtitle {
    /*Adjusted text-shadow to remove shadow also for mobile version
    original: text-shadow: 0 0 4px rgba(0, 0, 0, 0.4)*/
    text-shadow: 0 0 0 rgba(0, 0, 0, 0); }
  @media only screen and (min-width: 750px) {
    .mega-title,
    .mega-subtitle {
      text-shadow: 0 0 0 rgba(0, 0, 0, 0); } }

BTW, how would you fix the fact that it is not responsive? I have similar issues with other custom text.

Thanks, 

Matthias

[KetanKumar]

@MRami 

yes please give me store url so i will guide you

[ArturoCloud]

It works perfectly. Thank you so much 🙂

[KetanKumar]

@ArturoCloud 

its my pleasure to help us 

[uniklook]

Hello

I am having the same problem with the shadow text but having a hard time fixing it. Can you please help. thanks

Magali