UTS Style Guide

<section class="js-collapsible collapsible {{ modifier_class }}"{% if id %} id="{{ id }}"{% endif %}>
  <h4 class="collapsible__title">
    {% block title %}
      A collapsible section
    {% endblock %}
  </h4>
  <div class="collapsible__content">
    {% block content %}
      <table data-striping="1">
        <thead>
        <tr>
          <th>Autumn session</th>
          <th><span class="tooltip__anchor" tabindex="0">Credit Points<span class="tooltip">A credit point is the unit of measure of workload for individual subjects.</span></span></th>
          <th>Subject Code</th>
        </tr>
        </thead>
        <tbody>
        <tr>
          <td class="unit--no-indent"><a href="http://handbook.uts.edu.au/subjects/21878.html">21878</a> Organisational Dialogue: Theory and Practice</td>
          <td class="unit--no-indent">6</td>
          <td>21878</td>
        </tr>
        <tr>
          <td class="unit--no-indent"><a href="http://handbook.uts.edu.au/subjects/22747.html">22747</a> Accounting for Managerial Decisions</td>
          <td class="unit--no-indent">6</td>
          <td>22747</td>
        </tr>
        <tr>
          <td class="unit--no-indent"><a href="http://handbook.uts.edu.au/subjects/23706.html">23706</a> Economics for Management</td>
          <td class="unit--no-indent">6</td>
          <td>23706</td>
        </tr>
        <tr>
          <td class="unit--no-indent"><a href="http://handbook.uts.edu.au/subjects/21937.html">21937</a> Managing, Leading and Stewardship</td>
          <td class="unit--no-indent">6</td>
          <td>21937</td>
        </tr>
        </tbody>
      </table>
      <h3>Section Title</h3>
      <p>Curabitur blandit tempus porttitor. Cum sociis natoque penatibus et
        magnis dis parturient montes, nascetur ridiculus mus. Morbi leo risus,
        porta ac consectetur ac, vestibulum at eros. Praesent commodo cursus
        magna, vel scelerisque nisl consectetur et. Fusce dapibus, tellus ac
        cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo
        sit amet risus.</p>
      <p>Etiam porta sem malesuada magna mollis euismod. Vivamus sagittis lacus
        vel augue laoreet rutrum faucibus dolor auctor. Integer posuere erat a
        ante venenatis dapibus posuere velit aliquet. Curabitur blandit tempus
        porttitor. Donec ullamcorper nulla non metus auctor fringilla.</p>
      <p>Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Nulla
        vitae elit libero, a pharetra augue. Aenean lacinia bibendum nulla sed
        consectetur. Duis mollis, est non commodo luctus, nisi erat porttitor
        ligula, eget lacinia odio sem nec elit.</p>
    {% endblock %}
  </div>
</section>