<div class="row">
<div class="col-lg-2 col-md-4 col-xs-6">
<div class="dso-whitebox-small">
<a href="#">
<span class="dso-whitebox-icon">
<img src="../../dummy/images/icon-tree.png" />
</span>
<span class="dso-whitebox-link">
Boom kappen of snoeien
</span>
</a>
</div>
</div>
<div class="col-lg-2 col-md-4 col-xs-6">
<div class="dso-whitebox-small">
<a href="#">
<span class="dso-whitebox-icon">
<img src="../../dummy/images/icon-tree.png" />
</span>
<span class="dso-whitebox-link">
Boom kappen of snoeien
</span>
</a>
</div>
</div>
<div class="col-lg-2 col-md-4 col-xs-6">
<div class="dso-whitebox-small">
<a href="#">
<span class="dso-whitebox-icon">
<img src="../../dummy/images/icon-tree.png" />
</span>
<span class="dso-whitebox-link">
Boom kappen of snoeien
</span>
</a>
</div>
</div>
<div class="col-lg-2 col-md-4 col-xs-6">
<div class="dso-whitebox-small">
<a href="#">
<span class="dso-whitebox-icon">
<img src="../../dummy/images/icon-tree.png" />
</span>
<span class="dso-whitebox-link">
Boom kappen of snoeien
</span>
</a>
</div>
</div>
<div class="col-lg-2 col-md-4 col-xs-6">
<div class="dso-whitebox-small">
<a href="#">
<span class="dso-whitebox-icon">
<img src="../../dummy/images/icon-tree.png" />
</span>
<span class="dso-whitebox-link">
Boom kappen of snoeien
</span>
</a>
</div>
</div>
<div class="col-lg-2 col-md-4 col-xs-6">
<div class="dso-whitebox-small">
<a href="#">
<span class="dso-whitebox-icon">
<img src="../../dummy/images/icon-tree.png" />
</span>
<span class="dso-whitebox-link">
Boom kappen of snoeien
</span>
</a>
</div>
</div>
</div>
<div class="row">
<div class="col-md-4 col-sm-6 col-xs-12 ">
<div class="dso-whitebox">
<div class="dso-whitebox-title">
<h2>Ik wil weten welke wetten en regels er gelden voor mijn huis/bedrijf.</h2>
</div>
<div class="dso-whitebox-link">
<a href="#" class="btn btn-link"><svg class="di di-angle-right">
<use href="../../dso-icons.svg#angle-right" />
</svg><span>Direct naar aanvragen</span></a>
</div>
<div class="dso-whitebox-icon">
<img src="../../dummy/images/indienen.png" alt="Indienen" />
</div>
<div class="dso-rich-content">
<p>Weet u al voor welke activiteiten u een vergunning moet aanvragen of een melding moet doen? Dan kunt u de aanvraag of melding direct indienen.</p>
</div>
</div>
</div>
<div class="col-md-4 col-sm-6 col-xs-12 ">
<div class="dso-whitebox">
<div class="dso-whitebox-title">
<h2>Ik wil weten welke wetten en regels er gelden voor mijn huis/bedrijf.</h2>
</div>
<div class="dso-whitebox-link">
<a href="#" class="btn btn-link"><svg class="di di-angle-right">
<use href="../../dso-icons.svg#angle-right" />
</svg><span>Direct naar aanvragen</span></a>
</div>
<div class="dso-whitebox-icon">
<img src="../../dummy/images/indienen.png" alt="Indienen" />
</div>
<div class="dso-rich-content">
<p>Weet u al voor welke activiteiten u een vergunning moet aanvragen of een melding moet doen? Dan kunt u de aanvraag of melding direct indienen.</p>
</div>
</div>
</div>
<div class="col-md-4 col-sm-6 col-xs-12 ">
<div class="dso-whitebox">
<div class="dso-whitebox-title">
<h2>Ik wil weten welke wetten en regels er gelden voor mijn huis/bedrijf.</h2>
</div>
<div class="dso-whitebox-link">
<a href="#" class="btn btn-link"><svg class="di di-angle-right">
<use href="../../dso-icons.svg#angle-right" />
</svg><span>Direct naar aanvragen</span></a>
</div>
<div class="dso-whitebox-icon">
<img src="../../dummy/images/indienen.png" alt="Indienen" />
</div>
<div class="dso-rich-content">
<p>Weet u al voor welke activiteiten u een vergunning moet aanvragen of een melding moet doen? Dan kunt u de aanvraag of melding direct indienen.</p>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-3 col-sm-6 col-xs-12">
<div class="dso-whitebox dso-has-counter">
<div class="dso-step-counter">
1
</div>
<div class="dso-whitebox-title">
<h2>Ik wil weten welke wetten en regels er gelden voor mijn huis/bedrijf.</h2>
</div>
<div class="dso-whitebox-link">
<a href="#" class="btn btn-link"><svg class="di di-angle-right">
<use href="../../dso-icons.svg#angle-right" />
</svg><span>Direct naar aanvragen</span></a>
</div>
<div class="dso-whitebox-icon">
<img src="../../dummy/images/indienen.png" alt="Indienen" />
</div>
<div class="dso-rich-content">
<p>Weet u al voor welke activiteiten u een vergunning moet aanvragen of een melding moet doen?</p>
</div>
</div>
</div>
<div class="col-md-3 col-sm-6 col-xs-12">
<div class="dso-whitebox dso-has-counter">
<div class="dso-step-counter">
2
</div>
<div class="dso-whitebox-title">
<h2>Ik wil weten welke wetten en regels er gelden voor mijn huis/bedrijf.</h2>
</div>
<div class="dso-whitebox-link">
<a href="#" class="btn btn-link"><svg class="di di-angle-right">
<use href="../../dso-icons.svg#angle-right" />
</svg><span>Direct naar aanvragen</span></a>
</div>
<div class="dso-whitebox-icon">
<img src="../../dummy/images/indienen.png" alt="Indienen" />
</div>
<div class="dso-rich-content">
<p>Weet u al voor welke activiteiten u een vergunning moet aanvragen of een melding moet doen?</p>
</div>
</div>
</div>
<div class="col-md-3 col-sm-6 col-xs-12">
<div class="dso-whitebox dso-has-counter">
<div class="dso-step-counter">
3
</div>
<div class="dso-whitebox-title">
<h2>Ik wil weten welke wetten en regels er gelden voor mijn huis/bedrijf.</h2>
</div>
<div class="dso-whitebox-link">
<a href="#" class="btn btn-link"><svg class="di di-angle-right">
<use href="../../dso-icons.svg#angle-right" />
</svg><span>Direct naar aanvragen</span></a>
</div>
<div class="dso-whitebox-icon">
<img src="../../dummy/images/indienen.png" alt="Indienen" />
</div>
<div class="dso-rich-content">
<p>Weet u al voor welke activiteiten u een vergunning moet aanvragen of een melding moet doen?</p>
</div>
</div>
</div>
<div class="col-md-3 col-sm-6 col-xs-12">
<div class="dso-whitebox dso-has-counter">
<div class="dso-step-counter">
4
</div>
<div class="dso-whitebox-title">
<h2>Ik wil weten welke wetten en regels er gelden voor mijn huis/bedrijf.</h2>
</div>
<div class="dso-whitebox-link">
<a href="#" class="btn btn-link"><svg class="di di-angle-right">
<use href="../../dso-icons.svg#angle-right" />
</svg><span>Direct naar aanvragen</span></a>
</div>
<div class="dso-whitebox-icon">
<img src="../../dummy/images/indienen.png" alt="Indienen" />
</div>
<div class="dso-rich-content">
<p>Weet u al voor welke activiteiten u een vergunning moet aanvragen of een melding moet doen?</p>
</div>
</div>
</div>
<div class="col-md-3 col-sm-6 col-xs-12">
<div class="dso-whitebox dso-has-counter">
<div class="dso-step-counter">
5
</div>
<div class="dso-whitebox-title">
<h2>Ik wil weten welke wetten en regels er gelden voor mijn huis/bedrijf.</h2>
</div>
<div class="dso-whitebox-link">
<a href="#" class="btn btn-link"><svg class="di di-angle-right">
<use href="../../dso-icons.svg#angle-right" />
</svg><span>Direct naar aanvragen</span></a>
</div>
<div class="dso-whitebox-icon">
<img src="../../dummy/images/indienen.png" alt="Indienen" />
</div>
<div class="dso-rich-content">
<p>Weet u al voor welke activiteiten u een vergunning moet aanvragen of een melding moet doen?</p>
</div>
</div>
</div>
<div class="col-md-3 col-sm-6 col-xs-12">
<div class="dso-whitebox dso-has-counter">
<div class="dso-step-counter">
6
</div>
<div class="dso-whitebox-title">
<h2>Ik wil weten welke wetten en regels er gelden voor mijn huis/bedrijf.</h2>
</div>
<div class="dso-whitebox-link">
<a href="#" class="btn btn-link"><svg class="di di-angle-right">
<use href="../../dso-icons.svg#angle-right" />
</svg><span>Direct naar aanvragen</span></a>
</div>
<div class="dso-whitebox-icon">
<img src="../../dummy/images/indienen.png" alt="Indienen" />
</div>
<div class="dso-rich-content">
<p>Weet u al voor welke activiteiten u een vergunning moet aanvragen of een melding moet doen?</p>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-lg-2 col-md-4 col-xs-6">
{{render '@whitebox-small' }}
</div>
<div class="col-lg-2 col-md-4 col-xs-6">
{{render '@whitebox-small' }}
</div>
<div class="col-lg-2 col-md-4 col-xs-6">
{{render '@whitebox-small' }}
</div>
<div class="col-lg-2 col-md-4 col-xs-6">
{{render '@whitebox-small' }}
</div>
<div class="col-lg-2 col-md-4 col-xs-6">
{{render '@whitebox-small' }}
</div>
<div class="col-lg-2 col-md-4 col-xs-6">
{{render '@whitebox-small' }}
</div>
</div>
<div class="row">
<div class="col-md-4 col-sm-6 col-xs-12 ">
{{render '@whitebox-regular' }}
</div>
<div class="col-md-4 col-sm-6 col-xs-12 ">
{{render '@whitebox-regular' }}
</div>
<div class="col-md-4 col-sm-6 col-xs-12 ">
{{render '@whitebox-regular' }}
</div>
</div>
<div class="row">
{{#each columns }}
<div class="{{ modifier }}">
{{render '@whitebox-regular' whitebox merge=true }}
</div>
{{/each}}
</div>
columns:
- modifier: col-md-3 col-sm-6 col-xs-12
whitebox:
description: >-
Weet u al voor welke activiteiten u een vergunning moet aanvragen of een
melding moet doen?
count: 1
- modifier: col-md-3 col-sm-6 col-xs-12
whitebox:
description: >-
Weet u al voor welke activiteiten u een vergunning moet aanvragen of een
melding moet doen?
count: 2
- modifier: col-md-3 col-sm-6 col-xs-12
whitebox:
description: >-
Weet u al voor welke activiteiten u een vergunning moet aanvragen of een
melding moet doen?
count: 3
- modifier: col-md-3 col-sm-6 col-xs-12
whitebox:
description: >-
Weet u al voor welke activiteiten u een vergunning moet aanvragen of een
melding moet doen?
count: 4
- modifier: col-md-3 col-sm-6 col-xs-12
whitebox:
description: >-
Weet u al voor welke activiteiten u een vergunning moet aanvragen of een
melding moet doen?
count: 5
- modifier: col-md-3 col-sm-6 col-xs-12
whitebox:
description: >-
Weet u al voor welke activiteiten u een vergunning moet aanvragen of een
melding moet doen?
count: 6
- Handle: @examples
- Preview:
- Filesystem Path: components\02-content\whitebox\examples.hbs
- References (2): @whitebox-small, @whitebox-regular
Breedte van het element wordt gedicteerd door de bootstrap class van het omliggende element.