comparison index.xhtml @ 10:e47b9bd55192

Also use a spinner on nickname get/set.
author Emmanuel Gil Peyrot <linkmauve@linkmauve.fr>
date Sat, 22 Dec 2018 16:13:01 +0100
parents b994c6c19f5c
children aedf80eefc19
comparison
equal deleted inserted replaced
9:b994c6c19f5c 10:e47b9bd55192
40 40
41 <div class="row"> 41 <div class="row">
42 <form id="connection"> 42 <form id="connection">
43 <label>JID: <input type="email" id="jid" placeholder="you@your-server.tld"/></label><br/> 43 <label>JID: <input type="email" id="jid" placeholder="you@your-server.tld"/></label><br/>
44 <label>Password: <input type="password" id="pass" placeholder="Password"/></label><br/> 44 <label>Password: <input type="password" id="pass" placeholder="Password"/></label><br/>
45 <input type="submit" id="connect" value="connect"/> <img src="spinner.svg" width="24" height="24" id="spinner" hidden=""/> 45 <input type="submit" id="connect" value="connect"/>
46 <img src="spinner.svg" width="24" height="24" id="connect-spinner" hidden=""/>
46 </form> 47 </form>
47 </div> 48 </div>
48 49
49 <div id="connected" hidden=""> 50 <div id="connected" hidden="">
50 51
51 <div class="row"> 52 <div class="row">
52 <h1>Account</h1> 53 <h1>Account</h1>
53 <h2>Nickname</h2> 54 <h2>Nickname</h2>
54 <p> 55 <p>
55 <label>Nickname: <input id="nick" placeholder="Nick"/></label> 56 <label>Nickname: <input id="nick" placeholder="Nick"/></label>
57 <img src="spinner.svg" width="24" height="24" id="nick-spinner"/>
56 </p> 58 </p>
57 <h2>Avatar</h2> 59 <h2>Avatar</h2>
58 <p> 60 <p>
59 <img id="avatar" style="max-width:96px;max-height:96px"/> <span id="avatar-size"/><br/> 61 <img id="avatar" style="max-width:96px;max-height:96px"/> <span id="avatar-size"/><br/>
60 <input type="file" style="display:none" accept="image/*" id="avatar-file"/> 62 <input type="file" style="display:none" accept="image/*" id="avatar-file"/>