Change the drop down box radius on Trade Theme

[Mabinibooks]

Hello, good evening!

I just need some assistance in changing the drop down box radius on Trade Theme. This is the current look of the drop down (1st picture) , I want it to look like this (2nd picture). Thank you!

 
(1st picture)

(2nd picture)

Thank you!

[BSS-TekLabs · Accepted solution]

- Here is the solution for you @Mabinibooks 
- Please follow these steps:

- Then find the theme.liqid file.
- Then add the following code at the before tag </head> and press 'Save' to save it.

 

<style>
@media only screen and (min-width: 600px) {
.mega-menu {
    position: relative !important;
}
.mega-menu[open] .mega-menu__content {
    width: fit-content !important;
}
}
</style>

[BSS-TekLabs · Accepted solution]

<style>
@media only screen and (min-width: 600px) {
.mega-menu {
    position: relative !important;
}
.mega-menu[open] .mega-menu__content {
    width: fit-content !important;
}
.mega-menu__list {
    display: flex !important;
}
}
</style>

Can you replace to this code @Mabinibooks 

[BSS-TekLabs · Accepted solution]

- Here is the solution for you @Mabinibooks 
- Please follow these steps:

- Then find the theme.liqid file.
- Then add the following code at the before tag </head> and press 'Save' to save it.

 

<style>
@media only screen and (min-width: 600px) {
.mega-menu {
    position: relative !important;
}
.mega-menu[open] .mega-menu__content {
    width: fit-content !important;
}
}
</style>

[BSS-TekLabs]

- Here is the result you will achieve:

- Please press 'Like' and mark it as 'Solution' if you find it helpful. Thank you.

[Mabinibooks]

It worked, but there's an error on this menu item

Also, how can I make the background transparent?

[BSS-TekLabs · Accepted solution]

<style>
@media only screen and (min-width: 600px) {
.mega-menu {
    position: relative !important;
}
.mega-menu[open] .mega-menu__content {
    width: fit-content !important;
}
.mega-menu__list {
    display: flex !important;
}
}
</style>

Can you replace to this code @Mabinibooks 

[Mabinibooks]

It's better now, thanks again. One last thing, how can I make it transparent background?

[BSS-TekLabs · Accepted solution]

<style>
@media only screen and (min-width: 600px) {
.mega-menu[open] .mega-menu__content {
    background: transparent !important;
}
}
</style>

If you want transparent background can you add more this code @Mabinibooks 

[BSS-TekLabs]

However, it doesn't look very prominent @Mabinibooks .

[Mabinibooks]

Yes, I reversed the changes, but still thank you