Generic Template & Flow Container

[hvanyo]

Description

As a site builder I want a generic template and flow container to start using immediately so I can create a basic page with basic elements.

Design:

• SEE JIRA ticket

Acceptance Criteria

AC1: Canvasx-flowcontainer contains utlitity tokens that do the following:

• Token which constrains a flow container to full width.
• Token which constrains a flow container so that items are 1/3 width on tablet.
• Token which defines a "ContentRegion" (a default nested flow container) another flow container.
• Token which defines Canvasx gutter between components at different responsive breakpoints: https://xd.adobe.com/view/fd6e4dde-2ecf-480a-aaaf-f5043cb04bf0-a83d/screen/4f1d267f-2649-476d-a1ed-34b0bd125c44/specs/.
  • Mobile: 0.5rem, Tablet: 1.125rem, Desktop: 1.5rem

AC2: Canvasx-template contains a generic template

• Has slots for: Breadcrumb, Top Content, Content, Bottom Content and necessary wrappers.
• Where the Top Content is full width of viewport.

AC3: cxstarter_ package contains a flowcontainer to apply the following base components

• RTE
• CanvasX Image Variations
• Nested Flow container (with RTE & CanvasX Image variations)

AC3a: cxstarter_ package contains an example shadowed flowcontainer

AC4: Homepage of the canvasx site is converted to generic template.

AC4. Documentation on canvasx-flowcontainer and generic template.

Technical Notes:

• May need to move the mx-site-percent set at Layout's container wrapper to template slots.