Understanding v2 is still under development, it appears the v2 components do not have cq:htmlTag definitions specifying the block (BEM) of .cmp-xxx, so instead the components have a wrapping css class of the component name.
For example, the v1 list component is wrapped with css classes: .cmp .cmp-list where as the v2 list component is wrapped the css classes: list.
Is the HTML API contract changing from v1 to v2? It appears the .cmp-list, in v2, is moved into the HTML of list.html and a normal class attribute. This changes the contract and expectation a bit now, as any overlay of list.html MUST remember to wrap all markup in it with a .cmp-list class, and we also lost the .cmp class. Is this intentional?
I image this could very easily break CSS going from v1 to v2 - for example many users will want to adjust margin/padding on the ul, which would've been targeted in v1 as .cmp-list ul but for v2 needs to update to .cmp-list.
Understanding v2 is still under development, it appears the v2 components do not have cq:htmlTag definitions specifying the block (BEM) of
.cmp-xxx
, so instead the components have a wrapping css class of the component name.For example, the v1 list component is wrapped with css classes:
.cmp .cmp-list
where as the v2 list component is wrapped the css classes:list
.Is the HTML API contract changing from v1 to v2? It appears the
.cmp-list
, in v2, is moved into the HTML of list.html and a normal class attribute. This changes the contract and expectation a bit now, as any overlay of list.html MUST remember to wrap all markup in it with a.cmp-list
class, and we also lost the.cmp
class. Is this intentional?I image this could very easily break CSS going from v1 to v2 - for example many users will want to adjust margin/padding on the ul, which would've been targeted in v1 as
.cmp-list ul
but for v2 needs to update to.cmp-list
.v1 list: https://github.com/Adobe-Marketing-Cloud/aem-core-wcm-components/blob/master/content/src/content/jcr_root/apps/core/wcm/components/list/v1/list/list.html
v2 list: https://github.com/Adobe-Marketing-Cloud/aem-core-wcm-components/blob/development/content/src/content/jcr_root/apps/core/wcm/sandbox/components/list/v2/list/list.html#L20