opt-cc/static/src/app/army/army.component.html

<div class="army-content-container">
  <h1>{{'public.army.headline' | translate}}</h1>

  <div class="pull-left army-column" *ngIf="!isSmallLayout || singleViewSelected === fraction.BLUFOR">
    <h3 class="army-head" [style.color]="fraction.COLOR_BLUFOR">
      {{fraction.BLUFOR}}
      <button mat-icon-button class="switch-btn-blufor"
              (click)="singleViewSwitch(fraction.OPFOR)">
        <mat-icon svgIcon="chevron-right"></mat-icon>
      </button>
    </h3>
    <cc-army-squad *ngFor="let squad of army[0].squads"
                   [squad]="squad"
                   squadFraction="BLUFOR"
                   (memberSelect)="select($event)">
    </cc-army-squad>
    <div class="member-count">{{'public.army.members' | translate}} {{army[0].memberCount}}</div>
  </div>

  <div class="pull-right army-column" *ngIf="!isSmallLayout || singleViewSelected === fraction.OPFOR">
    <h3 class="army-head" [style.color]="fraction.COLOR_OPFOR">
      <button mat-icon-button class="switch-btn-opfor"
              (click)="singleViewSwitch(fraction.BLUFOR)">
        <mat-icon svgIcon="chevron-right"></mat-icon>
      </button>
      {{fraction.OPFOR}}
    </h3>
    <cc-army-squad *ngFor="let squad of army[1].squads"
                   [squad]="squad"
                   squadFraction="OPFOR"
                   (memberSelect)="select($event)">
    </cc-army-squad>
    <div class="member-count">{{'public.army.members' | translate}} {{army[1].memberCount}}</div>
  </div>
</div>