Progress bar

Progress bar

<div class="c-progressbar" data-uid="673eded4c0afd">
    <div class="c-progressbar__value" style="width:25%;"></div>
</div>

    <div class="c-progressbar u-margin__top--3 c-progressbar--cancelled" data-uid="673eded4c0b3a">
    <div class="c-progressbar__value" style="width:75%;"></div>
</div>
@progressBar([
    'value' => 25,
])
@endprogressBar

@progressBar([
    'value' => 75,
    'isCancelled' => true,
    'classList' => ['u-margin__top--3']
])
@endprogressBar

Blade component parameters

Key Default value Type Available values Description
isCancelled false boolean - -
value 0 integer - -
id string - The DOM id of the component.
classList [] array - Array containing wrapping classes array
attributeList [] array - Array containing keys and values rendered as attributes
containerAware false boolean true/false Makes the component container aware. Appends modifiers --size--xs/sm/md/lg to the component.
Settings location: /var/www/webroot/ROOT/vendor/helsingborg-stad/component-library/source/php/Component/ProgressBar/progressBar.json