Vmeda.Online/src/core/components/navigation-bar/core-navigation-bar.html

<ion-grid class="ion-no-padding ion-padding-bottom" *ngIf="previous || info || next">
    <ion-row>
        <ion-col class="ion-text-start" size="4">
            <ion-button *ngIf="previous" class="core-navigation-bar-arrow"
                [title]="previousTitle || ('core.previous' | translate)" (click)="action?.emit(previous)">
                <ion-icon name="fas-arrow-left" [slot]="previousTitle ? 'start' : 'icon-only'" aria-hidden="true"></ion-icon>
                <core-format-text *ngIf="previousTitle" [text]="previousTitle" [component]="component" [componentId]="componentId"
                    [contextLevel]="contextLevel" [contextInstanceId]="contextInstanceId" [courseId]="courseId" aria-hidden="true">
                </core-format-text>
            </ion-button>
        </ion-col>
        <ion-col class="ion-text-center ion-padding-horizontal" size="4">
            <ion-button fill="clear" *ngIf="info" (click)="showInfo()" [attr.aria-label]="title">
                <ion-icon slot="icon-only" name="fas-info-circle" aria-hidden="true"></ion-icon>
            </ion-button>
        </ion-col>
        <ion-col class="ion-text-end" size="4">
            <ion-button *ngIf="next" class="core-navigation-bar-arrow" [attr.aria-label]="nextTitle || ('core.next' | translate)"
                (click)="action?.emit(next)">
                <core-format-text *ngIf="nextTitle" [text]="nextTitle" [component]="component" [componentId]="componentId"
                    [contextLevel]="contextLevel" [contextInstanceId]="contextInstanceId" [courseId]="courseId" aria-hidden="true">
                </core-format-text>
                <ion-icon name="fas-arrow-right" [slot]="nextTitle ? 'end' : 'icon-only'" aria-hidden="true"></ion-icon>
            </ion-button>
        </ion-col>
    </ion-row>
</ion-grid>