Merge lp:~deadlight/canonical-identity-provider/devices-list into lp:~deadlight/canonical-identity-provider/vanilla
- devices-list
- Merge into vanilla
Proposed by
Karl Williams
Status: | Merged |
---|---|
Approved by: | Karl Williams |
Approved revision: | 1706 |
Merged at revision: | 1706 |
Proposed branch: | lp:~deadlight/canonical-identity-provider/devices-list |
Merge into: | lp:~deadlight/canonical-identity-provider/vanilla |
Prerequisite: | lp:~deadlight/canonical-identity-provider/emails |
Diff against target: |
1024 lines (+367/-390) 15 files modified
src/identityprovider/static_src/scss/styles.scss (+16/-2) src/webui/templates/common/missing_backup_device_warning.html (+5/-5) src/webui/templates/device/addition-generic.html (+58/-69) src/webui/templates/device/addition-google.html (+42/-41) src/webui/templates/device/addition-yubi.html (+11/-13) src/webui/templates/device/code-list.html (+4/-6) src/webui/templates/device/device-help.html (+40/-37) src/webui/templates/device/list.html (+46/-63) src/webui/templates/device/print-codes.html (+9/-22) src/webui/templates/device/removal.html (+16/-19) src/webui/templates/device/rename.html (+22/-24) src/webui/templates/device/types.html (+69/-58) src/webui/templates/vanilla/_footer.html (+2/-2) src/webui/templates/vanilla/base.html (+26/-28) src/webui/templates/vanilla/widgets/personal-menu.html (+1/-1) |
To merge this branch: | bzr merge lp:~deadlight/canonical-identity-provider/devices-list |
Related bugs: |
Reviewer | Review Type | Date Requested | Status |
---|---|---|---|
Anthony Dillon (community) | Approve | ||
Review via email: mp+371445@code.launchpad.net |
This proposal supersedes a proposal from 2019-08-13.
Commit message
Description of the change
- Updated the devices list page to Vanilla
- Styled the left-hand user nav so that it works on small screens/mobile
QA:
- npm i
- ./node_
- source env/bin/activate
- make start-db
- make run
- Visit http://[CONTAINER IP]:8000/ in your browser
- Create an account using the form
- Go to http://[CONTAINER IP]:8000/
To post a comment you must log in.
Revision history for this message
Karl Williams (deadlight) wrote : Posted in a previous version of this proposal | # |
Revision history for this message
Anthony Dillon (ya-bo-ng) wrote : Posted in a previous version of this proposal | # |
LGTM +1
review:
Approve
Revision history for this message
Anthony Dillon (ya-bo-ng) wrote : Posted in a previous version of this proposal | # |
Will check the further commits
Revision history for this message
Karl Williams (deadlight) wrote : Posted in a previous version of this proposal | # |
I've pushed up all pages in this section. Ready for full review.
Revision history for this message
Barry McGee (barry-mcgee) wrote : | # |
Some comments inline.
Revision history for this message
Anthony Dillon (ya-bo-ng) wrote : | # |
QA looks good but would be nice to overflow the tables. I believe they will require a wrapping div with some styles.
review:
Approve
Preview Diff
[H/L] Next/Prev Comment, [J/K] Next/Prev File, [N/P] Next/Prev Hunk
1 | === modified file 'src/identityprovider/static_src/scss/styles.scss' | |||
2 | --- src/identityprovider/static_src/scss/styles.scss 2019-08-19 08:29:07 +0000 | |||
3 | +++ src/identityprovider/static_src/scss/styles.scss 2019-08-19 08:29:07 +0000 | |||
4 | @@ -34,7 +34,14 @@ | |||
5 | 34 | 34 | ||
6 | 35 | //Side navigation for logged in users | 35 | //Side navigation for logged in users |
7 | 36 | .p-sidebar { | 36 | .p-sidebar { |
9 | 37 | border-right: 1px solid $color-mid-light; | 37 | @media only screen and (max-width: $breakpoint-medium) { |
10 | 38 | padding: 0 $sph-inner--small; | ||
11 | 39 | border-bottom: 1px solid $color-mid-light; | ||
12 | 40 | } | ||
13 | 41 | |||
14 | 42 | @media only screen and (min-width: $breakpoint-medium + 1) { | ||
15 | 43 | border-right: 1px solid $color-mid-light; | ||
16 | 44 | } | ||
17 | 38 | 45 | ||
18 | 39 | .is-active { | 46 | .is-active { |
19 | 40 | position: relative; | 47 | position: relative; |
20 | @@ -53,7 +60,8 @@ | |||
21 | 53 | 60 | ||
22 | 54 | // Fix for mixed buttons | 61 | // Fix for mixed buttons |
23 | 55 | @media only screen and (min-width: $breakpoint-x-small + 1) { | 62 | @media only screen and (min-width: $breakpoint-x-small + 1) { |
25 | 56 | [class^="p-button"] + [class^="p-button"] { | 63 | button[class^="p-button"] + a[class^="p-button"], |
26 | 64 | a[class^="p-button"] + button[class^="p-button"] { | ||
27 | 57 | margin-left: $sph-inner; | 65 | margin-left: $sph-inner; |
28 | 58 | } | 66 | } |
29 | 59 | } | 67 | } |
30 | @@ -64,3 +72,9 @@ | |||
31 | 64 | overflow: hidden; | 72 | overflow: hidden; |
32 | 65 | white-space: nowrap; | 73 | white-space: nowrap; |
33 | 66 | } | 74 | } |
34 | 75 | |||
35 | 76 | // Custom table style | ||
36 | 77 | .p-table--bordered { | ||
37 | 78 | border-top: 1px solid $color-mid-light; | ||
38 | 79 | border-bottom: 1px solid $color-mid-light; | ||
39 | 80 | } | ||
40 | 67 | 81 | ||
41 | === modified file 'src/webui/templates/common/missing_backup_device_warning.html' | |||
42 | --- src/webui/templates/common/missing_backup_device_warning.html 2013-04-17 13:23:35 +0000 | |||
43 | +++ src/webui/templates/common/missing_backup_device_warning.html 2019-08-19 08:29:07 +0000 | |||
44 | @@ -2,17 +2,17 @@ | |||
45 | 2 | 2 | ||
46 | 3 | {% if need_backup_device_warning %} | 3 | {% if need_backup_device_warning %} |
47 | 4 | {% url 'device-addition' as add_device %} | 4 | {% url 'device-addition' as add_device %} |
50 | 5 | <div class="message warning" id="missing_backup_device"> | 5 | <div id="missing_backup_device" class="p-notification--caution"> |
51 | 6 | <p> | 6 | <p class="p-notification__response"> |
52 | 7 | <span class="p-notification__status">{% blocktrans %}Warning:{% endblocktrans %}</span> | ||
53 | 7 | {% blocktrans %}We strongly recommend having two authentication devices, | 8 | {% blocktrans %}We strongly recommend having two authentication devices, |
54 | 8 | a <strong>primary</strong> device and a <strong>secondary</strong> | 9 | a <strong>primary</strong> device and a <strong>secondary</strong> |
55 | 9 | or backup device. | 10 | or backup device. |
57 | 10 | </br> | 11 | <br><br> |
58 | 11 | Having two authentication devices means you can continue to access your | 12 | Having two authentication devices means you can continue to access your |
59 | 12 | account with your secondary device should your primary device be lost or | 13 | account with your secondary device should your primary device be lost or |
60 | 13 | stolen. | 14 | stolen. |
63 | 14 | </br> | 15 | <br><br> |
62 | 15 | </br> | ||
64 | 16 | Click to <a href="{{ add_device }}">add a backup device</a>.{% endblocktrans %} | 16 | Click to <a href="{{ add_device }}">add a backup device</a>.{% endblocktrans %} |
65 | 17 | </p> | 17 | </p> |
66 | 18 | </div> | 18 | </div> |
67 | 19 | 19 | ||
68 | === modified file 'src/webui/templates/device/addition-generic.html' | |||
69 | --- src/webui/templates/device/addition-generic.html 2016-12-14 11:00:33 +0000 | |||
70 | +++ src/webui/templates/device/addition-generic.html 2019-08-19 08:29:07 +0000 | |||
71 | @@ -1,4 +1,4 @@ | |||
73 | 1 | {% extends "base.html" %} | 1 | {% extends "vanilla/base.html" %} |
74 | 2 | {% load i18n %} | 2 | {% load i18n %} |
75 | 3 | 3 | ||
76 | 4 | {% comment %} | 4 | {% comment %} |
77 | @@ -8,81 +8,70 @@ | |||
78 | 8 | 8 | ||
79 | 9 | {% block html_extra %}data-qa-id="generic_device_addition"{% endblock %} | 9 | {% block html_extra %}data-qa-id="generic_device_addition"{% endblock %} |
80 | 10 | 10 | ||
81 | 11 | {% block extra_header %} | ||
82 | 12 | <style type="text/css"> | ||
83 | 13 | p span.key | ||
84 | 14 | { | ||
85 | 15 | font-family: monospace; | ||
86 | 16 | font-size: large; | ||
87 | 17 | } | ||
88 | 18 | </style> | ||
89 | 19 | {% endblock %} | ||
90 | 20 | |||
91 | 21 | |||
92 | 22 | {% block title %} | 11 | {% block title %} |
93 | 23 | {% blocktrans %}{{ user }}'s devices{% endblocktrans %} | 12 | {% blocktrans %}{{ user }}'s devices{% endblocktrans %} |
94 | 24 | {% endblock %} | 13 | {% endblock %} |
95 | 25 | 14 | ||
96 | 26 | 15 | ||
97 | 27 | {% block text_title %} | 16 | {% block text_title %} |
99 | 28 | <h1 class="main">{% trans "Add device" %}</h1> | 17 | <h1>{% trans "My account" %}</h1> |
100 | 29 | {% endblock %} | 18 | {% endblock %} |
101 | 30 | 19 | ||
102 | 31 | {% block content %} | 20 | {% block content %} |
159 | 32 | 21 | <section class="p-strip"> | |
160 | 33 | <form method="post" action=""> | 22 | <h2>{% trans "Add device" %}</h2> |
161 | 34 | {% csrf_token %} | 23 | <form method="post" action=""> |
162 | 35 | 24 | {% csrf_token %} | |
163 | 36 | <p><label> | 25 | <div class="row"> |
164 | 37 | {% trans "Name:" %}<br> | 26 | <div class="p-form-validation is-error col-4"> |
165 | 38 | {{ form.name }} | 27 | <label for="id_name">{% trans "Name" %}</label> |
166 | 39 | {% if form.name.errors %} | 28 | {{ form.name }} |
167 | 40 | <span class="error" id="name-error">{{ form.name.errors|first }}</span> | 29 | {% if form.name.errors %} |
168 | 41 | {% endif %} | 30 | <p class="p-form-validation__message"> |
169 | 42 | </label></p> | 31 | <strong>Error:</strong> {{ form.name.errors|first }} |
170 | 43 | 32 | </p> | |
171 | 44 | 33 | {% endif %} | |
172 | 45 | {% block device_instructions %} | 34 | </div> |
173 | 46 | <p> | 35 | </div> |
174 | 47 | {% trans "Shared OATH HOTP/TOTP key:" %}<br> | 36 | {% block device_instructions %} |
175 | 48 | <span class="key"> | 37 | <p> |
176 | 49 | {{ formatted_key }} | 38 | {% trans "Shared OATH HOTP/TOTP key:" %}<br> |
177 | 50 | </span> | 39 | <code> |
178 | 51 | </p> | 40 | {{ formatted_key }} |
179 | 52 | <p>{% blocktrans %}Enter the shared OATH HOTP/TOTP key into your device. | 41 | </code> |
180 | 53 | You can use both Time and Counter based methods. The system will recognize | 42 | </p> |
181 | 54 | the one you've used that will be preserved for future authentications.</p> | 43 | <p> |
182 | 55 | {% endblocktrans %} | 44 | {% blocktrans %}Enter the shared OATH HOTP/TOTP key into your device. |
183 | 56 | {% endblock %} | 45 | You can use both Time and Counter based methods. The system will recognize |
184 | 57 | 46 | the one you've used that will be preserved for future authentications.{% endblocktrans %} | |
185 | 58 | <br/> | 47 | </p> |
186 | 59 | <p>{% blocktrans %} | 48 | {% endblock %} |
187 | 60 | Now, verify your device is configured correctly. Use your device | 49 | |
188 | 61 | <em>once</em> to generate a one-time password and enter it below. | 50 | <p>{% blocktrans %} |
189 | 62 | {% endblocktrans %}</p> | 51 | Now, verify your device is configured correctly. Use your device |
190 | 63 | 52 | <em>once</em> to generate a one-time password and enter it below. | |
191 | 64 | <p><label> | 53 | {% endblocktrans %}</p> |
192 | 65 | {% trans "One-time password:" %}<br> | 54 | <div class="row"> |
193 | 66 | {{ form.otp }} | 55 | <div class="p-form-validation is-error col-4"> |
194 | 67 | {% if form.otp.errors %} | 56 | <label for="id_otp">{% trans "One-time password:" %}</label> |
195 | 68 | <span class="error" id="otp-error">{{ form.otp.errors|first }}</span> | 57 | {{ form.otp }} |
196 | 69 | {% else %} | 58 | {% if form.otp.errors %} |
197 | 70 | {% if error %} | 59 | <p class="p-form-validation__message"> |
198 | 71 | <span class="error">{{ error }}</span> | 60 | <strong>Error:</strong> {{ form.otp.errors|first }} |
199 | 72 | {% endif %} | 61 | </p> |
200 | 73 | {% endif %} | 62 | {% else %} |
201 | 74 | </label></p> | 63 | {% if error %} |
202 | 75 | 64 | <p class="p-form-validation__message"> | |
203 | 76 | <p> | 65 | <strong>Error:</strong> {{ error }} |
204 | 77 | <input type="hidden" name="type" value="{{ type }}"> | 66 | </p> |
205 | 78 | <input type="hidden" name="hex_key" value="{{ hex_key }}"> | 67 | {% endif %} |
206 | 79 | <button class="btn" type="submit" data-qa-id="confirm_add_device"> | 68 | {% endif %} |
207 | 80 | <span><span>{% trans "Add device" %}</span></span> | 69 | </div> |
208 | 81 | </button> | 70 | </div> |
209 | 82 | {% trans "or" %} | 71 | <input type="hidden" name="type" value="{{ type }}"> |
210 | 83 | <a data-qa-id="cancel_add_device" href="{{ device_list_path }}">{% trans "cancel" %}</a> | 72 | <input type="hidden" name="hex_key" value="{{ hex_key }}"> |
211 | 84 | </p> | 73 | <button class="p-button--primary" type="submit" data-qa-id="confirm_add_device">{% trans "Add device" %}</button> |
212 | 85 | 74 | <a data-qa-id="cancel_add_device" href="{{ device_list_path }}" class="p-button--neutral">{% trans "cancel" %}</a> | |
213 | 86 | </form> | 75 | </form> |
214 | 87 | 76 | </section> | |
215 | 88 | {% endblock %} | 77 | {% endblock %} |
216 | 89 | 78 | ||
217 | === modified file 'src/webui/templates/device/addition-google.html' | |||
218 | --- src/webui/templates/device/addition-google.html 2016-12-07 11:32:39 +0000 | |||
219 | +++ src/webui/templates/device/addition-google.html 2019-08-19 08:29:07 +0000 | |||
220 | @@ -5,49 +5,50 @@ | |||
221 | 5 | 5 | ||
222 | 6 | {% load qrcode %} | 6 | {% load qrcode %} |
223 | 7 | {% block device_instructions %} | 7 | {% block device_instructions %} |
248 | 8 | <p>{% blocktrans %}To use your smartphone as an authentication device, please | 8 | <p>{% blocktrans %}To use your smartphone as an authentication device, please |
249 | 9 | install "Google Authenticator" on it. Go to | 9 | install "Google Authenticator" on it. Go to |
250 | 10 | <a href="http://m.google.com/authenticator">http://m.google.com/authenticator</a> | 10 | <a href="http://m.google.com/authenticator">http://m.google.com/authenticator</a> |
251 | 11 | in your phone's browser or search for "Google Authenticator" on your phone's app | 11 | in your phone's browser or search for "Google Authenticator" on your phone's app |
252 | 12 | store/market.{% endblocktrans %}</p> | 12 | store/market.{% endblocktrans %}</p> |
253 | 13 | 13 | ||
254 | 14 | <p><strong> | 14 | <p> |
255 | 15 | {% trans "Note: If you flash your phone, you will lose your auth data!" %} | 15 | <strong>{% trans "Note: If you flash your phone, you will lose your auth data!" %}</strong> |
256 | 16 | </strong> | 16 | {% trans "Be sure you have a backup auth device before flashing your phone." %} |
257 | 17 | {% trans "Be sure you have a backup auth device before flashing your phone." %} | 17 | </p> |
258 | 18 | </b> | 18 | |
259 | 19 | 19 | <p>{% trans 'In the "Google Authenticator" app, add a new token and scan this barcode.' %}</p> | |
260 | 20 | <p>{% trans 'In the "Google Authenticator" app, add a new token and scan this barcode.' %}</p> | 20 | <img width="250" height="250" class="qrcode" id="id_qrcode" /> |
261 | 21 | <img width="250" height="250" class="qrcode" id="id_qrcode" /> | 21 | <p>{% trans "Or, to set up manually, please enter:" %}</p> |
262 | 22 | <p>{% trans "Or, to set up manually, please enter:" %}</p> | 22 | <div class="row"> |
263 | 23 | <ul> | 23 | <ul class="p-list col-4"> |
264 | 24 | <li>{% trans "Type of key" %}: | 24 | <li class="p-list__item">{% trans "Type of key" %}: |
265 | 25 | <select id="id_oath_type", onchange="setQRcodeUri()"> | 25 | <select id="id_oath_type", onchange="setQRcodeUri()"> |
266 | 26 | {% for mode, description in oath_modes.items %} | 26 | {% for mode, description in oath_modes.items %} |
267 | 27 | <option value="{{mode}}">{{description}}</option> | 27 | <option value="{{mode}}">{{description}}</option> |
268 | 28 | {% endfor %} | 28 | {% endfor %} |
269 | 29 | </select> | 29 | </select> |
270 | 30 | 30 | ||
271 | 31 | {% block extra_js %} | 31 | {% block extra_js %} |
272 | 32 | <script id="id_qrcode_script"> | 32 | <script id="id_qrcode_script"> |
276 | 33 | function setQRcodeUri() { | 33 | function setQRcodeUri() { |
277 | 34 | var QRCODE_URIS = { | 34 | var QRCODE_URIS = { |
278 | 35 | {% for mode in oath_modes %} | 35 | {% for mode in oath_modes %} |
279 | 36 | {{mode}}: "{% qrcode_url mode ident hex_key %}", | 36 | {{mode}}: "{% qrcode_url mode ident hex_key %}", |
290 | 37 | {% endfor %} | 37 | {% endfor %} |
291 | 38 | }; | 38 | }; |
292 | 39 | 39 | ||
293 | 40 | var qrcodeImg = document.getElementById('id_qrcode'); | 40 | var qrcodeImg = document.getElementById('id_qrcode'); |
294 | 41 | var oathSelector = document.getElementById('id_oath_type'); | 41 | var oathSelector = document.getElementById('id_oath_type'); |
295 | 42 | var oathType = oathSelector.options[oathSelector.selectedIndex].value; | 42 | var oathType = oathSelector.options[oathSelector.selectedIndex].value; |
296 | 43 | qrcodeImg.src = QRCODE_URIS[oathType]; | 43 | qrcodeImg.src = QRCODE_URIS[oathType]; |
297 | 44 | } | 44 | } |
298 | 45 | 45 | ||
299 | 46 | setQRcodeUri(); | 46 | setQRcodeUri(); |
300 | 47 | </script> | 47 | </script> |
305 | 48 | {% endblock %} | 48 | {% endblock %} |
306 | 49 | </li> | 49 | </li> |
307 | 50 | <li>{% trans "Account" %}: {{ ident }}</li> | 50 | <li class="p-list__item">{% trans "Account" %}: <code>{{ ident }}</code></li> |
308 | 51 | <li>{% trans "Key" %}: {{ hex_key|b32encode_hexstring }}</li> | 51 | <li class="p-list__item">{% trans "Key" %}: <code>{{ hex_key|b32encode_hexstring }}</code></li> |
309 | 52 | </ul> | 52 | </ul> |
310 | 53 | </div> | ||
311 | 53 | {% endblock %} | 54 | {% endblock %} |
312 | 54 | 55 | ||
313 | === modified file 'src/webui/templates/device/addition-yubi.html' | |||
314 | --- src/webui/templates/device/addition-yubi.html 2015-06-29 18:11:04 +0000 | |||
315 | +++ src/webui/templates/device/addition-yubi.html 2019-08-19 08:29:07 +0000 | |||
316 | @@ -7,17 +7,15 @@ | |||
317 | 7 | {% block device_instructions %} | 7 | {% block device_instructions %} |
318 | 8 | <p> | 8 | <p> |
319 | 9 | {% trans "Shared OATH/HOTP key:" %}<br> | 9 | {% trans "Shared OATH/HOTP key:" %}<br> |
331 | 10 | <span class="key" id="formatted_key"> | 10 | <code id="formatted_key">{{ formatted_key }}</code> |
332 | 11 | {{ formatted_key }} | 11 | </p> |
333 | 12 | </span> | 12 | <p> |
334 | 13 | </p> | 13 | {% blocktrans %}Programming a YubiKey requires you to{% endblocktrans %} |
335 | 14 | <p> | 14 | <a href="apt:yubikey-personalization">{% trans "install" %} yubikey-personalization</a>. |
336 | 15 | {% blocktrans %}Programming a YubiKey requires you to{% endblocktrans %} | 15 | </p> |
337 | 16 | <a href="apt:yubikey-personalization">{% trans "install" %} yubikey-personalization</a>. | 16 | <p> |
338 | 17 | </p> | 17 | {% blocktrans %}To program the YubiKey as an authentication device, on |
339 | 18 | <p> | 18 | the short press of the YubiKey, execute the following command line:{% endblocktrans %} |
329 | 19 | {% blocktrans %}To program the YubiKey as an authentication device, on | ||
330 | 20 | the short press of the YubiKey, execute the following command line:{% endblocktrans %} | ||
340 | 21 | </p> | 19 | </p> |
341 | 22 | <p> | 20 | <p> |
342 | 23 | <code id="short_press"> | 21 | <code id="short_press"> |
343 | @@ -25,8 +23,8 @@ | |||
344 | 25 | </code> | 23 | </code> |
345 | 26 | </p> | 24 | </p> |
346 | 27 | <p> | 25 | <p> |
349 | 28 | {% blocktrans %}To program the long press of the YubiKey, | 26 | {% blocktrans %}To program the long press of the YubiKey, |
350 | 29 | execute the following command line:{% endblocktrans %} | 27 | execute the following command line:{% endblocktrans %} |
351 | 30 | </p> | 28 | </p> |
352 | 31 | <p> | 29 | <p> |
353 | 32 | <code id="long_press"> | 30 | <code id="long_press"> |
354 | 33 | 31 | ||
355 | === modified file 'src/webui/templates/device/code-list.html' | |||
356 | --- src/webui/templates/device/code-list.html 2016-06-21 15:39:25 +0000 | |||
357 | +++ src/webui/templates/device/code-list.html 2019-08-19 08:29:07 +0000 | |||
358 | @@ -1,21 +1,19 @@ | |||
359 | 1 | {% load i18n %} | 1 | {% load i18n %} |
362 | 2 | <div id="codes" class="yui3-g-r codelist" data-qa-id="codelist"> | 2 | <div id="codes" data-qa-id="codelist"> |
363 | 3 | <ol class="yui3-u-1-5"> | 3 | <ol class="p-list"> |
364 | 4 | {% for code in codes %} | 4 | {% for code in codes %} |
366 | 5 | <li>{% spaceless %} | 5 | <li class="p-list__item">{% spaceless %} |
367 | 6 | {% if forloop.counter0 < counter|default:0 %} | 6 | {% if forloop.counter0 < counter|default:0 %} |
368 | 7 | <strike>{{ code }}</strike> | 7 | <strike>{{ code }}</strike> |
369 | 8 | {% else %} | 8 | {% else %} |
370 | 9 | {{ code }} | 9 | {{ code }} |
371 | 10 | {% endif %} | 10 | {% endif %} |
372 | 11 | {% endspaceless %}</li> | 11 | {% endspaceless %}</li> |
373 | 12 | {% if forloop.counter|divisibleby:"5" and not forloop.last %} | ||
374 | 13 | {%endif%} | ||
375 | 14 | {% endfor %} | 12 | {% endfor %} |
376 | 15 | </ol> | 13 | </ol> |
377 | 16 | </div> | 14 | </div> |
378 | 17 | 15 | ||
379 | 18 | <style media="print"> | 16 | <style media="print"> |
381 | 19 | header, .menu, footer, p { display: none; } | 17 | header, .p-sidebar, footer, p { display: none; } |
382 | 20 | #codes ol { list-style:none; margin:0; padding:0 } | 18 | #codes ol { list-style:none; margin:0; padding:0 } |
383 | 21 | </style> | 19 | </style> |
384 | 22 | 20 | ||
385 | === modified file 'src/webui/templates/device/device-help.html' | |||
386 | --- src/webui/templates/device/device-help.html 2016-08-16 08:26:48 +0000 | |||
387 | +++ src/webui/templates/device/device-help.html 2019-08-19 08:29:07 +0000 | |||
388 | @@ -1,4 +1,4 @@ | |||
390 | 1 | {% extends "base.html" %} | 1 | {% extends "vanilla/base.html" %} |
391 | 2 | {% load i18n %} | 2 | {% load i18n %} |
392 | 3 | {% load static_url %} | 3 | {% load static_url %} |
393 | 4 | 4 | ||
394 | @@ -10,43 +10,46 @@ | |||
395 | 10 | {% block title %}{% blocktrans %}Authentication device help - Ubuntu One{% endblocktrans %}{% endblock %} | 10 | {% block title %}{% blocktrans %}Authentication device help - Ubuntu One{% endblocktrans %}{% endblock %} |
396 | 11 | 11 | ||
397 | 12 | {% block text_title %} | 12 | {% block text_title %} |
399 | 13 | <h1 class="main">{% trans "Authentication device help" %}</h1> | 13 | <h1>{% trans "My account" %}</h1> |
400 | 14 | {% endblock %} | 14 | {% endblock %} |
401 | 15 | 15 | ||
402 | 16 | {% block content %} | 16 | {% block content %} |
438 | 17 | <p> | 17 | <section class="p-strip"> |
439 | 18 | {% blocktrans with "twofactor_faq"|static_url as 2FFAQ %} | 18 | <h3>{% trans "Authentication device help" %}</h3> |
440 | 19 | If your device is lost or stolen or you are having trouble logging in, | 19 | <p> |
441 | 20 | please review the | 20 | {% blocktrans with "twofactor_faq"|static_url as 2FFAQ %} |
442 | 21 | <a href="{{2FFAQ}}#Help">2-Factor Auth FAQ</a> | 21 | If your device is lost or stolen or you are having trouble logging in, |
443 | 22 | for details on how to get help and the type of information you will need | 22 | please review the |
444 | 23 | to provide. | 23 | <a href="{{2FFAQ}}#Help">2-Factor Auth FAQ</a> |
445 | 24 | {% endblocktrans %} | 24 | for details on how to get help and the type of information you will need |
446 | 25 | </p> | 25 | to provide. |
447 | 26 | 26 | {% endblocktrans %} | |
448 | 27 | <h2>{% trans "Device lost or stolen?" %}</h2> | 27 | </p> |
449 | 28 | <p> | 28 | |
450 | 29 | {% blocktrans %}We need to remove the device from your account to prevent | 29 | <h3>{% trans "Device lost or stolen?" %}</h3> |
451 | 30 | someone using it to gain access to your account. Please contact us | 30 | <p> |
452 | 31 | immediately to resolve this! You can reach ISD in the #isd channel on | 31 | {% blocktrans %}We need to remove the device from your account to prevent |
453 | 32 | IRC, or IS in the #webops channel, or phone the IS emergency helpline. | 32 | someone using it to gain access to your account. Please contact us |
454 | 33 | {% endblocktrans %} | 33 | immediately to resolve this! You can reach ISD in the #isd channel on |
455 | 34 | </p> | 34 | IRC, or IS in the #webops channel, or phone the IS emergency helpline. |
456 | 35 | 35 | {% endblocktrans %} | |
457 | 36 | <h2>{% trans "Problems logging in?" %}</h2> | 36 | </p> |
458 | 37 | <p> | 37 | |
459 | 38 | {% blocktrans with "twofactor_faq"|static_url as 2FFAQ %} | 38 | <h3>{% trans "Problems logging in?" %}</h3> |
460 | 39 | We can help get a device working again or set you up with some temporary | 39 | <p> |
461 | 40 | tokens to enable you to continue with your work. If it's not urgent, | 40 | {% blocktrans with "twofactor_faq"|static_url as 2FFAQ %} |
462 | 41 | please send email to the ISD Support address as described in the | 41 | We can help get a device working again or set you up with some temporary |
463 | 42 | <a href="{{2FFAQ}}#Help">2-Factor Auth FAQ</a> | 42 | tokens to enable you to continue with your work. If it's not urgent, |
464 | 43 | and someone will get back to you soon. | 43 | please send email to the ISD Support address as described in the |
465 | 44 | {% endblocktrans %} | 44 | <a href="{{2FFAQ}}#Help">2-Factor Auth FAQ</a> |
466 | 45 | </p> | 45 | and someone will get back to you soon. |
467 | 46 | {% if support_phone %} | 46 | {% endblocktrans %} |
468 | 47 | <p> | 47 | </p> |
469 | 48 | {% blocktrans %}If it is urgent, please phone the IS emergency helpline at | 48 | {% if support_phone %} |
470 | 49 | <span id="support-phone">{{ support_phone }}</span>.{% endblocktrans %} | 49 | <p> |
471 | 50 | </p> | 50 | {% blocktrans %}If it is urgent, please phone the IS emergency helpline at |
472 | 51 | {% endif %} | 51 | <span id="support-phone">{{ support_phone }}</span>.{% endblocktrans %} |
473 | 52 | </p> | ||
474 | 53 | {% endif %} | ||
475 | 54 | </section> | ||
476 | 52 | {% endblock %} | 55 | {% endblock %} |
477 | 53 | 56 | ||
478 | === modified file 'src/webui/templates/device/list.html' | |||
479 | --- src/webui/templates/device/list.html 2016-07-06 02:49:14 +0000 | |||
480 | +++ src/webui/templates/device/list.html 2019-08-19 08:29:07 +0000 | |||
481 | @@ -1,80 +1,63 @@ | |||
483 | 1 | {% extends "base.html" %} | 1 | {% extends "vanilla/base.html" %} |
484 | 2 | {% load i18n %} | 2 | {% load i18n %} |
485 | 3 | {% load static_url %} | 3 | {% load static_url %} |
486 | 4 | 4 | ||
487 | 5 | {% comment %} | 5 | {% comment %} |
489 | 6 | Copyright 2012 Canonical Ltd. This software is licensed under the GNU | 6 | Copyright 2012-2019 Canonical Ltd. This software is licensed under the GNU |
490 | 7 | Affero General Public License version 3 (see the file LICENSE). | 7 | Affero General Public License version 3 (see the file LICENSE). |
491 | 8 | {% endcomment %} | 8 | {% endcomment %} |
492 | 9 | 9 | ||
493 | 10 | {% block html_extra %}data-qa-id="device_list"{% endblock %} | 10 | {% block html_extra %}data-qa-id="device_list"{% endblock %} |
494 | 11 | 11 | ||
495 | 12 | {% block extra_header %} | ||
496 | 13 | <style type="text/css"> | ||
497 | 14 | table#device-list td.command | ||
498 | 15 | { | ||
499 | 16 | width: 0; | ||
500 | 17 | } | ||
501 | 18 | </style> | ||
502 | 19 | {% endblock %} | ||
503 | 20 | |||
504 | 21 | |||
505 | 22 | {% block title %} | 12 | {% block title %} |
506 | 23 | {% blocktrans %}{{ user }}'s devices{% endblocktrans %} | 13 | {% blocktrans %}{{ user }}'s devices{% endblocktrans %} |
507 | 24 | {% endblock %} | 14 | {% endblock %} |
508 | 25 | 15 | ||
509 | 26 | 16 | ||
511 | 27 | {% block text_title %}<h1 class="u1-h-main">{% trans "Authentication devices" %}</h1>{% endblock %} | 17 | {% block text_title %}<h1>{% trans "My account" %}</h1>{% endblock %} |
512 | 28 | 18 | ||
513 | 29 | {% block content %} | 19 | {% block content %} |
564 | 30 | 20 | <section class="p-strip"> | |
565 | 31 | {% include "common/missing_backup_device_warning.html" %} | 21 | {% include "vanilla/common/missing_backup_device_warning.html" %} |
566 | 32 | {% include "common/printed_codes_nearly_exhausted_warning.html" %} | 22 | {% include "vanilla/common/printed_codes_nearly_exhausted_warning.html" %} |
567 | 33 | 23 | <div id="auth-devices"> | |
568 | 34 | <div id="auth-devices"> | 24 | <h2>{% trans "Authentication devices" %}</h2> |
569 | 35 | {% if devices %} | 25 | {% if devices %} |
570 | 36 | 26 | <h3 class="p-heading--four">{% trans "Authentication devices you've added" %}</h3> | |
571 | 37 | <section class="devices-you-added"> | 27 | <div class="p-strip is-shallow"> |
572 | 38 | 28 | <table id="device-list" data-qa-id="device_list" class="p-table--bordered"> | |
573 | 39 | <h3>{% trans "Authentication devices you've added" %}</h3> | 29 | <tbody> |
574 | 40 | 30 | {% for device in devices %} | |
575 | 41 | <table id="device-list" data-qa-id="device_list"> | 31 | <tr> |
576 | 42 | <tbody> | 32 | <td class="name" data-qa-id="device_name">{{ device.name }}</td> |
577 | 43 | {% for device in devices %} | 33 | <td class="u-align-text--right"> |
578 | 44 | <tr> | 34 | <ul class="p-inline-list u-no-margin--bottom"> |
579 | 45 | <td class="name" data-qa-id="device_name">{{ device.name }}</td> | 35 | <li class="p-inline-list__item"><a href="{% url 'device-rename' device.id %}" data-qa-id="rename_device">{% trans "Rename" %}</a></li> |
580 | 46 | <td class="actions"> | 36 | <li class="p-inline-list__item"><a href="{% url 'device-removal' device.id %}" data-qa-id="delete_device">{% trans "Delete" %}</a></li> |
581 | 47 | <a class="btn-sm" href="{% url 'device-rename' device.id %}" data-qa-id="rename_device"> | 37 | {% if device.device_type == 'paper' %} |
582 | 48 | <span>{% trans "Rename" %}</span> | 38 | <li class="p-inline-list__item"><a href="{% url 'device-print' device.id %}" data-qa-id="print_device">{% trans "View Codes" %}</a></li> |
583 | 49 | </a> | 39 | {% endif %} |
584 | 50 | <a class="btn-sm" href="{% url 'device-removal' device.id %}" data-qa-id="delete_device"> | 40 | </ul> |
585 | 51 | <span>{% trans "Delete" %}</span> | 41 | </td> |
586 | 52 | </a> | 42 | </tr> |
587 | 53 | {% if device.device_type == 'paper' %} | 43 | {% endfor %} |
588 | 54 | <a class="btn-sm" href="{% url 'device-print' device.id %}" data-qa-id="print_device"> | 44 | </tbody> |
589 | 55 | <span>{% trans "View Codes" %}</span> | 45 | </table> |
590 | 56 | </a> | 46 | </div> |
591 | 57 | {% endif %} | 47 | |
592 | 58 | </td> | 48 | {% else %} |
593 | 59 | </tr> | 49 | <p>{% trans "You don't have any authentication devices associated with this account." %}</p> |
594 | 60 | {% endfor %} | 50 | {% endif %} |
595 | 61 | </tbody> | 51 | |
596 | 62 | </table> | 52 | <p><a data-qa-id="add_new_device" href="{{ device_addition_path }}"> |
597 | 63 | </section> | 53 | {% trans "Add a new authentication device" %} |
598 | 64 | 54 | </a></p> | |
599 | 65 | {% else %} | 55 | |
600 | 66 | <p>{% trans "You don't have any authentication devices associated with this account." %}</p> | 56 | <p><a href="{% url 'device-help' %}">{% trans "Report a lost or stolen device" %}</a></p> |
601 | 67 | {% endif %} | 57 | |
602 | 68 | 58 | <p>{% blocktrans with "twofactor_faq"|static_url as 2FFAQ %} | |
603 | 69 | <p><a data-qa-id="add_new_device" href="{{ device_addition_path }}"> | 59 | <a href="{{ 2FFAQ }}">2-Factor Auth FAQ</a> |
604 | 70 | {% trans "Add a new authentication device" %} | 60 | {% endblocktrans %}</p> |
605 | 71 | </a></p> | 61 | </div> |
606 | 72 | 62 | </section> | |
557 | 73 | <p><a href="{% url 'device-help' %}">{% trans "Report a lost or stolen device" %}</a></p> | ||
558 | 74 | |||
559 | 75 | <p>{% blocktrans with "twofactor_faq"|static_url as 2FFAQ %} | ||
560 | 76 | <a href="{{ 2FFAQ }}">2-Factor Auth FAQ</a> | ||
561 | 77 | {% endblocktrans %}</p> | ||
562 | 78 | </div> | ||
563 | 79 | |||
607 | 80 | {% endblock %} | 63 | {% endblock %} |
608 | 81 | 64 | ||
609 | === modified file 'src/webui/templates/device/print-codes.html' | |||
610 | --- src/webui/templates/device/print-codes.html 2017-04-19 15:36:34 +0000 | |||
611 | +++ src/webui/templates/device/print-codes.html 2019-08-19 08:29:07 +0000 | |||
612 | @@ -1,4 +1,4 @@ | |||
614 | 1 | {% extends "base.html" %} | 1 | {% extends "vanilla/base.html" %} |
615 | 2 | {% load i18n url_with_token %} | 2 | {% load i18n url_with_token %} |
616 | 3 | 3 | ||
617 | 4 | {% comment %} | 4 | {% comment %} |
618 | @@ -13,32 +13,19 @@ | |||
619 | 13 | {% endblock %} | 13 | {% endblock %} |
620 | 14 | 14 | ||
621 | 15 | 15 | ||
623 | 16 | {% block text_title %}<h1 class="u1-h-main">{% trans "Printable backup codes" %}</h1>{% endblock %} | 16 | {% block text_title %}<h1>{% trans "My account" %}</h1>{% endblock %} |
624 | 17 | 17 | ||
625 | 18 | {% block content %} | 18 | {% block content %} |
640 | 19 | 19 | <h2>{% trans "Printable backup codes" %}</h2> | |
641 | 20 | <p>{% trans "Print this list of backup codes and keep them safe." %}</p> | 20 | <p>{% trans "Print this list of backup codes and keep them safe." %}</p> |
642 | 21 | 21 | {% include 'device/code-list.html' %} | |
643 | 22 | <p class="print-new-codes"> | 22 | <button class="p-button--positive" id="printbtn" onclick="window.print()" data-qa-id="print_codes">{% trans "Print Codes" %}</button> |
630 | 23 | |||
631 | 24 | </p> | ||
632 | 25 | |||
633 | 26 | |||
634 | 27 | {% include 'device/code-list.html' %} | ||
635 | 28 | |||
636 | 29 | <p> | ||
637 | 30 | <button class="btn cta" id="printbtn" onclick="window.print()" data-qa-id="print_codes"> | ||
638 | 31 | <span>{% trans "Print Codes" %}</span> | ||
639 | 32 | </button> | ||
644 | 33 | {% if token and not needs_renewal %} | 23 | {% if token and not needs_renewal %} |
646 | 34 | <a class="cta secondary" href="{% url_with_token 'server-decide' %}" data-qa-id="continue_to_rp">{% trans "Continue" %}</a> | 24 | <a class="p-button--neutral" href="{% url_with_token 'server-decide' %}" data-qa-id="continue_to_rp">{% trans "Continue" %}</a> |
647 | 35 | {% else %} | 25 | {% else %} |
649 | 36 | <a class="cta secondary" href="{% url 'device-list' %}" data-qa-id="cancel_print_codes">{% trans "Go back" %}</a> | 26 | <a class="p-button--neutral" href="{% url 'device-list' %}" data-qa-id="cancel_print_codes">{% trans "Go back" %}</a> |
650 | 37 | {% endif %} | 27 | {% endif %} |
651 | 38 | {% if generation_enabled %} | 28 | {% if generation_enabled %} |
655 | 39 | <a class="btn cta secondary print-new-codes" href="{% url_with_token 'device-generate' device_id=device_id %}" data-qa-id="generate_codes"> | 29 | <a class="p-button--base" href="{% url_with_token 'device-generate' device_id=device_id %}" data-qa-id="generate_codes">{% trans "Generate new codes" %}</a> |
653 | 40 | <span>{% trans "Generate new codes" %}</span> | ||
654 | 41 | </a> | ||
656 | 42 | {% endif %} | 30 | {% endif %} |
657 | 43 | </p> | ||
658 | 44 | {% endblock %} | 31 | {% endblock %} |
659 | 45 | 32 | ||
660 | === modified file 'src/webui/templates/device/removal.html' | |||
661 | --- src/webui/templates/device/removal.html 2014-12-09 21:41:56 +0000 | |||
662 | +++ src/webui/templates/device/removal.html 2019-08-19 08:29:07 +0000 | |||
663 | @@ -1,8 +1,8 @@ | |||
665 | 1 | {% extends "base.html" %} | 1 | {% extends "vanilla/base.html" %} |
666 | 2 | {% load i18n %} | 2 | {% load i18n %} |
667 | 3 | 3 | ||
668 | 4 | {% comment %} | 4 | {% comment %} |
670 | 5 | Copyright 2012 Canonical Ltd. This software is licensed under the GNU | 5 | Copyright 2012-2019 Canonical Ltd. This software is licensed under the GNU |
671 | 6 | Affero General Public License version 3 (see the file LICENSE). | 6 | Affero General Public License version 3 (see the file LICENSE). |
672 | 7 | {% endcomment %} | 7 | {% endcomment %} |
673 | 8 | 8 | ||
674 | @@ -13,23 +13,20 @@ | |||
675 | 13 | {% endblock %} | 13 | {% endblock %} |
676 | 14 | 14 | ||
677 | 15 | 15 | ||
679 | 16 | {% block text_title %}<h1 class="u1-h-main">{% trans "Delete device?" %}</h1>{% endblock %} | 16 | {% block text_title %}<h1>{% trans "My account" %}</h1>{% endblock %} |
680 | 17 | 17 | ||
681 | 18 | {% block content %} | 18 | {% block content %} |
698 | 19 | 19 | <section class="p-strip"> | |
699 | 20 | <p>{% blocktrans %}Are you sure that you want to delete the following | 20 | <h2>{% trans "Delete device?" %}</h2> |
700 | 21 | authentication device?{% endblocktrans %}</p> | 21 | <p>{% blocktrans %}Are you sure that you want to delete the following |
701 | 22 | 22 | authentication device?{% endblocktrans %}</p> | |
702 | 23 | <p class="device-name" data-qa-id="device_removal_device_name">{{ name }}</p> | 23 | |
703 | 24 | 24 | <p class="device-name" data-qa-id="device_removal_device_name">{{ name }}</p> | |
704 | 25 | <form method="post" action=""> | 25 | |
705 | 26 | {% csrf_token %} | 26 | <form method="post" action=""> |
706 | 27 | <p> | 27 | {% csrf_token %} |
707 | 28 | <button class="btn cta" type="submit" data-qa-id="delete_this_device"> | 28 | <button class="p-button--negative" type="submit" data-qa-id="delete_this_device">{% trans "Delete this device" %}</button> |
708 | 29 | <span>{% trans "Delete this device" %}</span> | 29 | <a class="p-button--neutral" data-qa-id="cancel_deleting_this_device" href="{{ device_list_path }}">{% trans "Cancel" %}</a> |
709 | 30 | </button> | 30 | </form> |
710 | 31 | <a class="cta secondary" data-qa-id="cancel_deleting_this_device" href="{{ device_list_path }}">{% trans "Cancel" %}</a> | 31 | </section> |
695 | 32 | </p> | ||
696 | 33 | </form> | ||
697 | 34 | |||
711 | 35 | {% endblock %} | 32 | {% endblock %} |
712 | 36 | 33 | ||
713 | === modified file 'src/webui/templates/device/rename.html' | |||
714 | --- src/webui/templates/device/rename.html 2014-12-09 21:41:56 +0000 | |||
715 | +++ src/webui/templates/device/rename.html 2019-08-19 08:29:07 +0000 | |||
716 | @@ -1,8 +1,8 @@ | |||
718 | 1 | {% extends "base.html" %} | 1 | {% extends "vanilla/base.html" %} |
719 | 2 | {% load i18n %} | 2 | {% load i18n %} |
720 | 3 | 3 | ||
721 | 4 | {% comment %} | 4 | {% comment %} |
723 | 5 | Copyright 2012 Canonical Ltd. This software is licensed under the GNU | 5 | Copyright 2012-2019 Canonical Ltd. This software is licensed under the GNU |
724 | 6 | Affero General Public License version 3 (see the file LICENSE). | 6 | Affero General Public License version 3 (see the file LICENSE). |
725 | 7 | {% endcomment %} | 7 | {% endcomment %} |
726 | 8 | 8 | ||
727 | @@ -13,28 +13,26 @@ | |||
728 | 13 | {% endblock %} | 13 | {% endblock %} |
729 | 14 | 14 | ||
730 | 15 | 15 | ||
732 | 16 | {% block text_title %}<h1 class="u1-h-main">{% trans "Rename device" %}</h1>{% endblock %} | 16 | {% block text_title %}<h1 class="u1-h-main">{% trans "My account" %}</h1>{% endblock %} |
733 | 17 | 17 | ||
734 | 18 | {% block content %} | 18 | {% block content %} |
756 | 19 | 19 | <section class="p-strip"> | |
757 | 20 | <form method="post" action=""> | 20 | <h2>{% trans "Rename device" %}</h2> |
758 | 21 | {% csrf_token %} | 21 | <form method="post" action=""> |
759 | 22 | 22 | {% csrf_token %} | |
760 | 23 | <p><label for="id_name"> | 23 | <div class="row"> |
761 | 24 | {% trans "Name:" %} | 24 | <div class="p-form-validation is-error col-4"> |
762 | 25 | {{ form.name }} | 25 | <label for="id_name">Name</label> |
763 | 26 | {% if form.name.errors %} | 26 | {{ form.name }} |
764 | 27 | <span class="error" id="name-error">{{ form.name.errors|first }}</span> | 27 | {% if form.name.errors %} |
765 | 28 | {% endif %} | 28 | <p class="p-form-validation__message"> |
766 | 29 | </label></p> | 29 | <strong>Error:</strong> {{ form.name.errors|first }} |
767 | 30 | 30 | </p> | |
768 | 31 | <p> | 31 | {% endif %} |
769 | 32 | <button class="btn cta" type="submit" data-qa-id="rename_this_device"> | 32 | </div> |
770 | 33 | <span>{% trans "Rename" %}</span> | 33 | </div> |
771 | 34 | </button> | 34 | <button class="p-button--positive" type="submit" data-qa-id="rename_this_device">{% trans "Rename" %}</button> |
772 | 35 | <a class="cta secondary" href="{{ device_list_path }}" data-qa-id="cancel_renaming_this_device">{% trans "Cancel" %}</a> | 35 | <a class="p-button--neutral" href="{{ device_list_path }}" data-qa-id="cancel_renaming_this_device">{% trans "Cancel" %}</a> |
773 | 36 | </p> | 36 | </form> |
774 | 37 | 37 | </section> | |
754 | 38 | </form> | ||
755 | 39 | |||
775 | 40 | {% endblock %} | 38 | {% endblock %} |
776 | 41 | 39 | ||
777 | === modified file 'src/webui/templates/device/types.html' | |||
778 | --- src/webui/templates/device/types.html 2016-12-06 16:53:22 +0000 | |||
779 | +++ src/webui/templates/device/types.html 2019-08-19 08:29:07 +0000 | |||
780 | @@ -1,75 +1,86 @@ | |||
782 | 1 | {% extends "base.html" %} | 1 | {% extends "vanilla/base.html" %} |
783 | 2 | {% load i18n %} | 2 | {% load i18n %} |
784 | 3 | {% load static_url %} | 3 | {% load static_url %} |
785 | 4 | {% load gargoyle_tags %} | 4 | {% load gargoyle_tags %} |
786 | 5 | 5 | ||
787 | 6 | {% comment %} | 6 | {% comment %} |
789 | 7 | Copyright 2012 Canonical Ltd. This software is licensed under the GNU | 7 | Copyright 2012-2019 Canonical Ltd. This software is licensed under the GNU |
790 | 8 | Affero General Public License version 3 (see the file LICENSE). | 8 | Affero General Public License version 3 (see the file LICENSE). |
791 | 9 | {% endcomment %} | 9 | {% endcomment %} |
792 | 10 | 10 | ||
793 | 11 | {% block html_extra %}data-qa-id="device_addition"{% endblock %} | 11 | {% block html_extra %}data-qa-id="device_addition"{% endblock %} |
794 | 12 | 12 | ||
795 | 13 | {% block title %} | 13 | {% block title %} |
797 | 14 | {% blocktrans %}{{ user }}'s devices{% endblocktrans %} | 14 | {% trans "Add a new authentication device" %} |
798 | 15 | {% endblock %} | 15 | {% endblock %} |
799 | 16 | 16 | ||
800 | 17 | 17 | ||
802 | 18 | {% block text_title %}<h1 class="u1-h-main">{% trans "Add a new authentication device" %}</h1>{% endblock %} | 18 | {% block text_title %}<h1>{% trans "My account" %}</h1>{% endblock %} |
803 | 19 | 19 | ||
804 | 20 | {% block content %} | 20 | {% block content %} |
859 | 21 | 21 | <section class="p-strip"> | |
860 | 22 | <form method="post" action=""> | 22 | <h2>{% trans "Add a new authentication device" %}</h2> |
861 | 23 | {% csrf_token %} | 23 | <form method="post" action=""> |
862 | 24 | 24 | {% csrf_token %} | |
863 | 25 | <dl class="device-types"> | 25 | |
864 | 26 | 26 | <ul class="p-list"> | |
865 | 27 | <dt><label> | 27 | <li class="p-list__item"> |
866 | 28 | <input type="radio" name="type" value="google" id="type_google" checked="checked"> {% trans "Smartphone or Tablet" %} | 28 | <div class="row"> |
867 | 29 | </label></dt> | 29 | <div class="col-3"> |
868 | 30 | <dd> | 30 | <input type="radio" name="type" value="google" id="type_google" checked="checked"> |
869 | 31 | <p><label for="type_google">{% blocktrans %}Android, Apple, or Blackberry mobile device with the Google Authenticator app; | 31 | <label for="type_google">{% trans "Smartphone or Tablet" %}</label> |
870 | 32 | or Windows phone with the Auth7 app{% endblocktrans %}</label></p> | 32 | </div> |
871 | 33 | </dd> | 33 | <div class="col-5"> |
872 | 34 | 34 | <p>{% blocktrans %}Android, Apple, or Blackberry mobile device with the Google Authenticator app; or Windows phone with the Auth7 app{% endblocktrans %}</p> | |
873 | 35 | <dt><label> | 35 | </div> |
874 | 36 | <input type="radio" name="type" value="yubi" id="type_yubi"> {% trans "YubiKey" %} | 36 | </div> |
875 | 37 | </label></dt> | 37 | </li> |
876 | 38 | <dd> | 38 | <li class="p-list__item"> |
877 | 39 | <p><label for="type_yubi">{% blocktrans %}USB YubiKey one time password generator{% endblocktrans %}</label></p> | 39 | <div class="row"> |
878 | 40 | </dd> | 40 | <div class="col-3 col-medium-3"> |
879 | 41 | 41 | <input type="radio" name="type" value="yubi" id="type_yubi"> | |
880 | 42 | <dt><label> | 42 | <label for="type_yubi">{% trans "YubiKey" %}</label> |
881 | 43 | <input type="radio" name="type" value="generic" id="type_generic"> {% trans "Generic HOTP/TOTP device" %} | 43 | </div> |
882 | 44 | </label></dt> | 44 | <div class="col-5 col-medium-3"> |
883 | 45 | <dd> | 45 | <p>{% blocktrans %}USB YubiKey one time password generator{% endblocktrans %}</p> |
884 | 46 | <p><label for="type_generic">{% blocktrans %}Any other OATH HOTP/TOTP compatible device{% endblocktrans %}</label></p> | 46 | </div> |
885 | 47 | </dd> | 47 | </div> |
886 | 48 | 48 | </li> | |
887 | 49 | <dt><label> | 49 | <li class="p-list__item"> |
888 | 50 | <input type="radio" name="type" value="paper" id="type_paper"> {% trans "Printable Backup Codes" %} | 50 | <div class="row"> |
889 | 51 | </label></dt> | 51 | <div class="col-3 col-medium-3"> |
890 | 52 | <dd> | 52 | <input type="radio" name="type" value="generic" id="type_generic"> |
891 | 53 | <p><label for="type_paper">{% blocktrans %}A list of backup codes to | 53 | <label for="type_generic">{% trans "Generic HOTP/TOTP device" %}</label> |
892 | 54 | print.{% endblocktrans %}</label></p> | 54 | </div> |
893 | 55 | </dd> | 55 | <div class="col-5 col-medium-3"> |
894 | 56 | 56 | <p>{% blocktrans %}Any other OATH HOTP/TOTP compatible device{% endblocktrans %}</p> | |
895 | 57 | </dl> | 57 | </div> |
896 | 58 | 58 | </div> | |
897 | 59 | <p> | 59 | </li> |
898 | 60 | <button class="btn cta" type="submit" data-qa-id="add_device_from_type"> | 60 | <li class="p-list__item"> |
899 | 61 | <span>{% trans "Add device" %}</span> | 61 | <div class="row"> |
900 | 62 | </button> | 62 | <div class="col-3 col-medium-3"> |
901 | 63 | <a class="cta secondary" data-qa-id="cancel_add_device_from_type" href="{{ device_list_path }}">{% trans "Cancel" %}</a> | 63 | <input type="radio" name="type" value="paper" id="type_paper"> |
902 | 64 | </p> | 64 | <label for="type_paper">{% trans "Printable Backup Codes" %}</label> |
903 | 65 | <p> | 65 | </div> |
904 | 66 | {% blocktrans with "twofactor_faq"|static_url as 2FFAQ %} | 66 | <div class="col-5 col-medium-3"> |
905 | 67 | The <a href="{{2FFAQ}}#Devices">2-Factor Auth FAQ</a> | 67 | <p>{% blocktrans %}A list of backup codes to |
906 | 68 | has details on compatible devices. | 68 | print.{% endblocktrans %}</p> |
907 | 69 | {% endblocktrans %} | 69 | </div> |
908 | 70 | </p> | 70 | </div> |
909 | 71 | 71 | </li> | |
910 | 72 | 72 | </ul> | |
911 | 73 | </form> | 73 | |
912 | 74 | 74 | <button class="p-button--positive" type="submit" data-qa-id="add_device_from_type">{% trans "Add device" %}</button> | |
913 | 75 | <a class="p-button--neutral" data-qa-id="cancel_add_device_from_type" href="{{ device_list_path }}">{% trans "Cancel" %}</a> | ||
914 | 76 | <p> | ||
915 | 77 | {% blocktrans with "twofactor_faq"|static_url as 2FFAQ %} | ||
916 | 78 | The <a href="{{2FFAQ}}#Devices">2-Factor Auth FAQ</a> | ||
917 | 79 | has details on compatible devices. | ||
918 | 80 | {% endblocktrans %} | ||
919 | 81 | </p> | ||
920 | 82 | |||
921 | 83 | |||
922 | 84 | </form> | ||
923 | 85 | </section> | ||
924 | 75 | {% endblock %} | 86 | {% endblock %} |
925 | 76 | 87 | ||
926 | === modified file 'src/webui/templates/vanilla/_footer.html' | |||
927 | --- src/webui/templates/vanilla/_footer.html 2019-08-19 08:29:07 +0000 | |||
928 | +++ src/webui/templates/vanilla/_footer.html 2019-08-19 08:29:07 +0000 | |||
929 | @@ -5,8 +5,8 @@ | |||
930 | 5 | GNU Affero General Public License version 3 (see the file LICENSE). | 5 | GNU Affero General Public License version 3 (see the file LICENSE). |
931 | 6 | {% endcomment %} | 6 | {% endcomment %} |
932 | 7 | 7 | ||
935 | 8 | <footer class="p-strip u-no-padding--top" data-qa-id="ubuntuone_footer"> | 8 | <hr> |
936 | 9 | <hr> | 9 | <footer class="p-strip is-shallow" data-qa-id="ubuntuone_footer"> |
937 | 10 | <div class="row"> | 10 | <div class="row"> |
938 | 11 | <p>{% trans "Ubuntu One. One place to log in to everything on Ubuntu." %}</p> | 11 | <p>{% trans "Ubuntu One. One place to log in to everything on Ubuntu." %}</p> |
939 | 12 | {% spaceless %} | 12 | {% spaceless %} |
940 | 13 | 13 | ||
941 | === modified file 'src/webui/templates/vanilla/base.html' | |||
942 | --- src/webui/templates/vanilla/base.html 2019-08-19 08:29:07 +0000 | |||
943 | +++ src/webui/templates/vanilla/base.html 2019-08-19 08:29:07 +0000 | |||
944 | @@ -50,34 +50,6 @@ | |||
945 | 50 | </div> | 50 | </div> |
946 | 51 | </section> | 51 | </section> |
947 | 52 | 52 | ||
948 | 53 | {% block readonly %} | ||
949 | 54 | {% if readonly %} | ||
950 | 55 | <div class="p-notification--caution"> | ||
951 | 56 | <p class="p-notification__response"> | ||
952 | 57 | {% blocktrans %}We are currently in read-only mode. That means that at the moment you can't create new accounts, update your personal information, or request password reminders.{% endblocktrans %} | ||
953 | 58 | </p> | ||
954 | 59 | </div> | ||
955 | 60 | {% endif %} | ||
956 | 61 | {% endblock %} | ||
957 | 62 | |||
958 | 63 | {% block messages %} | ||
959 | 64 | {% if messages %} | ||
960 | 65 | <section class="p-strip is-shallow"> | ||
961 | 66 | {% for message in messages %} | ||
962 | 67 | <div class="row"> | ||
963 | 68 | <div class="col-12"> | ||
964 | 69 | <div class="p-notification"> | ||
965 | 70 | <p class="p-notification__response"> | ||
966 | 71 | {{ message }} | ||
967 | 72 | </p> | ||
968 | 73 | </div> | ||
969 | 74 | </div> | ||
970 | 75 | </div> | ||
971 | 76 | {% endfor %} | ||
972 | 77 | </section> | ||
973 | 78 | {% endif %} | ||
974 | 79 | {% endblock %} | ||
975 | 80 | |||
976 | 81 | <div id="{% block content_id %}box{% endblock %}" class="row"> | 53 | <div id="{% block content_id %}box{% endblock %}" class="row"> |
977 | 82 | {% block menu %} | 54 | {% block menu %} |
978 | 83 | {% if user.is_authenticated %} | 55 | {% if user.is_authenticated %} |
979 | @@ -87,6 +59,32 @@ | |||
980 | 87 | {% endif %} | 59 | {% endif %} |
981 | 88 | {% endblock %} | 60 | {% endblock %} |
982 | 89 | <div class="{% block content_class %}col-8{% endblock %}"> | 61 | <div class="{% block content_class %}col-8{% endblock %}"> |
983 | 62 | {% block readonly %} | ||
984 | 63 | {% if readonly %} | ||
985 | 64 | <div class="p-notification--caution"> | ||
986 | 65 | <p class="p-notification__response"> | ||
987 | 66 | {% blocktrans %}We are currently in read-only mode. That means that at the moment you can't create new accounts, update your personal information, or request password reminders.{% endblocktrans %} | ||
988 | 67 | </p> | ||
989 | 68 | </div> | ||
990 | 69 | {% endif %} | ||
991 | 70 | {% endblock %} | ||
992 | 71 | {% block messages %} | ||
993 | 72 | {% if messages %} | ||
994 | 73 | <section class="p-strip is-shallow"> | ||
995 | 74 | {% for message in messages %} | ||
996 | 75 | <div class="row"> | ||
997 | 76 | <div class="col-12"> | ||
998 | 77 | <div class="p-notification"> | ||
999 | 78 | <p class="p-notification__response"> | ||
1000 | 79 | {{ message }} | ||
1001 | 80 | </p> | ||
1002 | 81 | </div> | ||
1003 | 82 | </div> | ||
1004 | 83 | </div> | ||
1005 | 84 | {% endfor %} | ||
1006 | 85 | </section> | ||
1007 | 86 | {% endif %} | ||
1008 | 87 | {% endblock %} | ||
1009 | 90 | {% block content %}{% endblock %} | 88 | {% block content %}{% endblock %} |
1010 | 91 | </div> | 89 | </div> |
1011 | 92 | </div> | 90 | </div> |
1012 | 93 | 91 | ||
1013 | === modified file 'src/webui/templates/vanilla/widgets/personal-menu.html' | |||
1014 | --- src/webui/templates/vanilla/widgets/personal-menu.html 2019-08-19 08:29:07 +0000 | |||
1015 | +++ src/webui/templates/vanilla/widgets/personal-menu.html 2019-08-19 08:29:07 +0000 | |||
1016 | @@ -9,7 +9,7 @@ | |||
1017 | 9 | {% load menu_item %} | 9 | {% load menu_item %} |
1018 | 10 | {% load url_with_token %} | 10 | {% load url_with_token %} |
1019 | 11 | <div class="p-strip"> | 11 | <div class="p-strip"> |
1021 | 12 | <ul class="p-list"> | 12 | <ul class="p-list u-no-margin--bottom"> |
1022 | 13 | {% url_with_token 'account-index' as account_url %} | 13 | {% url_with_token 'account-index' as account_url %} |
1023 | 14 | 14 | ||
1024 | 15 | {% if current_section == 'account' %} | 15 | {% if current_section == 'account' %} |
Hold off on the review. I'm going to merge a few more commits into this one.