consumerportal/views/sports/dashboard.html

mydna Custimised for you

<div ng-if="!vm.loaded" class="window shadow loading"><span>Loading Details...</span></div>
<div ng-if="vm.loaded" class="window shadow report dashboard">
    <report-navigator title="'Fitness'" links="vm.navigation" selected-value="'dashboard'"></report-navigator>
    <div class="main">
        <div class="gauge">
            <div class="title">Power vs Endurance</div>
            <div class="caption">Are you built for power or endurance?</div>
            <div class="you" ng-style="{opacity: vm.powerEndurance.value === 0 ? 0 : 1}"><div class="adjust-left" style="left: 0">
                <div ng-bind="vm.powerEndurance.value + '%'"></div>
                <div ng-bind="(100 - vm.powerEndurance.value) + '%'"></div>
                <div ng-bind="vm.details.PowerEndurance"></div></div><div class="adjust-arrow" style="left: 0"></div></div>
            <div class="allrounder" ng-class="{enabled: vm.allRounder}"><div></div><div></div></div>
            <div class="peline"><div class="adjust-power" style="width: 0"></div><div class="adjust-endurance" style="width: 100%"></div></div>
            <div class="labels"><div ng-bind-template="Power {{vm.powerEndurance.value}}%"></div><div class="solo" ng-if="vm.allRounder">All Rounder</div><div ng-bind-template="Endurance {{100 - vm.powerEndurance.value}}%"></div></div>
            <div class="result smaller"><div ng-bind="vm.powerEndurance.result"></div></div>
        </div>
        <div class="gap"></div>
        <div class="inline collapse">
            <gauge name="'Stamina'" genes="'AGT, PPARGC1A, IL6'" pc="vm.stamina.value"
                   left-label="'Low'" top-label="'Regular'" right-label="'High'"
                   caption="'How good is your stamina?'"
                   result="vm.stamina.result"></gauge>
            <gauge name="'Injury Risk'" genes="'COL1A1, COL5A1'" pc="vm.injury.value"
                   left-label="'Lower'" top-label="'Standard'" right-label="'Greater'"
                   caption="'Are you more prone to injury?'"
                   result="vm.injury.result"></gauge>
            <gauge name="'Recovery'" genes="'IL6, ACTN3, AMPD1'" pc="vm.recovery.value"
                   left-label="'Slower'" top-label="'Standard'" right-label="'Faster'"
                   caption="'How quickly can you recover?'"
                   result="vm.recovery.result"></gauge>
        </div>
    </div>
</div>