Currency box customization - custom CSS in the app BUCKS

[elotomo]

Hello, 

I would like to customize the currency box in the BUCKS application. I want this box in mobile navigation to look like the language selection above. I have the option to customize CSS in this application, but unfortunately I don't know how or if it's even possible.

Store: https://www.drollsport.com/

Password: Wixa

Theme: Symmetry 

App: BUCKS Currency Converter PRO++

[vinh0225]

@elotomo 

This has some difficulty to customize the style. Here is what I tried to change the style:

.buckscc-currency-box .buckscc-currency-wrapper {
     width: 100%;
     margin-left: 0;
}

.buckscc-currency-box .buckscc-currency-wrapper .buckscc-select .buckscc-select-styled {
     width: 100% !important;
     padding: 20px 18px 20px 5px;
}

And here is the result:

I know this should be updated more.
Anyway, I hope this can help you even a little.

[Sweans]

Hi @elotomo,

You can fix this issue by add a simple line of css.

.hxoSelectTheme.hxo-mobile_relative { 
width: 95% !important;
 }
.hxoSelectTheme .buckscc-select-styled {
 justify-content: space-between !important; 
} 
@media only screen and ( max-width: 500px) {
 .hxoSelectTheme.hxo-mobile_relative {
 width: 94% !important; 
} 
} 

Add this code to your main.css

Go to your online store > themes > click the three dots on current active theme > edit code > search main.css in left side bar > open and paste the code there.

 I hope this helps! If it does, please like it and mark it as a solution!
If you need further assistance, feel free to reach out!

Regards,
Sweans