--- 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}}