gatsby-theme-musician icon indicating copy to clipboard operation
gatsby-theme-musician copied to clipboard

Published 20 hours ago • verified publisher icon ekafyi

Banner cut off on mobile

Open ldub opened this issue 5 years ago • 3 comments

You can see that the banner gets cut off on mobile (horizontal cut off point circled in red below):

undefined

On your demo site, it doesnt look that bad because the banner's background is black. However, if the banner doesn't have a black background then it really sticks out. Is there any way to make it stretch/cover the banner vertically to fit the background?

ldub avatar Sep 19 '19 06:09 ldub

Yes, experiencing the same problem with the https://arichardmusic.netlify.com site that's in development. Very pronounced in this case because of the red photo background.

arichardmusic avatar Sep 19 '19 20:09 arichardmusic

@arichardmusic as a quick stopgap, commenting out this line:

https://github.com/ekafyi/gatsby-theme-musician/blob/ada534c670954ca118827cdd7e415e75c6831923/theme/src/gatsby-plugin-theme-ui/componentStyles.js#L11

helps with this problem. it does not make the background stretch, but instead makes the black portion smaller.

ldub avatar Sep 20 '19 04:09 ldub

@arichardmusic as a quick stopgap, commenting out this line:

https://github.com/ekafyi/gatsby-theme-musician/blob/ada534c670954ca118827cdd7e415e75c6831923/theme/src/gatsby-plugin-theme-ui/componentStyles.js#L11

helps with this problem. it does not make the background stretch, but instead makes the black portion smaller.

Is there a way to shadow this component to accomplish this?

charles-hood avatar Jan 24 '20 20:01 charles-hood