Sha256: 3a2c74d4a2378487e25ca067cbfadd6b249197f399e38097186f13be64792adb

Contents?: true

Size: 1.49 KB

Versions: 36

Compression:

Stored size: 1.49 KB

Contents

<div class="section head">
  <div class="corset">
    <h1>How to use Magic-Styles for Layouts</h1>
  </div>
</div>
<div class="section">
  <div class="corset">
    <p class="loud">Magic-Styles uses 2 main elements for layouts, <em>.section</em> and <em>.corset</em></p>
    <pre><code>
      &lt;div class="section .."&gt;
        &lt;div class="corset .."&gt;
          .. your section content goes here ...
        &lt;/div&gt;
      &lt;/div&gt;
    </code></pre>
  </div>
</div>

<div class="section sctn-sm">
  <div class="corset">
    <h2>.section</h2>
    <p class="loud">
      Sections are the vertical spacer for content <em>(use different classes to change behavior)</em>
    </p>
  </div>
</div>

<div class="section sctn-sm">
  <div class="corset">
    <h2>.corset</h2>
    <p class="loud">
      Corsets are the horizontal spacer for content <em>(use different classes to change behavior)</em>
    </p>
  </div>
</div>

<div class="section sctn-sm">
  <div class="corset">
    <h2>.fullpage-table</h2>
    <p class="loud">
      Fullpage-Tables are always fullscreen elements, great for landing pages with fullpage banner
    </p>
  </div>
</div>

<div class="section sctn-sm">
  <div class="corset">
    <h2>.layout-table</h2>
    <p class="loud">
      They are like <em>row</em>s but with vertical alliment.
      <br/>
      So content can be allways middled .. or .. boxes they allways have the same height
    </p>
  </div>
</div>

<div class="section">
  <div class="corset">
    <br/>
  </div>
</div>

Version data entries

36 entries across 36 versions & 1 rubygems

Version Path
magic_stylez-0.0.330 test/dummy/app/assets/javascripts/views/layout/at_first.jst.eco
magic_stylez-0.1.1 test/dummy/app/assets/javascripts/views/layout/at_first.jst.eco
magic_stylez-0.1.0 test/dummy/app/assets/javascripts/views/layout/at_first.jst.eco
magic_stylez-0.0.0.99 test/dummy/app/assets/javascripts/views/layout/at_first.jst.eco
magic_stylez-0.0.0.98 test/dummy/app/assets/javascripts/views/layout/at_first.jst.eco
magic_stylez-0.0.0.97 test/dummy/app/assets/javascripts/views/layout/at_first.jst.eco
magic_stylez-0.0.0.96 test/dummy/app/assets/javascripts/views/layout/at_first.jst.eco
magic_stylez-0.0.0.95 test/dummy/app/assets/javascripts/views/layout/at_first.jst.eco
magic_stylez-0.0.0.94 test/dummy/app/assets/javascripts/views/layout/at_first.jst.eco
magic_stylez-0.0.0.93 test/dummy/app/assets/javascripts/views/layout/at_first.jst.eco
magic_stylez-0.0.0.92 test/dummy/app/assets/javascripts/views/layout/at_first.jst.eco
magic_stylez-0.0.0.91 test/dummy/app/assets/javascripts/views/layout/at_first.jst.eco
magic_stylez-0.0.0.90 test/dummy/app/assets/javascripts/views/layout/at_first.jst.eco
magic_stylez-0.0.0.89 test/dummy/app/assets/javascripts/views/layout/at_first.jst.eco
magic_stylez-0.0.0.88 test/dummy/app/assets/javascripts/views/layout/at_first.jst.eco
magic_stylez-0.0.0.87 test/dummy/app/assets/javascripts/views/layout/at_first.jst.eco
magic_stylez-0.0.0.86 test/dummy/app/assets/javascripts/views/layout/at_first.jst.eco
magic_stylez-0.0.0.85 test/dummy/app/assets/javascripts/views/layout/at_first.jst.eco
magic_stylez-0.0.0.84 test/dummy/app/assets/javascripts/views/layout/at_first.jst.eco
magic_stylez-0.0.0.83 test/dummy/app/assets/javascripts/views/layout/at_first.jst.eco