Theme colours

  • The basic theme colors in the style section are not so good…. dark row backgrounds (as in the header row) need a light color text. While this can be chosen, i.e. white, that text colour then applies to all the following rows which, unlike the header row, are most likely to be white/grey. These rows require a DARK text color – but this is not selectable without the dark colour text also being used in the header row. Black on black is…..well, invisible!

    In the global settings I’ve clicked OFF for ‘Disable Style’…and then I’ve styled the header and table rows for good legibility. I hit save and then review my frontend…but nothing has changed, the poor theme style settings are still there. Refreshed…no change. Update page…no change. ??

    Global settings does not appear to be overriding the (rather non-sensical) default theme styles.

    • This topic was modified 1 week, 5 days ago by hj.
Viewing 10 replies - 1 through 10 (of 10 total)
  • Plugin Author Essekia

    (@essekia)

    @hj Can you share the screenshot of the style settings and also a link to the page on the frontend?

    Thread Starter hj

    (@hj)

    @essekia, thanks for reply.
    The page is on a localhost server for development, so can’t link you to a page. I can share screenshots, but not sure how you add images to messages here…?

    Thread Starter hj

    (@hj)

    Put some screenshots up….
    Standard style settings:
    https://mega.nz/file/4HgABJJA#A0fgbVLfZpWLWvi1eW2jJ5LPG2SAiFpiZUUrxtf5rlE

    Global style settings:
    https://mega.nz/file/MDZSzTRZ#tw-cajuAQGL3huBLvm81x7LQzUA4zAD45IAQPGqOTGI

    Frontend:
    https://mega.nz/file/EKhzBBZQ#l2SiQcoHO7yEVu7t0_MfKPstrZ1wvLb3Afu6uRNAYKI

    On the frontend you can just (!) see the white text color in the light grey cells. The white text is selected in standard settings otherwise you wouldn’t be able to read what’s in the header row.

    Plugin Author Essekia

    (@essekia)

    @hj This is mostly due to the theme or another plugin using “!important” for CSS properties. Can you share the name of the theme you are using?

    Thread Starter hj

    (@hj)

    Name of the theme is ‘Enfold’ – https://kriesi.at

    Plugin Author Essekia

    (@essekia)

    @hj Sorry for the late reply. From your 1st screenshot, the Font color is selected as white. It should be like this.. https://ibb.co/JKNLRFf … by default.

    You can change the theme to reset this also.

    Thread Starter hj

    (@hj)

    Hmm….. Well, according to that JPG, you’ve selected a dark blue header theme, and a dark font color.
    OK, so what you’re saying is …the theme choice (eg. black or dark blue background header) automatically includes a contrasting (white) font color for the header?
    And then for the subsequent data rows, you select the font color according to your wishes? (most likely a dark font colour as the data rows are white or very pale grey background).

    Well that’s ok, except….. when I select a dark blue for the font color, that also changes the font in the header row to dark blue. So my header is dark blue against dark blue, i.e. unreadable!

    If I make the header row readable by selecting a white font color, the data rows aren’t legible…because it’s white on white.

    See my problem?

    Plugin Author Essekia

    (@essekia)

    @hj That shouldn’t be happening by default. Even so, you can change just the Header’s font color by going to Customize -> Header -> Text Color.

    Thread Starter hj

    (@hj)

    Well, it does seem to be happening by default!

    I have to confess that I told you the wrong theme – this table is being tested on an install running WordPress 6.7 using Generate Press theme. Sorry about that.

    I tried changing the header color via the Customise function – changed it to white (saved and republished), but still the dark blue header font remains.

    I guess I will have to add some custom CSS for this page, based around the following code seen in my browser inspector:

    .tablesome__container.tablesome__container–47 .tablesome__table .tablesome__row > .tablesome__column {
    font-family: Comic Sans MS;
    font-size: 16px;
    color: #517c9b;
    text-align: left;
    line-height: 20px;
    font-style: normal;
    letter-spacing: 0px;
    text-transform: none;
    font-weight: 400;
    }

    Thread Starter hj

    (@hj)

    OK, I got it working the way it should – header row white font on dark blue background, data rows dark blue font on white background.

    I added the following additional CSS in customise (double underscores in the class name):

    .tablesome__column__name {
    color: #ffffff;
    }

    https://mega.nz/file/Ye5WmKpS#P5hFFV89Aw22Vy7vO3buh08PihzjQR-EXawc0MljMWc

    I note that Tablesome is tested upto v.6.6.2, and admittedly I am using v.6.7, so maybe there’s something in that. But the theme, Generate Press, seems to be highly rated and is a simple lightweight theme, so I’d be surprised if the theme was the cause of the issue.

    Otherwise I have to say Tablesome is an excellent plugin with great functionality and features, and a perfect fit for our library project should it ever go live.

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