SHRINE Theme - Country selector colour change

Hi,

I need to change the colours of the text ‘Country & Reigon’ from Black to White in my footer.

Also the white button box beneath it should have the Pink text that is shown elsewhere on the site.

Please help me achieve this - https://ultrapads.co/

1 Like

Hello @AAABARTON1 , to change the colours of the text ‘Country & Reigon’ from Black to White in footer.

Please follow these steps to add this CSS code:

  1. Go to your Online Store
  2. Click on “Themes”
  3. Select “Edit code”
  4. Open your CSS file. If you have a custom CSS file, open that instead.
  5. If you can’t find your custom CSS file, open “base.css” OR “theme.css”.
  6. Add the following code at the end of the file.
localization-form h2#FooterCountryLabel {
    color: #fff;
}

Feel free to reach out if you have any questions or need assistance.
Best Regards,
DWS.

Hey @AAABARTON1

Follow these Steps:

  1. Go to Online Store

  2. Edit Code

  3. Find theme.liquid file

  4. Add the following code in the bottom of the file above tag


RESULT:

If I managed to help you then, don’t forget to Like it and Mark it as Solution!

Best Regards,
Moeed

@AAABARTON1 ,

To change the colours of the text ‘Country & Reigon’ from Black to White in footer.

Please follow these steps to add this CSS code:

  1. Go to your Online Store
  2. Click on “Themes”
  3. Select “Edit code”
  4. Open your CSS file. If you have a custom CSS file, open that instead.
  5. If you can’t find your custom CSS file, open “base.css” OR “theme.css”.
  6. Add the following code at the end of the file.
localization-form h2#FooterCountryLabel {
    color: #fff;
}

To add the white button box beneath it should have the Pink text,

Please follow these steps to add this CSS code:

  1. Go to your Online Store
  2. Click on “Themes”
  3. Select “Edit code”
  4. Open your CSS file. If you have a custom CSS file, open that instead.
  5. If you can’t find your custom CSS file, open “base.css” OR “theme.css”.
  6. Add the following code at the end of the file.
.localization-form__select:before,
.localization-form__select:after{
    content: unset;
}

button.disclosure__button.localization-form__select.localization-selector.link.link--text.caption-large {
    background: #fff !important;
    font-size: 1.6rem;
    letter-spacing: .1rem;
    line-height: calc(1 + .2 / var(--font-body-scale));
    font-weight: 700;
}

.localization-form__select .icon-caret path {
    fill: #f9447b !important;
}

Feel free to reach out if you have any questions or need assistance.
Best Regards,
DWS.

Hi, thanks this worked perfectly!

When I click this button - how can I change the drop down box background to White with Pink Text?

Thanks again,

Andrew

1 Like

Please add the CSS code below,

.disclosure__list-wrapper ul#FooterCountryList li.disclosure__item > *,
.disclosure__list-wrapper ul#FooterCountryList li.disclosure__item a > * {
    color: #f9447b !important;
}
.disclosure__list-wrapper {
    background: #fff;
}


Feel free to reach out if you have any questions or need assistance.
Best Regards,
DWS.

legend! thanks so much :slightly_smiling_face: