[For Docs] Documentation does not show when component classes use pseudo selectors by default.

[1dancook]

This is a follow up issue to an issue discussed and resolved on discord.

A quick summary:

• CustomTable > .datatable--even-row {background: red} was not effecting a background change.

• The newly added :dark pseudo-selector had to be used: CustomTable:dark > .datatable--even-row {background: red}

---

The Issue: Documentation does not show this.

In the documentation (at least for DataTable) there is the COMPONENT CLASSES section. But there is no mention on the page about a :dark pseudo selector.

From only reading the documentation, someone would interpret that the selector .datatable--even-row would be sufficient for changing the color. This is not the case.

In reality, there could be other things affecting the default use of component classes.

---

Suggestion:

In the DataTable COMPONENT CLASSES section there is a table of descriptions. Maybe a change like this is good:

#old:
datatable--even-row    Target even rows (row indices start at 0).

#changed:
datatable--even-row    Target even rows (row indices start at 0). :dark pseudo-selector is used by default.
# or, ":dark pseudo-selector is applied"
# or, ":dark pseudo-selector is required"

I suspect there are other widgets that have the same issue.

[github-actions]

We found the following entry in the FAQ which you may find helpful:

• No widget called TextLog

Feel free to close this issue if you found an answer in the FAQ. Otherwise, please give us a little time to review.

This is an automated reply, generated by FAQtory

[willmcgugan]

This is a more general issue where the default css isn't displayed in the docs. We should pull that out in to the docs.

Closing, but we will address that soon.

[github-actions]

Don't forget to star the repository!

Follow @textualizeio for Textual updates.