BBR

Med primær og sekundær handling

Parat til dokumentation

<div class="flow-nav ">
    <div class="container">
        <div class="row align-items-center justify-content-between">
            <div class="col-12 col-lg-auto order-lg-last">
                <a href="#" class="btn btn-dark btn-lg btn-block">
                    Primær handling
                </a>
            </div>
            <div class="col-12 col-lg-auto order-lg-first">
                <div class="row">
                    <div class="col-12 col-lg-auto mt-2 mt-lg-0">
                        <a href="#" class="btn btn-outline-white btn-block">
                            Sekundær handling
                        </a>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
 
<div class="flow-nav {{#if hasAltCta}}flow-nav--alt{{/if}}">
    <div class="container">
        <div class="row align-items-center justify-content-between">
            <div class="col-12 col-lg-auto {{#unless isPrimaryLeft}}order-lg-last{{/unless}}">
                <a href="#" class="btn btn-{{#if hasAltCta}}cta-alt{{else}}dark{{/if}} btn-lg btn-block{{#if hasContinue}} btn-continue{{/if}}">
                    {{primaryActionLabel}}
                </a>
            </div>
            <div class="col-12 col-lg-auto {{#unless isPrimaryLeft}}order-lg-first{{/unless}}">
                <div class="row">
                    {{#if secondaryActionLabel}}
                    <div class="col-12 col-lg-auto mt-2 mt-lg-0">
                        <a href="#" class="btn btn-outline-white btn-block">
                            {{secondaryActionLabel}}
                        </a>
                    </div>
                    {{/if}}
                    {{#if tertiaryActionLabel}}
                    <div class="col-12 col-lg-auto mt-2 mt-lg-0">
                        <a href="#" class="btn btn-outline-white btn-block">
                            {{tertiaryActionLabel}}
                        </a>
                    </div>
                    {{/if}}
                </div>
            </div>
        </div>
    </div>
</div>
 
{
  "primaryActionLabel": "Primær handling",
  "secondaryActionLabel": "Sekundær handling"
}