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

[css-pseudo] Pseudo element selector, Behavior Control of Nested Hierarchical/Tree Recursion, Propagation/inheritance of selection #11441

Open
wesleyolis opened this issue Jan 5, 2025 · 1 comment

Comments

@wesleyolis
Copy link

wesleyolis commented Jan 5, 2025

I would like to propose the following pseudo selectors, to help in controlling the CSS element selector inheritance/propagation nested recursion that one could try use templates, but one would still run into problems the larger schema of things here, with whats trying to be achieved ideally with what I have been designing. used in combination with apply-style-this-element-only #11440 alot

Proposal
Implement the following combination of Pseudo Element Selectors that control behaviour of the selector

Think of this as much more advanced Child combinator | > | div > p | Selects every <p> element that are direct children of a <div>

  • selector-set:first-nested-sel-set

selects the first selection occurrence, and will not recuse any further.

  • selector-set:nth-neasted-sel-set(n < full matching limit or n + 1)

selects the up until the nth matching selector or an exact value match or parameter matched.

  • selector-set:until-neasted-sel-set(relative selector)

The most important would be this one, to more accurate control depth of propagation and recursion
Relative selector

where selector-set = div.className > input:active > span ~ items

i.e

selector-set = div.className > input:active > span ~ items: until-neasted-sel-set(.items > .menu): apply-style-this-element-only
{
border 0.1em solid #red
}
@Loirooriol
Copy link
Contributor

I have no idea of what you are proposing. The poor formatting (I even had to mark some HTML as code to prevent it from displaying as HTML) doesn't help either.

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

No branches or pull requests

2 participants