Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add ez-toc-list class to all lists #128

Open
wants to merge 1 commit into
base: master
Choose a base branch
from

Conversation

tyrann0us
Copy link
Contributor

While first-level lists include a generic .ez-toc-list HTML class in addition to .ez-toc-list-level-1, nested lists only have a variable class name including the nesting level.
So if you want to apply styles to all lists regardless of their nesting level, you either have to use the tag selector (e.g. #ez-toc-container ul, which some might consider bad practice) or use an unnecessarily inconvenient attribute selector ([class^="ez-toc-list"]).

By adding a generic .ez-toc-list class to all lists, none of the "workarounds" would be necessary.

While first-level lists include a generic `.ez-toc-list` HTML class in addition to `.ez-toc-list-level-1`, nested lists only have a variable class name including the nesting level.
So if you want to apply styles to all lists regardless of their nesting level, you either have to use the tag selector (e.g. `#ez-toc-container ul`, which some might consider bad practice) or use an unnecessarily inconvenient attribute selector (`[class^="ez-toc-list"]`).

By adding a generic `.ez-toc-list` class to all lists regardless of their nesting levels, none of the "workarounds" would be necessary.
@shazahm1
Copy link
Contributor

You could use the #ez-toc-container ul ul selector for nested lists.

@tyrann0us
Copy link
Contributor Author

You could use the #ez-toc-container ul ul selector for nested lists.

Thanks, but my point is that it should be possible to style all lists with one class selector regardless of their nesting level because if you follow certain CSS conventions (like ITCSS), using type (element) selectors after the "initial setup" is considered bad practice.

Currently, I'm forced to do this (real world example):

[class^="ez-toc-list"] { // @see https://github.com/shazahm1/Easy-Table-of-Contents/pull/128
  padding: 0;
  list-style: none;
}

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants