Support » Plugin: WooCommerce » Change input text color on checkout page

  • Resolved 7gorgonzolas

    (@7gorgonzolas)


    Hello everyone,

    I am trying to change the input text color on the checkout page. At the moment, when the customer fills in shipping information, the input text is a dark grey (which is hard to read against a black background).

    I would be thrilled if someone could provide some custom CSS to change the input text in every form field of the checkout page to white instead of grey.

    Thanks!

    The page I need help with: [log in to see the link]

Viewing 4 replies - 1 through 4 (of 4 total)
  • Plugin Support Rynald0s

    (@rynald0s)

    Automattic Happiness Engineer

    Hi @7gorgonzolas!

    See if the following CSS code helps:

    form input[type="text"] {
        color: #fff;
    }

    You can add that CSS code to the “Additional CSS” section found in your customizer, under “Appearance > Customizer > CSS”

    Cheers!

    • This reply was modified 3 months, 2 weeks ago by Rynald0s.

    Beautiful.

    Thank you kindly.

    This forum is always so helpful.

    Hi There @rynald0s – This was very helpful, thank you and I just updated the text color to black.

    I have a related issue I’m hoping you could assist with. On the Cart page, before you proceed to checkout, there are two drop-down menus listed, one for the Country, and one for the State.

    1) I would also like this color to be changed to black
    2) On the far right of each of these selection box, where the drop-down button should be, the whole box is completely black and you can’t see that this is a drop-down. Would like to change this to a light color.

    Looks like it is located here: .fusion-body .woocommerce-shipping-calculator

    Thanks for your help!

    Tom

    • This reply was modified 1 week, 2 days ago by TrogsWorld.
    Plugin Support Rynald0s

    (@rynald0s)

    Automattic Happiness Engineer

    Hi @trogsworld!

    See if the following CSS code helps:

    .select2-results__option {
    color: black;
    }

    Cheers!

Viewing 4 replies - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.