How Do I Change Colours For Individual Texts?

Multi-Vendor Questions
1

Hi,

I am close to launching my MV site to the public however I am having a hard time editing colours. I have found that the built in theme editor is horrible to use. Some times changes do not display until I refresh the page 3 or 4 times etc and more often than not if I change the colour of a certain text on one page, I then find that it can't be seen on another section of the site due it being displayed on a different colour background. I then change the either the text colour again or the background and then of course it screws the colours up on some other part of the site and so on.

I went on like this for a while before finding a combination that seems to work reasonably well on almost all parts of the site. But I am still really not happy with it currently.

I am using a dark theme which probably doesn't help but this is the style I prefer.

Anyway, one particular font colour that I haven't been able to edit are the title fonts on the checkout page. I was able to add some simple html in the translations settings in admin to edit the font colours for the terms and conditions and privacy policy sections on the checkout page. However this same method didn't seem to work for the title sections.

I have attached an image highlighting the text that I want to edit.

https://drive.google.com/file/d/1C_R8tK6H3ayCtoIzousYMlGgjjh3fotw/view?usp=sharing

In addition it would be a great help if I could figure out how to edit the font colours on all sections of the site with some more detail rather than simply using the theme editor which doesn't seem to work well at all.

Thanks in advance. :grin:

2

Try to add the following code to the CSS section of the Theme editor

.litecheckout__step-title {
    color: #fff;
}
3

Thanks eComlabs.

Apologies for the late reply.

So that worked for the title text as mentioned. However, strangely, as you can see in the following screenshot, the text for the address 'area' and 'country' have now changed colour and are almost impossible to see. In the previous screenshot they were grey and just visible (just enough to work). Now they have changed. I have not changed anything else at all with regards themes, colours, text etc etc etc.

Am I missing something here or could there be something odd going on with my site?

https://drive.google.com/file/d/1WwQF88Ua8APSvp_3t2aWuJKu5BjT7o2l/view?usp=sharing

Thanks again.

Gav.

4

Try to add

.litecheckout .litecheckout__input--selectable--select:not(:placeholder-shown), .litecheckout .litecheckout__input {
    background: #fff;
    color: #000;
}