<header class="settings-content-header user-settings-header"> <h2 class="hidden">Your Profile</h2> <div class="settings-header-inner"> {{#link-to 'settings' class='button-back button'}}Back{{/link-to}} <section class="page-actions page-actions-alt"> {{#unless session.user.isAuthor}} {{#link-to "settings.users" class="button has-icon users-back" tagName="button"}}<i class="icon-chevron-left"></i>Users{{/link-to}} {{/unless}} </section> <section class="page-actions"> {{#if view.userActionsAreVisible}} {{#gh-popover-button popoverName="user-actions-menu" tagName="a" classNames="button only-has-icon user-actions-cog" title="User Actions"}} <i class="icon-settings"></i> <span class="hidden">User Settings</span> {{/gh-popover-button}} {{#gh-popover name="user-actions-menu" classNames="user-actions-menu menu-drop-right"}} {{render "user-actions-menu" model}} {{/gh-popover}} {{/if}} <button class="button-save" {{action "save"}}>Save</button> </section> </div> </header> <section class="content settings-user no-padding"> <header class="user-profile-header"> <img id="user-cover" class="cover-image" {{bind-attr src=cover title=coverTitle}} /> <button type="button" class="edit-cover-image js-modal-cover button" {{action "openModal" "upload" user "cover"}}>Change Cover</button> </header> <form class="user-profile" novalidate="novalidate" autocomplete="off"> {{!-- Horrible hack to prevent Chrome from incorrectly auto-filling inputs --}} <input style="display:none;" type="text" name="fakeusernameremembered"/> <input style="display:none;" type="password" name="fakepasswordremembered"/> <fieldset class="user-details-top"> <figure class="user-image"> <div id="user-image" class="img" {{bind-attr style=image}} href="#"><span class="hidden">{{name}}"s Picture</span></div> <button type="button" {{action "openModal" "upload" user "image"}} class="edit-user-image js-modal-image">Edit Picture</button> </figure> <div class="form-group"> <label for="user-name">Full Name</label> {{input value=user.name id="user-name" class="user-name" placeholder="Full Name" autocorrect="off"}} <p>Use your real name so people can recognise you</p> </div> </fieldset> <fieldset class="user-details-bottom"> <div class="form-group"> <label for="user-slug">Slug</label> {{!-- {{input value=user.slug id="user-slug" placeholder="Slug" autocorrect="off"}} --}} {{gh-blur-input class="user-name" id="user-slug" value=user.slug name="user" action="updateSlug" placeholder="Slug" selectOnClick="true" autocorrect="off"}} <p>{{gh-blog-url}}/author/{{user.slug}}</p> </div> <div class="form-group"> <label for="user-email">Email</label> {{input type="email" value=user.email id="user-email" placeholder="Email Address" autocapitalize="off" autocorrect="off" autocomplete="off"}} <p>Used for notifications</p> </div> {{#if view.rolesDropdownIsVisible}} <div class="form-group"> <label for="user-role">Role</label> {{gh-role-selector initialValue=role onChange="changeRole" selectId="user-role"}} <p>What permissions should this user have?</p> </div> {{/if}} <div class="form-group"> <label for="user-location">Location</label> {{input type="text" value=user.location id="user-location"}} <p>Where in the world do you live?</p> </div> <div class="form-group"> <label for="user-website">Website</label> {{input type="url" value=user.website id="user-website" autocapitalize="off" autocorrect="off" autocomplete="off"}} <p>Have a website or blog other than this one? Link it!</p> </div> <div class="form-group bio-container"> <label for="user-bio">Bio</label> {{textarea id="user-bio" value=user.bio}} <p> Write about you, in 200 characters or less. {{gh-count-characters user.bio}} </p> </div> <hr /> </fieldset> <fieldset> <div class="form-group"> <label for="user-password-old">Old Password</label> {{input value=user.password type="password" id="user-password-old"}} </div> <div class="form-group"> <label for="user-password-new">New Password</label> {{input value=user.newPassword type="password" id="user-password-new"}} </div> <div class="form-group"> <label for="user-new-password-verification">Verify Password</label> {{input value=user.ne2Password type="password" id="user-new-password-verification"}} </div> <div class="form-group"> <button type="button" class="button-delete button-change-password" {{action "password"}}>Change Password</button> </div> </fieldset> </form> </section>