shadowsocks-manager/plugins/webgui/public/views/home/resetPassword.html

A shadowsocks manager tool for multi user and traffic control.

<div layout="column" hide-gt-sm>
    <div flex="15" style="height: 40px;"></div>
    <div flex layout="row">
        <div flex="10" flex-gt-sm="30"></div>
        <div flex layout="column" layout-align="space-around stretch">
            <form name="userForm">
                <md-input-container class="md-block">
                    <label>新密码</label>
                    <input type="password" required name="password" ng-model="user.password" md-autofocus>
                    <div ng-messages="userForm.password.$error">
                        <div ng-message="required">密码不能为空</div>
                    </div>
                </md-input-container>
                <md-input-container class="md-block">
                    <label>重复新密码</label>
                    <input type="password" required name="passwordAgain" ng-model="user.passwordAgain">
                    <div ng-messages="userForm.passwordAgain.$error">
                        <div ng-message="required">密码不能为空</div>
                    </div>
                </md-input-container>
            </form>
        </div>
        <div flex="10" flex-gt-sm="30"></div>
    </div>
    <div flex layout="row" layout-align="center start">
        <div flex="10" flex-gt-sm="30"></div>
        <div layout="row" flex layout-align="space-around center">
            <md-button class="md-raised md-primary" ng-click="resetPassword()" ng-disabled="!user.password || user.password !== user.passwordAgain">重置密码</md-button>
        </div>
        <div flex="10" flex-gt-sm="30"></div>
    </div>
</div>
<div layout="column" hide-xs hide-sm>
    <div flex="20" style="min-height: 120px; height: 120px;"></div>
    <div layout="row" layout-align="center center">
        <div flex="25"></div>
        <md-card flex="50" style="min-height: 40vh;">
            <div flex="5"></div>
            <md-card-content layout="row" layout-align="center center">
                <div flex="30" layout="row" layout-align="center center" layout-margin>
                    <img src="/favicon.png" style="width: 100%;">
                </div>
                <div flex>
                    <div flex layout="row">
                        <div flex="10"></div>
                        <div flex layout="column" layout-align="space-around stretch">
                          <form name="userForm">
                              <md-input-container class="md-block">
                                  <label>新密码</label>
                                  <input type="password" required name="password" ng-model="user.password" md-autofocus>
                                  <div ng-messages="userForm.password.$error">
                                      <div ng-message="required">密码不能为空</div>
                                  </div>
                              </md-input-container>
                              <md-input-container class="md-block">
                                  <label>重复新密码</label>
                                  <input type="password" required name="passwordAgain" ng-model="user.passwordAgain">
                                  <div ng-messages="userForm.passwordAgain.$error">
                                      <div ng-message="required">密码不能为空</div>
                                  </div>
                              </md-input-container>
                          </form>
                        </div>
                        <div flex="10"></div>
                    </div>
                    <div flex layout="row" layout-align="center start">
                        <div flex="10"></div>
                        <div layout="row" flex layout-align="space-around center">
                            <md-button class="md-raised md-primary" ng-click="resetPassword()" ng-disabled="!user.password || user.password !== user.passwordAgain">重置密码</md-button>
                        </div>
                        <div flex="10"></div>
                    </div>
                </div>
            </md-card-content>
            <div flex="5"></div>
        </md-card>
        <div flex="25"></div>
    </div>
</div>