agaric/patternlibrary
10
1
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Reorganize styleguide (pattern library) to distinguish static layouts, styleguide from Sass powering it

Browse source
This commit is contained in:
benjamin melançon 2018-08-20 09:42:55 -04:00
parent b9040a7fde
commit 952af16725
235 changed files with 4 additions and 4 deletions
Download patch file Download diff file Expand all files Collapse all files

102
static-layouts/design-source/pages/about_events.hbs Normal file
View file

@ -0,0 +1,102 @@
---
title: "Events"
---
{{#extend "default"}}
{{#content "precontent"}}
<section class="hero" data-headerbg="light">
<div class="hero-body">
<div class="container">
<div class="titlebar">
<div class="titlebar_title">
<h1 class="title is-2">Events</h1>
</div>
<div class="titlebar_links">
<div class="tabs">
<ul>
<li class="is-active"><a>Upcoming Events</a></li>
<li><a>Past Events</a></li>
<li>
<div class="select">
<select>
<option>All</option>
<option>Speaking</option>
<option>Training</option>
<option>...</option>
</select>
</div>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</section>
{{/content}}
{{#content "content"}}
<div class="flow content">
<div class="flow_left">
<h3 class="title is-4 is-blue">2018</h3>
</div>
<div class="flow_middle">
<a href="#" class="teaser">
<p class="title is-4 is-compact">June 4</p>
<p class="title is-5 is-spaced">Lorem ipsum dolor sit amet</p>
<p class="subtitle is-6">Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.</p>
</a>
<a href="#" class="teaser">
<p class="title is-4 is-compact">June 5, 2017</p>
<p class="title is-5 is-spaced">Lorem ipsum dolor sit amet</p>
<p class="subtitle is-6">Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.</p>
</a>
<a href="#" class="teaser">
<p class="title is-4 is-compact">June 6, 2017</p>
<p class="title is-5 is-spaced">Lorem ipsum dolor sit amet</p>
<p class="subtitle is-6">Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.</p>
</a>
</div>
<div class="flow_left">
<h3 class="title is-4 is-blue">2019</h3>
</div>
<div class="flow_middle">
<a href="#" class="teaser">
<p class="title is-4 is-compact">July 11</p>
<p class="title is-5 is-spaced">Lorem ipsum dolor sit amet</p>
<p class="subtitle is-6">Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.</p>
</a>
<a href="#" class="teaser">
<p class="title is-4 is-compact">July 12</p>
<p class="title is-5 is-spaced">Lorem ipsum dolor sit amet</p>
<p class="subtitle is-6">Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.</p>
</a>
<a href="#" class="teaser">
<p class="title is-4 is-compact">July 13</p>
<p class="title is-5 is-spaced">Lorem ipsum dolor sit amet</p>
<p class="subtitle is-6">Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.</p>
</a>
<a href="#" class="teaser">
<p class="title is-4 is-compact">July 14</p>
<p class="title is-5 is-spaced">Lorem ipsum dolor sit amet</p>
<p class="subtitle is-6">Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.</p>
</a>
</div>
</div>
<nav class="pagination" role="navigation" aria-label="pagination">
<a class="pagination-previous" title="This is the first page" disabled>Previous</a>
<a class="pagination-next">Next page</a>
<ul class="pagination-list">
<li>
<a class="pagination-link is-current" aria-label="Page 1" aria-current="page">1</a>
</li>
<li>
<a class="pagination-link" aria-label="Goto page 2">2</a>
</li>
<li>
<a class="pagination-link" aria-label="Goto page 3">3</a>
</li>
</ul>
</nav>
{{/content}}
{{/extend}}