Changing color of e-mail and country box - Sense theme

KiavusPetstore · ‎07-15-2024

Hi guys,

I'd like to change the color of the box ''email'' and ''country/valuta'' to the color #95B4F0.

Can anyone help me with that code?

Website is kiavuspetstore.com

Dan-From-Ryviu · ‎07-15-2024

Code updated

.disclosure .localization-form__select,
.newsletter-form__field-wrapper .field__input {
background: #95B4F0 !important;
color: #FDFBF7 !important;
}
.newsletter-form__field-wrapper .field:after,
.localization-form__select:after {
border: unset !important;
box-shadow: unset !important;
}
.newsletter-form__field-wrapper .newsletter-form__button .icon,
.newsletter-form__field-wrapper .field__label {
color: #FDFBF7 !important;
}

- Ryviu - Product Reviews & QA app: Collect customer reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Shopee, Dhgate and CSV.
- Reton: Loyalty & Rewards - Earn points through tasks, redeem for discounts, and enjoy exclusive VIP rewards!
- Lookfy Gallery: Lookbook Image - Gain customers with photo gallery, video & shoppable image
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- En...Sign up now.

View solution in original post

Dan-From-Ryviu · ‎07-15-2024

Hi @KiavusPetstore

Please go to Online Store > Themes > Customize > Theme settings > open Custom CSS, add this code, and save change.

.disclosure .localization-form__select,
.newsletter-form__field-wrapper .field__input {
background: #95B4F0 !important;
}

- Ryviu - Product Reviews & QA app: Collect customer reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Shopee, Dhgate and CSV.
- Reton: Loyalty & Rewards - Earn points through tasks, redeem for discounts, and enjoy exclusive VIP rewards!
- Lookfy Gallery: Lookbook Image - Gain customers with photo gallery, video & shoppable image
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- En...Sign up now.

KiavusPetstore · ‎07-15-2024

Perfect Dan, thank you for your fast reply! I forgot to ask, is it also possiblle to make the text inside the blue white (#FDFBF7) now?

Dan-From-Ryviu · ‎07-15-2024

Code updated

.disclosure .localization-form__select,
.newsletter-form__field-wrapper .field__input {
background: #95B4F0 !important;
color: #FDFBF7 !important;
}
.newsletter-form__field-wrapper .field:after,
.localization-form__select:after {
border: unset !important;
box-shadow: unset !important;
}
.newsletter-form__field-wrapper .newsletter-form__button .icon,
.newsletter-form__field-wrapper .field__label {
color: #FDFBF7 !important;
}

- Ryviu - Product Reviews & QA app: Collect customer reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Shopee, Dhgate and CSV.
- Reton: Loyalty & Rewards - Earn points through tasks, redeem for discounts, and enjoy exclusive VIP rewards!
- Lookfy Gallery: Lookbook Image - Gain customers with photo gallery, video & shoppable image
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- En...Sign up now.

leoking · ‎07-15-2024

Hey can you please help me on my recent post it would be very appreciated

ajaycthomas · ‎07-15-2024

You can achieve this by adding the following CSS code to your theme file, just above the </head> closing tag:

<head>

<style>
div#FooterCountry-country-results,
.country-filter,
input#country-filter-input,
button.disclosure__button.localization-form__select.localization-selector.link.link--text.caption-large,
input#NewsletterForm--sections--20160497025290__newsletter {
background-color: #95B4F0 !important;
}
</style>
</head>

This code will change the background color of the "email" and "country/value" boxes to #95B4F0.

Hope this helps!

Best, Ajay

Visit https://www.sweans.com

GTLOfficial · ‎07-15-2024

Hello @KiavusPetstore

Go to online store ---------> themes --------------> actions ------> edit code------->base.css
at the bottom of the file.

.newsletter-form__field-wrapper .field__input, .disclosure .localization-form__select {
background: #95B4F0 !important;
}

and the result will be

If this was helpful, hit the like button and mark the job as completed.
Thanks

- Buy me a Pizza
- If helpful then please Like and Accept Solution.
- Want to modify or custom changes or bug fix on the store Hire me. GTL web solutions
- Want Complete Storefront: Send an email ⇨- Email: info@gtlofficial.com - Skype: ritesh_27dh

Anshul_arora · ‎07-15-2024

Hello @KiavusPetstore ,

Please add the below code at the bottom of the theme.liquid file before </body> tag and save for the desired change.

<style>
input#NewsletterForm--sections--20160497025290__newsletter,
button.disclosure__button.localization-form__select.localization-selector.link.link--text.caption-large
{
background: #95B4F0;
}
</style>

I hope the code helps you.

Thank you.

Please remember to like and accept the solution to help other store owners.

For Shopify Design & Development | Custom Coding -Visit Here

BSS-TekLabs · ‎07-15-2024

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

- Then find the base.css file.
- Then add the following code at the end of the file and press 'Save' to save it.

.newsletter-form__field-wrapper .field__input, .localization-form:only-child .localization-form__select  {
 background: #95B4F0 !important;
}

- Here is the result you will achieve:

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

If our suggestions are useful, please let us know by giving it a like or marking it as a solution.

Salepify: Efficiently increase sales conversion with sale-driven features like auto add to cart, free gifts (free plan available)

Salemate: Boost your AVO with 2-layer offer, countdown upsell in your post purchase page

BSS Commerce - Full-service eCommerce Agency | Use Shopify for 1$ in the first month now

BSS-TekLabs · ‎07-15-2024

.newsletter-form__field-wrapper .field__input, .localization-form:only-child .localization-form__select  {
 background: #95B4F0 !important;
}
.newsletter-form__field-wrapper .field__input::placeholder, .newsletter-form__field-wrapper .field, .localization-form:only-child .localization-form__select {
  color: white !important;
}

You can use this code if you want the color white @KiavusPetstore

If our suggestions are useful, please let us know by giving it a like or marking it as a solution.

Salepify: Efficiently increase sales conversion with sale-driven features like auto add to cart, free gifts (free plan available)

Salemate: Boost your AVO with 2-layer offer, countdown upsell in your post purchase page

BSS Commerce - Full-service eCommerce Agency | Use Shopify for 1$ in the first month now

Changing color of e-mail and country box - Sense theme

Changing color of e-mail and country box - Sense theme

Community Blog Articles