Missouri State University Pattern Library

Sample

There are no notes for this item.

<div class="Rowstart grid_whole Page">
    <div class="grid_inner">
        <div class="ContentBlock placeholder">Content</div>

    </div>

</div>
<div class="Rowstart grid_half Page">
    <div class="grid_inner">
        <div class="ContentBlock placeholder">Content</div>

    </div>

</div>
<div class="grid_half Page">
    <div class="grid_inner">
        <div class="ContentBlock placeholder">Content</div>

    </div>

</div>
<div class="Rowstart grid_third Page">
    <div class="grid_inner">
        <div class="ContentBlock placeholder">Content</div>

    </div>

</div>
<div class="grid_third Page">

    <div class="grid_inner">
        <div class="ContentBlock placeholder">Content</div>

    </div>

</div>
<div class="grid_third Page">

    <div class="grid_inner">
        <div class="ContentBlock placeholder">Content</div>

    </div>

</div>
<div class="Rowstart grid_third Page">
    <div class="grid_inner">
        <div class="ContentBlock placeholder">Content</div>

    </div>

</div>
<div class="grid_twothirds Page">
    <div class="grid_inner">
        <div class="ContentBlock placeholder">Content</div>

    </div>

</div>
<div class="Rowstart grid_twothirds Page">
    <div class="grid_inner">
        <div class="ContentBlock placeholder">Content</div>

    </div>

</div>
<div class="grid_third Page">
    <div class="grid_inner">
        <div class="ContentBlock placeholder">Content</div>

    </div>

</div>
<div class="Rowstart grid_fourth Page">
    <div class="grid_inner">
        <div class="ContentBlock placeholder">Content</div>

    </div>

</div>
<div class="grid_fourth Page">
    <div class="grid_inner">
        <div class="ContentBlock placeholder">Content</div>

    </div>

</div>
<div class="grid_fourth Page">
    <div class="grid_inner">
        <div class="ContentBlock placeholder">Content</div>

    </div>

</div>
<div class="grid_fourth Page">
    <div class="grid_inner">
        <div class="ContentBlock placeholder">Content</div>

    </div>

</div>
<div class="Rowstart grid_fourth Page">
    <div class="grid_inner">
        <div class="ContentBlock placeholder">Content</div>

    </div>

</div>
<div class="grid_threefourths Page">
    <div class="grid_inner">
        <div class="ContentBlock placeholder">Content</div>

    </div>

</div>
<div class="Rowstart grid_threefourths Page">
    <div class="grid_inner">
        <div class="ContentBlock placeholder">Content</div>

    </div>

</div>
<div class="grid_fourth Page">
    <div class="grid_inner">
        <div class="ContentBlock placeholder">Content</div>

    </div>

</div>
 
{{!-- One column 100 --}}
{{#>@col-100}}
  
  {{!-- Main content --}}
  {{#*inline 'columnContentA'}}
    {{render '@placeholder'}}
  {{/inline}}

{{/@col-100}}

{{!-- Two column 50-50 --}}
{{#>@col-50}}

  {{!-- Main content --}}
  {{#*inline 'columnContentA'}}
    {{render '@placeholder'}}
  {{/inline}}
  {{#*inline 'columnContentB'}}
    {{render '@placeholder'}}
  {{/inline}}

{{/@col-50}}

{{!-- Three column 33-33-33 --}}
{{#>@col-33}}

  {{!-- Main content --}}
  {{#*inline 'columnContentA'}}
    {{render '@placeholder'}}
  {{/inline}}
  {{#*inline 'columnContentB'}}
    {{render '@placeholder'}}
  {{/inline}}
  {{#*inline 'columnContentC'}}
    {{render '@placeholder'}}
  {{/inline}}

{{/@col-33}}

{{!-- Two column 33-66 --}}
{{#>@col-33-66}}

  {{!-- Main content --}}
  {{#*inline 'columnContentA'}}
    {{render '@placeholder'}}
  {{/inline}}
  {{#*inline 'columnContentB'}}
    {{render '@placeholder'}}
  {{/inline}}

{{/@col-33-66}}

{{!-- Two column 66-33 --}}
{{#>@col-66-33}}

  {{!-- Main content --}}
  {{#*inline 'columnContentA'}}
    {{render '@placeholder'}}
  {{/inline}}
  {{#*inline 'columnContentB'}}
    {{render '@placeholder'}}
  {{/inline}}

{{/@col-66-33}}

{{!-- Four column 25-25-25-25 --}}
{{#>@col-25}}

  {{!-- Main content --}}
  {{#*inline 'columnContentA'}}
    {{render '@placeholder'}}
  {{/inline}}
  {{#*inline 'columnContentB'}}
    {{render '@placeholder'}}
  {{/inline}}
  {{#*inline 'columnContentC'}}
    {{render '@placeholder'}}
  {{/inline}}
  {{#*inline 'columnContentD'}}
    {{render '@placeholder'}}
  {{/inline}}

{{/@col-25}}

{{!-- Two column 25-75 --}}
{{#>@col-25-75}}

  {{!-- Main content --}}
  {{#*inline 'columnContentA'}}
    {{render '@placeholder'}}
  {{/inline}}
  {{#*inline 'columnContentB'}}
    {{render '@placeholder'}}
  {{/inline}}

{{/@col-25-75}}

{{!-- Two column 75-25 --}}
{{#>@col-75-25}}

  {{!-- Main content --}}
  {{#*inline 'columnContentA'}}
    {{render '@placeholder'}}
  {{/inline}}
  {{#*inline 'columnContentB'}}
    {{render '@placeholder'}}
  {{/inline}}

{{/@col-75-25}}
 
/* No context defined for this component. */