nycJSorg/angular-presentation

<div class="buttons" *ngIf="!isComplete">
  <slides-stack-function-button
    *ngFor="let func of level.functions"
    (click)="canAddFunction(stack, func) && addFunction(func)"
    [disabled]="!canAddFunction(stack, func)"
    [func]="func"
  >
  </slides-stack-function-button>
</div>

<div class="complete" *ngIf="isComplete">
  ✨💖 Success! ✨💖
</div>

<div class="history">
  <div class="functions">
    <div class="item initial">Initial stack:</div>
    <div
      *ngFor="let func of functions; let last = last"
      style="display: flex;justify-content: flex-end"
    >
      <span (click)="removeFunction()" class="remove-button" *ngIf="last"
        >ⓧ</span
      >
      <slides-stack-function [func]="func" class="item"></slides-stack-function>
    </div>
  </div>

  <div class="stack">
    <div class="item">
      <slides-simple-stack [value]="level.inputs"></slides-simple-stack>
    </div>
    <div *ngFor="let stack of history" class="item">
      <slides-simple-stack [value]="stack"></slides-simple-stack>
    </div>
  </div>
</div>
<hr />

<div class="history ">
  <div class="item initial">Expected:</div>
  <div class="item stack">
    <slides-simple-stack [value]="level.outputs"></slides-simple-stack>
  </div>
</div>