feat: split layout template

[wesleyboar]

Overview

Layout that offers left- and right-side content.

Status

• Verify whether this is useful.
  ^{Django CMS Bootstrap grid already provides this and lets editor handle narrow screen layout.}
• Support narrow screen layout.

Related

• CMD-186
• replaces feat: ctrn layout design test #881

Changes

• added template with Left and Right placeholders
• added styles for breadcrumbs overlapping layout
• added styles for angled background

Testing

Note

Available to test on https://pprd.lccf.tacc.utexas.edu/ctrn-web/.

0. Checkout this branch and run:

   npm run build:css
   docker exec -it core_cms sh -c "python manage.py collectstatic --no-input"
   

1. Add/Edit to settings_custom.py or settings_local.py with:

   CMS_TEMPLATES = (
       ('standard.html', 'Standard'),
       ('fullwidth.html', 'Full Width'),
       ('split.html', 'Split (Two-Side)'),
   )

2. Create/Update page to have "Split (Two-Side)" layout.

3. Create/Update structure to have different color fluid containers with text.
   

   • In the "Left" add a Container "Fluid container + Muted section" with child Text.
   • In the "Right" add a Container "Fluid container + Light section" with child Text.

UI

Muted & Light Section	Dark & Light Section