Mercurial > xmpp-account-manager
comparison index.xhtml @ 23:e99984564b17
Implement a tab system, thanks Zash!
author | Emmanuel Gil Peyrot <linkmauve@linkmauve.fr> |
---|---|
date | Sun, 23 Dec 2018 14:00:59 +0100 |
parents | 46660687924b |
children | 6c620e9f7d2c |
comparison
equal
deleted
inserted
replaced
22:07e33207e598 | 23:e99984564b17 |
---|---|
47 </form> | 47 </form> |
48 </div> | 48 </div> |
49 | 49 |
50 <div id="connected" hidden=""> | 50 <div id="connected" hidden=""> |
51 | 51 |
52 <div class="row"> | 52 <div id="navtabs" class="nav nav-tabs nav-justified"> |
53 <li id="tab-profile" class="active"><a href="#profile">Profile</a></li> | |
54 <li id="tab-mam"><a href="#mam">Message Archiving</a></li> | |
55 <li id="tab-pep"><a href="#pep">PEP</a></li> | |
56 <li id="tab-account"><a href="#account">Account</a></li> | |
57 </div> | |
58 | |
59 <div class="row tab-profile"> | |
53 <div class="col-sm-4"> | 60 <div class="col-sm-4"> |
54 <h2>Nickname</h2> | 61 <h2>Nickname</h2> |
55 </div> | 62 </div> |
56 <div class="col-sm-8"> | 63 <div class="col-sm-8"> |
57 <p> | 64 <p> |
62 Enter your nickname, so people you know can recognize you. | 69 Enter your nickname, so people you know can recognize you. |
63 </p> | 70 </p> |
64 </div> | 71 </div> |
65 </div> | 72 </div> |
66 | 73 |
67 <hr/> | 74 <hr class="tab-profile"/> |
68 | 75 |
69 <div class="row"> | 76 <div class="row tab-profile"> |
70 <div class="col-sm-4"> | 77 <div class="col-sm-4"> |
71 <h2>Avatar</h2> | 78 <h2>Avatar</h2> |
72 <p>This image allows your contact to quickly identify you.</p> | 79 <p>This image allows your contact to quickly identify you.</p> |
73 </div> | 80 </div> |
74 <div class="col-sm-8"> | 81 <div class="col-sm-8"> |
83 </select></label> <img width="24" height="24" id="access-model-avatar-spinner" hidden=""/> | 90 </select></label> <img width="24" height="24" id="access-model-avatar-spinner" hidden=""/> |
84 </p> | 91 </p> |
85 </div> | 92 </div> |
86 </div> | 93 </div> |
87 | 94 |
88 <hr/> | 95 <div class="row tab-account" hidden=""> |
89 | |
90 <div class="row"> | |
91 <div class="col-sm-4"> | 96 <div class="col-sm-4"> |
92 <h2>Contact list</h2> | 97 <h2>Contact list</h2> |
93 </div> | 98 </div> |
94 <div class="col-sm-8"> | 99 <div class="col-sm-8"> |
95 <table> | 100 <table> |
99 <tbody id="roster-table"/> | 104 <tbody id="roster-table"/> |
100 </table> | 105 </table> |
101 </div> | 106 </div> |
102 </div> | 107 </div> |
103 | 108 |
104 <hr/> | 109 <hr class="tab-account" hidden=""/> |
105 | 110 |
106 <div class="row"> | 111 <div class="row tab-account" hidden=""> |
112 <div class="col-sm-4"> | |
113 <h2>Dangerous zone</h2> | |
114 </div> | |
115 <div class="col-sm-8"> | |
116 <p> | |
117 <button disabled="">Change my password</button> | |
118 <button disabled="">⚠️ Delete my account</button> | |
119 </p> | |
120 </div> | |
121 </div> | |
122 | |
123 <div class="row tab-pep" hidden=""> | |
107 <div class="col-sm-4"> | 124 <div class="col-sm-4"> |
108 <h2>PEP</h2> | 125 <h2>PEP</h2> |
109 </div> | 126 </div> |
110 <div class="col-sm-8"> | 127 <div class="col-sm-8"> |
111 <table> | 128 <table> |
115 <tbody id="pep-table"/> | 132 <tbody id="pep-table"/> |
116 </table> | 133 </table> |
117 </div> | 134 </div> |
118 </div> | 135 </div> |
119 | 136 |
120 <hr/> | 137 <div class="row tab-mam" hidden=""> |
121 | |
122 <div class="row"> | |
123 <div class="col-sm-4"> | |
124 <h2>Dangerous zone</h2> | |
125 </div> | |
126 <div class="col-sm-8"> | |
127 <p> | |
128 <button disabled="">Change my password</button> | |
129 <button disabled="">⚠️ Delete my account</button> | |
130 </p> | |
131 </div> | |
132 </div> | |
133 | |
134 <hr/> | |
135 | |
136 <div class="row"> | |
137 <div class="col-sm-4"> | 138 <div class="col-sm-4"> |
138 <h2>Message Archiving</h2> | 139 <h2>Message Archiving</h2> |
139 </div> | 140 </div> |
140 <div class="col-sm-8"> | 141 <div class="col-sm-8"> |
141 <p> | 142 <p> |