Skip to content

Instantly share code, notes, and snippets.

@yanneves
Created June 3, 2016 10:59
Show Gist options
  • Save yanneves/fba58c4528eca3bda78dbf32ab24741e to your computer and use it in GitHub Desktop.
Save yanneves/fba58c4528eca3bda78dbf32ab24741e to your computer and use it in GitHub Desktop.
Layout - Content - Presentation divide
<!-- LAYOUT -->
<ul>
<li>
<button></button>
</li>
<li>
<button></button>
</li>
<li>
<button></button>
</li>
<li>
<button></button>
</li>
<li>
<button></button>
</li>
<li>
<button></button>
</li>
<li>
<button></button>
</li>
<li>
<button></button>
</li>
<li>
<button></button>
</li>
</ul>
<!-- CONTENT -->
<ul>
<li>
<button type="button" title="Add Form">Add Form</button>
</li>
<li>
<button type="button" title="Add Branch">Add Branch</button>
</li>
<li>
<button type="button" title="Add Document">Add Document</button>
</li>
<li>
<button type="button" title="Add Email">Add Email</button>
</li>
<li>
<button type="button" title="Add Phone">Add Phone</button>
</li>
<li>
<button type="button" title="Copy Last">Copy Last</button>
</li>
<li>
<button type="button" title="Add Paywall">Add Paywall</button>
</li>
<li>
<button type="button" title="Add Link">Add Link</button>
</li>
<li>
<button type="button" title="Add Page">Add Page</button>
</li>
</ul>
<!-- PRESENTATION -->
<ul class="select-grid">
<li class="select-item">
<button type="button" title="Add Form">
<i class="fa fa-file"></i>
<span class="sr-only">Add Form</span>
</button>
</li>
<li class="select-item">
<button type="button" title="Add Branch">
<i class="fa fa-odnoklassniki"></i>
<span class="sr-only">Add Branch</span>
</button>
</li>
<li class="select-item">
<button type="button" title="Add Document">
<i class="fa fa-file-text"></i>
<span class="sr-only">Add Document</span>
</button>
</li>
<li class="select-item">
<button type="button" title="Add Email">
<i class="fa fa-envelope"></i>
<span class="sr-only">Add Email</span>
</button>
</li>
<li class="select-item">
<button type="button" title="Add Phone">
<i class="fa fa-phone"></i>
<span class="sr-only">Add Phone</span>
</button>
</li>
<li class="select-item">
<button type="button" title="Copy Last">
<i class="fa fa-clipboard"></i>
<span class="sr-only">Copy Last</span>
</button>
</li>
<li class="select-item">
<button type="button" title="Add Paywall">
<i class="fa fa-dollar"></i>
<span class="sr-only">Add Paywall</span>
</button>
</li>
<li class="select-item">
<button type="button" title="Add Link">
<i class="fa fa-chain"></i>
<span class="sr-only">Add Link</span>
</button>
</li>
<li class="select-item">
<button type="button" title="Add Page">
<i class="fa fa-file-o"></i>
<span class="sr-only">Add Page</span>
</button>
</li>
</ul>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment