emkay / film

Film UX Components

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Component CSS sometimes must be defined at the application level

emkay opened this issue · comments

This is a workaround for the shadow DOM limitation that you can't do :slotted(> * + *) sort of stuff.

This should go away:

    /* hacks:
     * If we wrap the Stack component and add this in there would that work? */
    film-stack > * {
      margin-block: 0;
    }

    film-stack > * + * {
      margin-block-start: var(--s1);
    }

from the application level css.

Idea to try: wrap the component and set that css in the outter component.