FULL SCREEN CONTENT DISPLAY ON PASSWORD PAGE FOR DESKTOP/MOBILE

Store Design
, , ,

Topic summary

Goal: Make the Shopify password page hero/banner fill the entire viewport on both desktop and mobile (Spotlight theme).

Issues reported:

  • Desktop shows a persistent white “password footer” that can’t be removed via theme settings.
  • Mobile has excessive white space from the email signup banner and the password footer, preventing the visual/GIF from occupying the full screen.

What was requested:

  • A specific CSS solution to achieve a true full-screen experience on both devices.

References and materials:

  • Store URL and password were provided for review.
  • Design reference: https://www.aimeleondore.com/
  • A mobile reference video link was shared as a local file path (likely not accessible to others).
  • Multiple screenshots attached for desktop and mobile views.

Latest update:

  • A helper requested the URL/password; the store owner supplied them and reiterated the requirements with references and screenshots.

Status and next steps:

  • No CSS or code fix has been provided yet. Discussion remains open, pending a concrete CSS approach to remove/override the footer and signup space and set the hero to full viewport height on desktop and mobile.
Summarized with AI on January 19. AI used: gpt-5.
1

I am wanting my image banner to be full screen for desktop and mobile–my store is currently using the “Spotlight” theme. Currently for my desktop theres a white “password footer” at the bottom that cannot be remove when using shopify customization theme settings. When viewing on mobile the “email signup banner” and “password footer” areusing a lot of white space and I would like my visual/gif to occupy the entire screen when viewing. I’ve provided a screen shot of both desktop and mobile views also

mobile view
mobile view407×1298 122 KB

desktop view
desktop view1899×1292 330 KB

I was told I would need a specific CSS code to create a full screen experience on both mobile and my desktop.

Thank you in advance for taking the time to help!!

1 Like
2

Hello There,

Please share your store URL and password.
So that I will check and let you know the exact solution here.

3

Thank you for reaching out

URL: https://arounddeway.com/password

providing references below

Password: ■■■■■■■

file:///Users/agray/Downloads/RPReplay_Final1693920474.MP4

https://www.aimeleondore.com/

4

providing reference:

desktop reference

https://www.aimeleondore.com/

mobile reference:

file:///Users/agray/Downloads/RPReplay_Final1693920474.MP4

I am wanting my image banner to be full screen for desktop and mobile–my store is currently using the “Spotlight” theme. Currently for my desktop theres a white “password footer” at the bottom that cannot be remove when using shopify customization theme settings. When viewing on mobile the “email signup banner” and “password footer” areusing a lot of white space and I would like my visual/gif to occupy the entire screen when viewing. I’ve provided a screen shot of both desktop and mobile views also

AROUNDdeWAY_0-1693921501852.png
AROUNDdeWAY_0-1693921501852.png313×998 84.4 KB

AROUNDdeWAY_1-1693921502001.png
AROUNDdeWAY_1-1693921502001.png999×680 600 KB

I was told I would need a specific CSS code to create a full screen experience on both mobile and my desktop.

Thank you in advance for taking the time to help!!