Section: Section: bordered

Ready

Notes
Info
HTML
View
Context

No notes defined.

Handle: @col-33-66-section--bordered
Variants (6): Section: none , Section: divider , Section: divider + bordered , Section: divider + shaded , Section: bordered , Section: shaded
Preview:
- With layout
- Component only
Filesystem Path: src/components/02-page-structure/flex grids/02-Two-column-grid-layout/col-33-66/col-33-66-section/col-33-66-section.hbs
References (1): @placeholder


        
        <section class="Bordered">
    <div class="grid_container">
        <div class="grid_row">
            <div class="grid_third">
                <p class="placeholder">Content</p>
            </div>
            <div class="grid_twothirds">
                <p class="placeholder">Content</p>
            </div>
        </div>
        <div class="grid_row">
            <div class="grid_third">
                <p class="placeholder">Content</p>
            </div>
            <div class="grid_twothirds">
                <p class="placeholder">Content</p>
            </div>
        </div>
    </div>
</section>


        {{#if sectionDivider}}
  <hr />
{{/if}}

<section class="{{sectionTreatment}}">
  <div class="grid_container">
    {{#each rows}}
      <div class="grid_row">
        {{#each cols}}
          <div class="{{width}}">
            {{#if content}}
              {{{content}}}
            {{else}}
              {{render '@placeholder'}}
            {{/if}}
          </div>
        {{/each}}
      </div>
    {{/each}}
  </div>
</section>


        
            
            {
  "rows": [
    {
      "cols": [
        {
          "width": "grid_third",
          "content": null
        },
        {
          "width": "grid_twothirds",
          "content": null
        }
      ]
    },
    {
      "cols": [
        {
          "width": "grid_third",
          "content": null
        },
        {
          "width": "grid_twothirds",
          "content": null
        }
      ]
    }
  ],
  "sectionTreatment": "Bordered"
}