Pony.fm/public/templates/account/settings.html

<form ng-submit="updateAccount()" class="pfm-form account-settings-form">
    <ul class="toolbar">
        <li>
            <button type="submit" class="btn btn-default" ng-class="{disabled: !isDirty || isSaving, 'btn-primary': isDirty}">
                Save Changes
                <i ng-show="isSaving" class="fa fa-cog fa-spin fa-lg"></i>
            </button>
        </li>
    </ul>
    <div class="stretch-to-bottom">
        <div class="form-row" ng-class="{'has-error': errors.display_name != null}">
            <label for="sync_names" class="strong"><input ng-disabled="isSaving" ng-change="touchModel();" id="sync_names" type="checkbox" ng-model="settings.sync_names" /> Sync my MLP Forums display name with Pony.fm</label>
            <input type="text" ng-disabled="isSaving" ng-change="touchModel()" ng-show="!settings.sync_names" placeholder="Display Name" id="display_name" ng-model="settings.display_name" />
            <div ng-show="settings.sync_names" class="alert alert-info">Your current MLP Forums display name is <strong>{{settings.mlpforums_name}}</strong></div>
            <div class="error">{{errors.display_name}}</div>
        </div>
        <div class="form-row">
            <label for="can_see_explicit_content" class="strong"><input ng-change="touchModel()" ng-disabled="isLoading" id="can_see_explicit_content" type="checkbox" ng-model="settings.can_see_explicit_content" /> Can See Explicit Content</label>
        </div>
        <div class="form-row" ng-class="{'has-error': errors.bio != null}">
            <label class="strong" for="bio">Bio</label>
            <textarea id="bio" placeholder="bio (optional)" ng-model="settings.bio" ng-disabled="isLoading" ng-change="touchModel()"></textarea>
            <div class="error">{{errors.description}}</div>
        </div>
        <div class="form-row" ng-class="{'has-error': errors.avatar != null || errors.gravatar != null}">
            <label for="uses_gravatar" class="strong">
                <input ng-change="touchModel()" ng-disabled="isLoading" id="uses_gravatar" type="checkbox" ng-model="settings.uses_gravatar" /> Use Gravatar
            </label>
            <div ng-show="!settings.uses_gravatar">
                <pfm-image-upload set-image="setAvatar" image="settings.avatar_url" user-id="settings.id"></pfm-image-upload>
            </div>
            <input type="text" ng-disabled="isSaving" ng-change="touchModel()" ng-show="settings.uses_gravatar" placeholder="Gravatar Email" ng-model="settings.gravatar" />
            <div class="error" ng-show="errors.avatar != null">{{errors.avatar}}</div>
            <div class="error" ng-show="errors.gravatar != null">{{errors.gravatar}}</div>
        </div>
</form>