Motion >> Repos - motion-next.git/blob

   1 <md-button
   2   class="ms-stepper-navigation-item"
   3   ng-class="{'current': MsStepper.isStepCurrent(stepInfo.stepNumber), 'valid': MsStepper.isStepValid(stepInfo.stepNumber), 'disabled': MsStepper.isStepDisabled(stepInfo.stepNumber), 'optional': MsStepper.isStepOptional(stepInfo.stepNumber)}"
   4   ng-click="MsStepper.gotoStep(stepInfo.stepNumber)"
   5   ng-disabled="MsStepper.isStepDisabled(stepInfo.stepNumber)"
   6   ng-hide="MsStepper.isStepHidden(stepInfo.stepNumber)"
   7   aria-label="Stepper navigation button"
   8   layout="row"
   9   layout-align="start center"
  10 >
  11   <div class="step" layout="row" layout-align="center center">
  12     <span
  13       ng-if="!MsStepper.isStepValid(stepInfo.stepNumber) || MsStepper.isStepOptional(stepInfo.stepNumber)"
  14     >
  15       <i class="icon icon-checkbox-blank-circle-outline s18 md-accent-fg"></i>
  16     </span>
  17     <span
  18       ng-if="MsStepper.isStepValid(stepInfo.stepNumber) && !MsStepper.isStepOptional(stepInfo.stepNumber)"
  19     >
  20       <i class="icon icon-check-circle s18 md-accent-fg"></i>
  21     </span>
  22   </div>
  23
  24   <div layout="column" layout-align="start start">
  25     <div class="title" ng-if="stepInfo.stepTitleTranslate">
  26       {{stepInfo.stepTitleTranslate | translate }}
  27     </div>
  28     <div class="title" ng-if="!stepInfo.stepTitleTranslate">
  29       {{stepInfo.stepTitle}}
  30     </div>
  31     <div class="subtitle" ng-if="MsStepper.isStepOptional(stepInfo.stepNumber)">
  32       Optional
  33     </div>
  34   </div>
  35 </md-button>
  36
  37 <div class="ms-stepper-step-content" ng-transclude></div>
  38
  39 <div
  40   class="ms-stepper-controls"
  41   layout="row"
  42   layout-align="start center"
  43   ng-show="MsStepper.isStepCurrent(stepInfo.stepNumber)"
  44 >
  45   <md-button
  46     class="md-accent md-raised"
  47     ng-disabled="MsStepper.isFirstStep()"
  48     ng-click="MsStepper.gotoPreviousStep()"
  49   >
  50     Back
  51   </md-button>
  52
  53   <md-button
  54     class="md-accent md-raised"
  55     ng-if="!MsStepper.isLastStep()"
  56     ng-disabled="!MsStepper.isStepValid(MsStepper.currentStepNumber)"
  57     ng-click="MsStepper.gotoNextStep()"
  58   >
  59     Next
  60   </md-button>
  61
  62   <md-button
  63     type="submit"
  64     class="md-accent md-raised"
  65     ng-click="MsStepper.resetForm()"
  66     ng-if="MsStepper.isLastStep()"
  67     ng-disabled="!MsStepper.isFormValid()"
  68   >
  69     Submit
  70   </md-button>
  71 </div>