<section class="section section-breadcrumb section-breadcrumb--{position} d-print-none text-bg-light">
    <div class="container">
        <nav aria-label="breadcrumb" class="nav nav-breadcrumb border-bottom">
            <ol class="breadcrumb">
                <f:for each="{breadcrumb}" as="page" iteration="i">
                    <f:if condition="{i.isLast}">
                        <f:then>
                            <li class="breadcrumb-item active" aria-current="page">
                                <f:link.page pageUid="{page.data.uid}">{page.title -> f:format.raw()}</f:link.page>
                            </li>
                        </f:then>
                        <f:else if="{i.isFirst}">
                            <li class="breadcrumb-item home">
                                <f:link.page pageUid="{page.data.uid}">{page.title -> f:format.raw()}</f:link.page>
                            </li>
                        </f:else>
                        <f:else>
                            <li class="breadcrumb-item">
                                <f:link.page pageUid="{page.data.uid}">{page.title -> f:format.raw()}</f:link.page>
                            </li>
                        </f:else>

                    </f:if>
                </f:for>
            </ol>

        </nav>
    </div>
</section>
