Why does my nav menu gradient transition differ on mobile and PC?

[GustavoAlves]

Look at the gradient transition from the nav menu to the header for the cell phone, why is it like this? And on PC is it correct?

website: www.colorluzes.com.br

[GemPages · Accepted solution]

Hello @GustavoAlves ,

It's GemPages support team and glad to support you today.

I checked your website  and found that the cause of this issue is due to missing code for mobile screen.

I would like to give you the recommendation to support you so kindly follow the steps below:

1. Go to Online Store > Theme > Edit code of your current theme

2. Open your theme.liquid theme file

3. Paste the below code before </head>

<style>
@media(max-width: 640px){
 .header__search-bar-wrapper {
   background-image: linear-gradient(90deg, rgba(0,11,51,1) 0%, rgba(53,0,64,1) 100%)!important
 }
}
</style>

For example,

If you require any further information, feel free to contact me.

Best regards,
GemPages Support Team