User Manual

Account-statement-overview

Overview of all your account statements in a dynamic table.

Default


    
      

  

<div class="o-account-statement-overview l-table ">

  <div class="l-table__header u-tablet-hide">
    <div class="l-table__row">
      <div class="l-table__col l-table__col--4-12">
        

<button class="a-sort-button ">
  <span class="a-sort-button__text">Van</span>

  <div class="a-sort-button__icon">
    <span class="a-sort-button__icon-part a-sort-button__icon-part--asc"></span>
    <span class="a-sort-button__icon-part a-sort-button__icon-part--desc"></span>
  </div>
</button>


      </div>

      <div class="l-table__col l-table__col--4-12">
        

<button class="a-sort-button ">
  <span class="a-sort-button__text">Tot</span>

  <div class="a-sort-button__icon">
    <span class="a-sort-button__icon-part a-sort-button__icon-part--asc"></span>
    <span class="a-sort-button__icon-part a-sort-button__icon-part--desc"></span>
  </div>
</button>


      </div>

      <div class="o-account-statement-overview__action l-table__col l-table__col--4-12">
        

<button class="a-sort-button ">
  <span class="a-sort-button__text">Actie</span>

  <div class="a-sort-button__icon">
    <span class="a-sort-button__icon-part a-sort-button__icon-part--asc"></span>
    <span class="a-sort-button__icon-part a-sort-button__icon-part--desc"></span>
  </div>
</button>


      </div>
    </div>
  </div>

  <div class="l-table__body">

    

      <div class="l-table__row">
        <div class="l-table__col l-table__col--4-12 o-account-statement-overview__value">
          <div class="o-account-statement-overview__label">van</div>
          

<time class="a-time " datetime="2018-10-01">01-10-2018</time>


        </div>
        <div class="l-table__col l-table__col--4-12 o-account-statement-overview__value">
		  <div class="o-account-statement-overview__label">tot</div>
          

<time class="a-time " datetime="2018-10-01">01-10-2018</time>


        </div>

        <div class="l-table__col l-table__col--4-12 o-account-statement-overview__action ">
          

<button
  class="a-button a-button--ghost a-button--theme-grey icon-download "
  
>
  <span class="a-button__text">Download</span>
</button>


        </div>
      </div>

    

      <div class="l-table__row">
        <div class="l-table__col l-table__col--4-12 o-account-statement-overview__value">
          <div class="o-account-statement-overview__label">van</div>
          

<time class="a-time " datetime="2018-10-01">01-10-2018</time>


        </div>
        <div class="l-table__col l-table__col--4-12 o-account-statement-overview__value">
		  <div class="o-account-statement-overview__label">tot</div>
          

<time class="a-time " datetime="2018-10-01">01-10-2018</time>


        </div>

        <div class="l-table__col l-table__col--4-12 o-account-statement-overview__action ">
          

<button
  class="a-button a-button--ghost a-button--theme-grey icon-download "
  
>
  <span class="a-button__text">Download</span>
</button>


        </div>
      </div>

    

      <div class="l-table__row">
        <div class="l-table__col l-table__col--4-12 o-account-statement-overview__value">
          <div class="o-account-statement-overview__label">van</div>
          

<time class="a-time " datetime="2018-10-01">01-10-2018</time>


        </div>
        <div class="l-table__col l-table__col--4-12 o-account-statement-overview__value">
		  <div class="o-account-statement-overview__label">tot</div>
          

<time class="a-time " datetime="2018-10-01">01-10-2018</time>


        </div>

        <div class="l-table__col l-table__col--4-12 o-account-statement-overview__action ">
          

<button
  class="a-button a-button--ghost a-button--theme-grey icon-download "
  
>
  <span class="a-button__text">Download</span>
</button>


        </div>
      </div>

    

      <div class="l-table__row">
        <div class="l-table__col l-table__col--4-12 o-account-statement-overview__value">
          <div class="o-account-statement-overview__label">van</div>
          

<time class="a-time " datetime="2018-10-01">01-10-2018</time>


        </div>
        <div class="l-table__col l-table__col--4-12 o-account-statement-overview__value">
		  <div class="o-account-statement-overview__label">tot</div>
          

<time class="a-time " datetime="2018-10-01">01-10-2018</time>


        </div>

        <div class="l-table__col l-table__col--4-12 o-account-statement-overview__action ">
          

<button
  class="a-button a-button--ghost a-button--theme-grey icon-download "
  
>
  <span class="a-button__text">Download</span>
</button>


        </div>
      </div>

    

      <div class="l-table__row">
        <div class="l-table__col l-table__col--4-12 o-account-statement-overview__value">
          <div class="o-account-statement-overview__label">van</div>
          

<time class="a-time " datetime="2018-10-01">01-10-2018</time>


        </div>
        <div class="l-table__col l-table__col--4-12 o-account-statement-overview__value">
		  <div class="o-account-statement-overview__label">tot</div>
          

<time class="a-time " datetime="2018-10-01">01-10-2018</time>


        </div>

        <div class="l-table__col l-table__col--4-12 o-account-statement-overview__action ">
          

<button
  class="a-button a-button--ghost a-button--theme-grey icon-download "
  
>
  <span class="a-button__text">Download</span>
</button>


        </div>
      </div>

    

      <div class="l-table__row">
        <div class="l-table__col l-table__col--4-12 o-account-statement-overview__value">
          <div class="o-account-statement-overview__label">van</div>
          

<time class="a-time " datetime="2018-10-01">01-10-2018</time>


        </div>
        <div class="l-table__col l-table__col--4-12 o-account-statement-overview__value">
		  <div class="o-account-statement-overview__label">tot</div>
          

<time class="a-time " datetime="2018-10-01">01-10-2018</time>


        </div>

        <div class="l-table__col l-table__col--4-12 o-account-statement-overview__action ">
          

<button
  class="a-button a-button--ghost a-button--theme-grey icon-download "
  
>
  <span class="a-button__text">Download</span>
</button>


        </div>
      </div>

    

      <div class="l-table__row">
        <div class="l-table__col l-table__col--4-12 o-account-statement-overview__value">
          <div class="o-account-statement-overview__label">van</div>
          

<time class="a-time " datetime="2018-10-01">01-10-2018</time>


        </div>
        <div class="l-table__col l-table__col--4-12 o-account-statement-overview__value">
		  <div class="o-account-statement-overview__label">tot</div>
          

<time class="a-time " datetime="2018-10-01">01-10-2018</time>


        </div>

        <div class="l-table__col l-table__col--4-12 o-account-statement-overview__action ">
          

<button
  class="a-button a-button--ghost a-button--theme-grey icon-download "
  
>
  <span class="a-button__text">Download</span>
</button>


        </div>
      </div>

    

      <div class="l-table__row">
        <div class="l-table__col l-table__col--4-12 o-account-statement-overview__value">
          <div class="o-account-statement-overview__label">van</div>
          

<time class="a-time " datetime="2018-10-01">01-10-2018</time>


        </div>
        <div class="l-table__col l-table__col--4-12 o-account-statement-overview__value">
		  <div class="o-account-statement-overview__label">tot</div>
          

<time class="a-time " datetime="2018-10-01">01-10-2018</time>


        </div>

        <div class="l-table__col l-table__col--4-12 o-account-statement-overview__action ">
          

<button
  class="a-button a-button--ghost a-button--theme-grey icon-download "
  
>
  <span class="a-button__text">Download</span>
</button>


        </div>
      </div>

    
  </div>

</div>