Change background of menu dropdown and make it wider DAWN theme

Solved

Change background of menu dropdown and make it wider DAWN theme

CarCleanCC
Explorer
57 0 8

Hello!

 

I am using the dawn theme and my URL is carcleansweden.se.

 

I would like to make the whole background of my dropdown menu the same color and make it wider so the first menu option fits on 1 row:

CarCleanCC_0-1734461735294.png

I would hugely appreciate the help!

Accepted Solution (1)

Asad-Mahmood
Navigator
300 51 56

This is an accepted solution.

Go to your online store -> edit code -> base.css file and paste this code there

details[open]>.header__submenu {
    width: max-content;
}


this will fix the width
please confirm which color you want for background

 

If my solution has been helpful, you can consider supporting me via Buy Me a Coffee.
Hire me: asadmahmood8470@gmail.com
WhatsApp





View solution in original post

Replies 5 (5)

Asad-Mahmood
Navigator
300 51 56

This is an accepted solution.

Go to your online store -> edit code -> base.css file and paste this code there

details[open]>.header__submenu {
    width: max-content;
}


this will fix the width
please confirm which color you want for background

 

If my solution has been helpful, you can consider supporting me via Buy Me a Coffee.
Hire me: asadmahmood8470@gmail.com
WhatsApp





CarCleanCC
Explorer
57 0 8

I would like to have the entire background completely white. Thank you!

Asad-Mahmood
Navigator
300 51 56

use this code for that

details[open]>.header__submenu {
    width: max-content;
    background: #fff;
}
If my solution has been helpful, you can consider supporting me via Buy Me a Coffee.
Hire me: asadmahmood8470@gmail.com
WhatsApp





CarCleanCC
Explorer
57 0 8

Thank you so much! I have one more question if you don't mind. The text color is good on the home screen but for some reason its grey on the other pages when not selected:

CarCleanCC_0-1734463764988.png

Is it possible to have the text always completely black on all pages?

 

Thank you so much for your help!

Asad-Mahmood
Navigator
300 51 56

you this code in your base.css file for that

p{
color:#000 !important;
}
If my solution has been helpful, you can consider supporting me via Buy Me a Coffee.
Hire me: asadmahmood8470@gmail.com
WhatsApp