https://github.com/stuartpb/partywall

A prollyfill for the HTML Parts and Walls spec
https://github.com/stuartpb/partywall

Last synced: 7 days ago
JSON representation

A prollyfill for the HTML Parts and Walls spec

• Host: GitHub
• URL: https://github.com/stuartpb/partywall
• Owner: stuartpb
• License: mit
• Created: 2015-08-06T23:26:24.000Z (over 9 years ago)
• Default Branch: master
• Last Pushed: 2016-08-22T20:29:24.000Z (over 8 years ago)
• Last Synced: 2024-12-01T17:00:03.404Z (about 1 month ago)
• Language: JavaScript
• Homepage:
• Size: 7.81 KB
• Stars: 0
• Watchers: 3
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# partywall

A prollyfill for the style aspects of the HTML Parts and Walls spec.

For the DOM aspects of the HTML Parts and Walls spec, see

[getpart-polyfill](https://github.com/stuartpb/getpart-polyfill).

## Using partywall.js

To start using this script, call the `partywallStyler()` function it adds to

the global environment. This will populate the needed information for all

elements on the page, set up mutation observers to keep that information

accurate, and add a stylesheet to the document to contain all styles whose

selectors are dynamically generated by this styler.

To add a style to be applied by the styler, use `addStyle(list, style)`. The

`list` argument is an array of selectors, where the selectors are arrays of

wall-separated selector strings. (Any selectors that involve non-walled

descendant selectors between them may be specified as further arrays, whose

contents will be concatenated with spaces.) The `style` argument is the

string of CSS style properties, like what you would assign to a `style`

property on an element.

## Known limitations

- Part selectors specified as an ID do not increase specificity the way the

  spec states they should.

- While the spec states that walled descendant selectors should be capable of

  crossing Shadow DOM boundaries, the selectors specified by partywall-style.js

  are document-bound.

- Increases in wall depth will increase selector application time, due to the

  way styles are generated to match through all potential wall roots.