Change size of header image on mobile version brooklyn theme

Solved

hii, @Emelie 
Paste this code on top of the theme.css file.

@media only screen and (min-width: 992px) {
.header-wrapper {
    margin-top: -120px !important;
    height: 120px !important;
}
}

Thank You.

If helpful, please Like and Accept Solution.
if you Want to modify or Customize your theme,
Hire us. or Want to know more. Read our Shopify Blogs.Email us: sales@zworthkey.com Get support
0 Likes
Emelie
Excursionist
26 0 10

@Zworthkey 

Thanks for your reply   it helped a little bit, though the header should be even a little bit higher up. The navigation bar should be over the header picture. Now the navigation bar looks grey due to the white padding on the very top. 
Now it looks like this:

Emelie_0-1632204362617.png

 

I pasted your code on the very bottom now. Where do I paste the code on the top? On the very top or after all the "definitions" etc? (pls excuse my non-existing code-language :))

 

0 Likes
KetanKumar
Shopify Partner
23028 2319 8550

@Emelie 

what's issue now?

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
Emelie
Excursionist
26 0 10

@KetanKumar 
Right now it is still a little white padding on top of the image which makes the navigation bar looks grey when tuning in on the website. It looks like this: 

Skärmbild 2021-09-21 080219.jpg

I want the navigation bar to look like this: (on this printscreen I have scrolled down a little bit so that the navigation bar is on top of the header image, whihch is how I want it to look when tuning in on the website) 

how i want it.jpg

 

KetanKumar
Shopify Partner
23028 2319 8550

@Emelie 

thanks for it

We have checked for this issue in real system and browserstack but it is working ok. In which system configuration or browser you are checking?

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
Emelie
Excursionist
26 0 10

@KetanKumar Thank you so much for checking!

I am using Chrome. How does it look on your computer? 

0 Likes
Emelie
Excursionist
26 0 10

@KetanKumar Also I saw now that the navigation bar has disappeared on all pages except the main page. Do you know what has happened? I took a screenshot on how it looks like on the other pages. Would be very very greatful if these issues were fixable : D 

Conclusion: Two issues...
1) The navigation bar on main page is too far up (the padding on top of header image must disappear)
2) The navigation bar is totally gone on all pages except the main page. 

Skärmbild 2021-09-22 213534.jpg
I cross my fingers that this is possible to fix!

KetanKumar
Shopify Partner
23028 2319 8550

@Emelie 

can you please confirm this look other pages?

KetanKumar_0-1632383352267.png

 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
Emelie
Excursionist
26 0 10

@KetanKumar 
That is strange, on my computer (both on laptop screen and big external screen) it looks like my printscreens in previuos repy. I cannot see the navigation bar on any other page except home page. 

KetanKumar
Shopify Partner
23028 2319 8550

This is an accepted solution.

@Emelie 

can you please try this code

@media only screen and (min-width: 992px) {
.template-index .header-wrapper {
    margin-top: -110px !important;
    height: 110px !important;
}
.header-wrapper {
    margin-top: 0px !important;
    height: auto !important;
}
}
If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing