HOW TO MAKE HOMEPAGE IMAGE FULL SCREEN ON MOBILE? (Dawn theme)

Technical Q&A
1

Hello!

I’m new to shopify! I have no experience with coding.

Could you please help me? I am using the “Dawn” theme.

I used this to make my header transparent and it worked well!

https://jotting.com/shopify/how-to-make-dawn-theme-header-transparent

But: I would like to make the homepage image appear full screen on mobile. ( see example )

I would like to have a full screen image appear not only on desktop but also on mobile.

How do I do this?

My site URL: https://perziamalayeri.myshopify.com

Password: perzia

Thank you!

Perzia

2

I want to check your site and is not launch yet, and am not able to see it. can you check your store and let me know where to render help

3 
@media screen and (max-width: 749px) {
  .banner--large:not(.banner--mobile-bottom):not(.banner--adapt) .banner__content {
     min-height: 100vh; 
  } 
}

add the code above to your css

4

I removed the password. is it possible for you to see it now?

Thanks!!

5

How do I do this? Where is my css?

I tried putting it above the base.css file in Assets folder. But It doesn’t work.

Thankyou Raymond

6

Hi! I removed the password. please see if you can see my website now?

Thanks!

7

hi! Thanks so much for reply. Can you see it now?

8

Thank you!!! I added this Below: section-image-banner. NOT above!

This worked then. Thanks again.

9

Where exactly did you paste this? Under which file? ANY help is appreciated! :slightly_smiling_face:

10

I’d like to know this too. Did you ever find out? That page is exactly what I want to do and I get copying the css but where to put it and find the actual file is what I can’t find, unless I’m missing something obvious.