aodb/app/flight-detail/detail/flight-detail.tpl.html

<ion-view view-title="{{vm.viewTitle}}">
    <ion-content scroll="false">

        <div ng-show="vm.model.IsOutsideOfWindow" class="row row-center">
            <h4 class="col text-center">
                <div class="font-thin primary-color">This flight is outside of the selected Flight Window and is no longer viewable.</div>
                <a class="primary-color" ng-click="vm.goBack();">Go back</a>
            </h4>
        </div>
        <div ng-show="!vm.model.IsOutsideOfWindow">
            <div class="row" ng-show="vm.loading && !vm.model.IsOutsideOfWindow">
                <div class="col">
                    <ion-spinner icon="spiral" class="primary-color vcenter"></ion-spinner>
                </div>
            </div>

            <div class="flight-container flight-detail flight-header" ng-show="!vm.loading && !vm.model.IsOutsideOfWindow">
                <div class="row">
                    <div class="col-20">
                        <a class="item-avatar" on-tap="vm.showDetail(flt)">
                            <img ng-src="{{vm.flightInformationService.getOperatorUrl(vm.flight.Operator);}}">
                        </a>
                    </div>
                    <div class="col item" style="margin-top: -10px;">
                        <div class="row">
                            <h2 class="col">
                                <span class="primary-color">{{vm.flight.Operator}}</span>{{vm.flight.Number}}
                                <span class="primary-color">/</span> {{vm.flight.Location}}
                                <span class="primary-color">/</span> {{vm.flight.Registration}}
                                <span class="pull-right" ng-switch="vm.flightInformationService.getTimeDisplayEnum(vm.flight)">
                                    <span ng-switch-when="A">A: {{vm.flight.Actual | chromaDateFilter}}</span>
                                    <span ng-switch-when="E">E: {{vm.flight.Estimated | chromaDateFilter}}</span>
                                    <span ng-switch-when="S">S: {{vm.flight.Scheduled | chromaDateFilter}}</span>
                                </span>
                            </h2>
                        </div>
                        <div class="row" style="margin-top: 2px;">
                            <div class="col text-left primary-color shunt-down-text">
                                <span class="descriptor"><i class="icon ion-ios-paperplane"></i></span> {{vm.flight.AircraftType}}
                            </div>
                            <div class="col text-left primary-color shunt-down-text">
                                <span class="descriptor"><i class="icon ion-speakerphone"></i> </span> {{vm.flight.Terminal}}
                            </div>
                            <div class="col text-left primary-color shunt-down-text">
                                <span class="descriptor"><i class="icon ion-ios-pricetag"></i> </span> {{vm.flight.Stand}}
                            </div>
                            <div class="col text-right" ng-class="{arrival: vm.flight.Type === 'A', departure: vm.flight.Type === 'D'}">
                                <div class="ind-text text-center" ng-if="vm.flight.Type === 'A'">
                                    <small>Inbound</small>
                                </div>
                                <div class="ind-text text-center" ng-if="vm.flight.Type === 'D'">
                                    <small>Outbound</small>
                                </div>
                            </div>
                        </div>

                    </div>
                </div>
            </div>
            <ion-nav-view class="animated fadeInRight" style="margin-top: 15px; height: 72%;" ng-show="!vm.loading" name="flight-detail"></ion-nav-view>
        </div>

    </ion-content>
</ion-view>