annotation-menu.component.html

@let proofs = proofs$ | async;

<ul ngbNav #nav="ngbNav" [(activeId)]="active" class="nav-tabs flex-nowrap">
    <li [ngbNavItem]="1">
        <button ngbNavLink>
            <fa-icon
                [icon]="faSquarePollHorizontal"
                class="me-2"
                aria-hidden="true"
            />
            <span i18n>Syntactic parses</span>
        </button>
        <ng-template ngbNavContent>
            <la-annotation-parse-results />
        </ng-template>
    </li>
    <li [ngbNavItem]="2">
        <button ngbNavLink>
            <b class="me-2" aria-hidden>⊤</b>
            <span i18n>Proof / Entailment</span>
        </button>
        <ng-template ngbNavContent>
            <section class="overflow-x-scroll">
                @if (proofs) {
                <la-tableau-svg [tree]="proofs.entailment"></la-tableau-svg>
                } @else {
                <la-no-data dataType="proof" />
                }
            </section>
        </ng-template>
    </li>
    <li [ngbNavItem]="3">
        <button ngbNavLink>
            <b class="me-2" aria-hidden>⊥</b>
            <span i18n>Proof / Contradiction</span>
        </button>
        <ng-template ngbNavContent>
            <section class="overflow-x-scroll">
                @if (proofs) {
                <la-tableau-svg [tree]="proofs.contradiction"></la-tableau-svg>
                } @else {
                <la-no-data dataType="proof" />
                }
            </section>
        </ng-template>
    </li>
    <li [ngbNavItem]="4">
        <button ngbNavLink>
            <fa-icon [icon]="faPenNib" class="me-2" aria-hidden="true" />
            <span i18n>Comments / History</span>
        </button>
        <ng-template ngbNavContent>
            <la-annotation-comments />
        </ng-template>
    </li>
</ul>

<div [ngbNavOutlet]="nav" class="mt-2"></div>