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.

Sign up for GitHub

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

Jump to bottom

Light DOM styles #145

Closed
1 task done
andij opened this issue Jan 13, 2022 · 2 comments · Fixed by #182
Closed
1 task done

Light DOM styles #145

andij opened this issue Jan 13, 2022 · 2 comments · Fixed by #182
Assignees
@jholt1
Labels
Area: Components Work related to creating or updating components
Milestone
Beta release

Comments

@andij
Copy link
Contributor

andij commented Jan 13, 2022 •
edited
Loading

Outcome

To be able to apply styling to elements, attributes, states, pseudo-elements and pseudo-states in the light DOM which are unavailable through :slotted() selector.

Reference ticket on the Web Components Community Group: w3c/webcomponents-cg#5

Scope

  • Implement a solution to apply styles to the light DOM for anonymous slotted content for each component.
@andij andij added the Area: Components Work related to creating or updating components label Jan 13, 2022
@andij andij added this to the Beta release milestone Jan 14, 2022
@jholt1
Copy link
Contributor

jholt1 commented Jan 19, 2022

Some gotchas

  • Light DOM does not always mean it is on the main DOM, it can be within the shadow of another element
  • The name of the element could be anything therefore there needs to be a way to detect that component
  • There needs to be a way not to increase the size due to replication of light dom and slotted styles

@jholt1 jholt1 self-assigned this Jan 26, 2022
@jholt1 jholt1 linked a pull request Jan 28, 2022 that will close this issue
feat: add light dom method #182
Merged
@jholt1 jholt1 added Status: In Progress This issue is being worked on, and has someone assigned Status: Review Needed The issue has a PR attached to it which needs to be reviewed labels Jan 28, 2022
@jholt1
Copy link
Contributor

jholt1 commented Jan 28, 2022

Current setup allows for the light DOM styles to be injected in the parent (either HTMLDOM or shadow). There are so caveats and this piece will need to be improved

@andij andij removed Status: In Progress This issue is being worked on, and has someone assigned Status: Review Needed The issue has a PR attached to it which needs to be reviewed labels Jan 31, 2022
This was referenced Feb 9, 2022
Closed
Closed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@jholt1 jholt1

Labels
Area: Components Work related to creating or updating components
Projects
None yet
Milestone
Beta release
Development

Successfully merging a pull request may close this issue.

feat: add light dom method centrica-engineering/muon
2 participants
@andij @jholt1