=== modified file 'src/webui/templates/account/account_deleted.html'
--- src/webui/templates/account/account_deleted.html	2013-11-05 14:09:37 +0000
+++ src/webui/templates/account/account_deleted.html	2019-09-05 13:35:58 +0000
@@ -1,33 +1,35 @@
-{% extends "base.html" %}
+{% extends "vanilla/base.html" %}
 {% load i18n %}
 
 {% comment %}
-Copyright 2013 Canonical Ltd.  This software is licensed under the
+Copyright 2013-2019 Canonical Ltd.  This software is licensed under the
 GNU Affero General Public License version 3 (see the file  LICENSE).
 {% endcomment %}
 
 {% block title %}
-    {% blocktrans %}Account Deleted{% endblocktrans %}
+  {% blocktrans %}Account Deleted{% endblocktrans %}
 {% endblock %}
 
 {% block text_title %}
-  <h1 class="main">{% trans "Account Deleted" %}</h1>
+  <h1>{% trans "Account Deleted" %}</h1>
 {% endblock %}
 
 {% block content %}
-<p>{% blocktrans %}Your Ubuntu One account has now been deleted.
-All emails associated with the account have been removed. 
-You can sign up for a new account with any of those emails if you want.
-{% endblocktrans %}</p>
-
-<p>{% blocktrans %}All authentication tokens associated with the account have
-also been deleted. That means any apps using that account will have to login
-again with a different account.
-{% endblocktrans %}</p>
-
-<p>{% blocktrans %}The openid identifier associated with the account has
-been reserved so that it cannot be given out to anyone else. This is so that
-no-one can impersonate you using openid. If you sign up for a new account
-you will have a different openid identifier.
-{% endblocktrans %}</p>
+  <div class="row">
+    <div class="col-8">
+      <p>{% blocktrans %}Your Ubuntu One account has now been deleted.
+      All emails associated with the account have been removed.
+      You can sign up for a new account with any of those emails if you want.
+      {% endblocktrans %}</p>
+      <p>{% blocktrans %}All authentication tokens associated with the account have
+      also been deleted. That means any apps using that account will have to login
+      again with a different account.
+      {% endblocktrans %}</p>
+      <p>{% blocktrans %}The openid identifier associated with the account has
+      been reserved so that it cannot be given out to anyone else. This is so that
+      no-one can impersonate you using openid. If you sign up for a new account
+      you will have a different openid identifier.
+      {% endblocktrans %}</p>
+    </div>
+  </div>
 {% endblock %}

=== modified file 'src/webui/templates/account/confirm_email_invalidation.html'
--- src/webui/templates/account/confirm_email_invalidation.html	2018-09-07 16:32:46 +0000
+++ src/webui/templates/account/confirm_email_invalidation.html	2019-09-05 13:35:58 +0000
@@ -1,32 +1,31 @@
-{% extends "base.html" %}
+{% extends "vanilla/base.html" %}
 {% load i18n %}
 
 {% comment %}
-Copyright 2010-2013 Canonical Ltd.  This software is licensed under the
+Copyright 2010-2019 Canonical Ltd.  This software is licensed under the
 GNU Affero General Public License version 3 (see the file  LICENSE).
 {% endcomment %}
 
 {% block title %}{% trans "Email invalidation" %}{% endblock %}
 
-{% block text_title %}<h1 class="u1-h-main">{% trans "Email invalidation" %}</h1>{% endblock %}
+{% block text_title %}<h1>{% trans "Email invalidation" %}</h1>{% endblock %}
 
 {% block content %}
-
-<div class="info">
-  <p>{% blocktrans %}<strong>WARNING:</strong> Invalidating an e-mail address will prevent logging in to Ubuntu One using that address.{% endblocktrans %}</p>
-  <p>{% blocktrans %}If you intended to <em>validate</em> the address instead, please check the confirmation e-mail you received and click on the first URL to confirm the address.{% endblocktrans %}</p>
-  <p>{% blocktrans %}Are you sure you want to <strong>invalidate</strong> the email address {{ email }}?{% endblocktrans %}</p>
-</div>
-<div class="actions">
-  <form action="" method="POST">
-    {% csrf_token %}
-    <p>
-      <button type="submit" class="btn cta" name="invalidate" data-qa-id="confirm_email_invalidation">
-        <span>{% trans "Yes, invalidate" %}</span>
-    </button>
-    {% include "common/cancel_link.html" %}
-</p>
-</form>
+<div class="row">
+  <div class="col-8">
+    <div class="p-notification--caution">
+      <p class="p-notification__response">
+        {% blocktrans %}<span class="p-notification__status">WARNING:</span> Invalidating an e-mail address will prevent logging in to Ubuntu One using that address.{% endblocktrans %}
+      </p>
+    </div>
+    <p>{% blocktrans %}If you intended to <em>validate</em> the address instead, please check the confirmation e-mail you received and click on the first URL to confirm the address.{% endblocktrans %}</p>
+    <p>{% blocktrans %}Are you sure you want to <strong>invalidate</strong> the email address {{ email }}?{% endblocktrans %}</p>
+    <form action="" method="POST">
+      {% csrf_token %}
+      <button type="submit" class="p-button--negative" name="invalidate" data-qa-id="confirm_email_invalidation">{% trans "Yes, invalidate" %}</button>
+      {% include "common/cancel_link.html" %}
+    </form>
+  </div>
 </div>
 
 {% endblock %}

=== modified file 'src/webui/templates/account/confirm_new_email.html'
--- src/webui/templates/account/confirm_new_email.html	2016-12-02 21:16:07 +0000
+++ src/webui/templates/account/confirm_new_email.html	2019-09-05 13:35:58 +0000
@@ -1,8 +1,8 @@
-{% extends "base.html" %}
+{% extends "vanilla/base.html" %}
 {% load i18n %}
 
 {% comment %}
-Copyright 2010 Canonical Ltd.  This software is licensed under the
+Copyright 2010-2019 Canonical Ltd.  This software is licensed under the
 GNU Affero General Public License version 3 (see the file  LICENSE).
 {% endcomment %}
 
@@ -10,37 +10,28 @@
 
 {% block title %}{% trans "Complete email address validation" %}{% endblock %}
 
-{% block text_title %}<h1 class="u1-h-main">{% blocktrans %}Validate {{ email }}?{% endblocktrans %}</h1>{% endblock %}
+{% block text_title %}<h1>{% blocktrans %}Validate {{ email }}?{% endblocktrans %}</h1>{% endblock %}
 
 {% block content_id %}auth{% endblock %}
 
 {% block content %}
-<p>{% blocktrans %}Are you sure you want to confirm and validate this email address?{% endblocktrans %}</p>
-
-<div class="actions">
+<div class="row">
+  <p>{% blocktrans %}Are you sure you want to confirm and validate this email address?{% endblocktrans %}</p>
   <form action="" method="post">
     {% csrf_token %}
-
     {% if captcha_required %}
     <p class="captcha" id="captcha">
-        {% if captcha_error_message %}
-            <span class="error">
-                {{ captcha_error_message }}
-            </span>
-        {% endif %}
-        {% include "widgets/recaptcha-v2.html" %}
+      {% if captcha_error_message %}
+      <span class="error">
+        {{ captcha_error_message }}
+      </span>
+      {% endif %}
+      {% include "widgets/recaptcha-v2.html" %}
     </p>
     {% endif %}
-
-    <p>
-      <input type="hidden" name="post" value="yes" />
-      <button type="submit" name="continue" class="btn cta" data-qa-id="confirm_email_validation">
-        <span>{% trans "Yes, I'm sure" %}</span>
-      </button>
-      <a class="cta secondary" href="{% if token %}/{{ token }}{% endif %}/" data-qa-id="cancel_email_validation">{% trans "Cancel" %}</a>
-    </p>
+    <input type="hidden" name="post" value="yes" />
+    <a class="p-button--base" href="{% if token %}/{{ token }}{% endif %}/" data-qa-id="cancel_email_validation">{% trans "Cancel" %}</a>
+    <button type="submit" name="continue" class="p-button--positive" data-qa-id="confirm_email_validation">{% trans "Yes, I'm sure" %}</button>
   </form>
 </div>
-
-<br style="clear: both" />
 {% endblock %}

=== modified file 'src/webui/templates/account/deactivated.html'
--- src/webui/templates/account/deactivated.html	2014-12-09 21:41:56 +0000
+++ src/webui/templates/account/deactivated.html	2019-09-05 13:35:58 +0000
@@ -2,18 +2,22 @@
 {% load i18n %}
 
 {% comment %}
-Copyright 2010 Canonical Ltd.  This software is licensed under the
+Copyright 2010-2019 Canonical Ltd.  This software is licensed under the
 GNU Affero General Public License version 3 (see the file  LICENSE).
 {% endcomment %}
 
 {% block title %}{% trans "Account deactivated" %}{% endblock %}
 
-{% block text_title %}<h1 class="u1-h-main">{% trans "Account deactivated" %}</h1>{% endblock %}
+{% block text_title %}<h1>{% trans "Account deactivated" %}</h1>{% endblock %}
 
 {% block content %}
-<div>
-    <p>
-    {% blocktrans %}Your account has been deactivated.{% endblocktrans %}
-    </p>
+<div class="row">
+  <div class="col-8">
+    <div class="p-notification--negative">
+      <p class="p-notification__response">
+        {% blocktrans %}Your account has been deactivated.{% endblocktrans %}
+      </p>
+    </div>
+  </div>
 </div>
 {% endblock %}

=== modified file 'src/webui/templates/account/delete_email.html'
--- src/webui/templates/account/delete_email.html	2014-12-09 21:41:56 +0000
+++ src/webui/templates/account/delete_email.html	2019-09-05 13:35:58 +0000
@@ -1,35 +1,30 @@
-{% extends "base.html" %}
+{% extends "vanilla/base.html" %}
 {% load i18n %}
 
 {% comment %}
-Copyright 2013 Canonical Ltd.  This software is licensed under the
+Copyright 2013-2019 Canonical Ltd.  This software is licensed under the
 GNU Affero General Public License version 3 (see the file  LICENSE).
 {% endcomment %}
 
 {% block html_extra %}data-qa-id="delete_email"{% endblock %}
 
 {% block title %}
-    {% trans "Delete unverified email" %}
+  {% trans "Delete unverified email" %}
 {% endblock %}
 
-{% block text_title %}<h1 class="u1-h-main">{% blocktrans %}Delete {{ email }}?{% endblocktrans %}</h1>{% endblock %}
+{% block text_title %}<h1>{% blocktrans %}Delete {{ email }}?{% endblocktrans %}</h1>{% endblock %}
 
 {% block content_id %}auth{% endblock %}
 
 {% block content %}
-    <div class="info">
-        <p>{% blocktrans %}Are you sure you want to delete this email address?{% endblocktrans %}</p>
-    </div>
-    <div class="actions">
-        <form action="" method="POST">
-            {% csrf_token %}
-            <p>
-                <button type="submit" class="btn cta" name="delete" data-qa-id="confirm_delete_email">
-                    <span>{% trans "Yes, delete" %}</span>
-                </button>
-                {% include "common/cancel_link.html" %}
-            </p>
-        </form>
-    </div>
-    <br style="clear: both" />
+  <div class="row">
+    <div class="col-8">
+      <p>{% blocktrans %}Are you sure you want to delete this email address?{% endblocktrans %}</p>
+      <form action="" method="POST">
+        {% csrf_token %}
+        <button type="submit" class="p-button--negative" name="delete" data-qa-id="confirm_delete_email">{% trans "Yes, delete" %}</button>
+        {% include "common/cancel_link.html" %}
+      </form>
+    </div>
+  </div>
 {% endblock %}

=== modified file 'src/webui/templates/account/edit.html'
--- src/webui/templates/account/edit.html	2019-08-21 16:06:42 +0000
+++ src/webui/templates/account/edit.html	2019-09-05 13:35:58 +0000
@@ -107,9 +107,11 @@
     <div class="p-strip is-shallow">
       <hr>
     </div>
-    <h4 class="legend" data-qa-id="authentication_devices">{% trans "Authentication devices" %}</h4>
+
     <div class="p-form-validation{% if form.twofactor_required.errors %} is-errors{% endif %}">
-      {{ form.twofactor_required }}
+      <h4 class="legend" data-qa-id="authentication_devices">{% trans "Authentication devices" %}</h4>
+      <input type="radio" name="twofactor_required" value="True" {% if form.twofactor_required.value == True %}checked{% endif %} id="id_twofactor_required_0"><label for="id_twofactor_required_0">Always require an authentication device</label>
+      <input type="radio" name="twofactor_required" value="False" id="id_twofactor_required_1" {% if form.twofactor_required.value == False %}checked{% endif %}><label for="id_twofactor_required_1">Require only when logging in to sites that request it</label>
       {% if form.twofactor_required.errors %}
       <p class="p-form-validation__message">
         <strong>Error:</strong> {{ form.twofactor_required.errors|first }}

=== modified file 'src/webui/templates/account/invalidate_email.html'
--- src/webui/templates/account/invalidate_email.html	2014-12-09 21:41:56 +0000
+++ src/webui/templates/account/invalidate_email.html	2019-09-05 13:35:58 +0000
@@ -1,20 +1,27 @@
-{% extends "base.html" %}
+{% extends "vanilla/base.html" %}
 {% load i18n %}
 
 {% comment %}
-Copyright 2010-2013 Canonical Ltd.  This software is licensed under the
+Copyright 2010-2019 Canonical Ltd.  This software is licensed under the
 GNU Affero General Public License version 3 (see the file  LICENSE).
 {% endcomment %}
 
 {% block title %}{% trans "Email invalidated" %}{% endblock %}
 
-{% block text_title %}<h1 class="u1-h-main">{% trans "Email invalidated" %}</h1>{% endblock %}
+{% block text_title %}<h1>{% trans "Email invalidated" %}</h1>{% endblock %}
 
 {% block content %}
-<p>{% blocktrans %}
-The email {{ email }} was successfully invalidated in our system.
-{% endblocktrans %}</p>
-<p>{% blocktrans %}
-Thank you for helping us provide a better service!
-{% endblocktrans %}</p>
+  <div class="row">
+    <div class="p-notification" id="notification">
+      <p class="p-notification__response">
+        {% blocktrans %}
+        The email {{ email }} was successfully invalidated in our system.
+        {% endblocktrans %}
+      </p>
+      <button class="p-icon--close" aria-label="Close notification" onclick="closeNotification('notification')">Close</button>
+    </div>
+    <p>{% blocktrans %}
+    Thank you for helping us provide a better service!
+    {% endblocktrans %}</p>
+  </div>
 {% endblock %}

=== modified file 'src/webui/templates/account/new_email.html'
--- src/webui/templates/account/new_email.html	2014-12-09 21:41:56 +0000
+++ src/webui/templates/account/new_email.html	2019-09-05 13:35:58 +0000
@@ -1,37 +1,39 @@
-{% extends "base.html" %}
+{% extends "vanilla/base.html" %}
 {% load i18n %}
 
 {% comment %}
-Copyright 2010 Canonical Ltd.  This software is licensed under the
+Copyright 2010-2019 Canonical Ltd.  This software is licensed under the
 GNU Affero General Public License version 3 (see the file  LICENSE).
 {% endcomment %}
 
 {% block title %}{% trans "Add an email" %}{% endblock %}
 
-{% block text_title %}<h1 class="u1-h-main">{% trans "Add an email address to your account" %}</h1>{% endblock %}
+{% block text_title %}<h1>{% trans "Add an email address to your account" %}</h1>{% endblock %}
 
 {% block content_id %}auth{% endblock %}
 
 {% block content %}
+<div class="row">
+  <div class="col-8">
     <p>{% blocktrans %}Enter your email address, and we will send you instructions on how to confirm your account.{% endblocktrans %}</p>
-
     <form action="{% url 'new_email' %}" method="post" name="newemailform">
-        {% csrf_token %}
-        <p class="input-row{% if form.newemail.errors %} haserrors{% endif %}">
-            <label for="id_newemail">{% trans "Email address" %}</label>
-            {{ form.newemail }}
-            {% if form.newemail.errors %}
-                <span class="error">{{ form.newemail.errors|first }}</span>
-            {% endif %}
-        </p>
-        <p class="actions">
-            <button type="submit" class="btn cta" name="continue" data-qa-id="send_instructions_confirm_email">
-                <span>{% trans "Send instructions" %}</span>
-            </button>
-            <a class="cta secondary" href=".">{% trans "Cancel" %}</a>
-        </p>
+      {% csrf_token %}
+      <div class="p-form-validation{% if form.newemail.errors %} is-error{% endif %}">
+        <label for="id_newemail">{% trans "Email address" %}</label>
+        {{ form.newemail }}
+        {% if form.newemail.errors %}
+        <p class="p-form-validation__message" id="input-error-message-inline" role="alert">
+          <strong>Error:</strong> {{ form.newemail.errors|first }}
+        </p>
+        {% endif %}
+      </div>
+      <a class="p-button--base" href="/">{% trans "Cancel" %}</a>
+      <button type="submit" class="p-button--positive" name="continue" data-qa-id="send_instructions_confirm_email">{% trans "Send instructions" %}</button>
     </form>
-    <script type="text/javascript">
-    document.newemailform.newemail.focus();
-    </script>
+  </div>
+</div>
+
+<script type="text/javascript">
+  document.newemailform.newemail.focus();
+</script>
 {% endblock %}

=== modified file 'src/webui/templates/account/suspended.html'
--- src/webui/templates/account/suspended.html	2014-12-09 21:41:56 +0000
+++ src/webui/templates/account/suspended.html	2019-09-05 13:35:58 +0000
@@ -2,7 +2,7 @@
 {% load i18n %}
 
 {% comment %}
-Copyright 2010 Canonical Ltd.  This software is licensed under the
+Copyright 2010-2019 Canonical Ltd.  This software is licensed under the
 GNU Affero General Public License version 3 (see the file  LICENSE).
 {% endcomment %}
 
@@ -10,12 +10,16 @@
 
 {% block title %}{% trans "Account suspended" %}{% endblock %}
 
-{% block text_title %}<h1 class="u1-h-main">{% trans "Account suspended" %}</h1>{% endblock %}
+{% block text_title %}<h1>{% trans "Account suspended" %}</h1>{% endblock %}
 
 {% block content %}
-<div>
-    <p>
-    {% blocktrans %}Your account has been suspended.{% endblocktrans %}
-    </p>
+<div class="row">
+  <div class="col-8">
+    <div class="p-notification--negative">
+      <p class="p-notification__response">
+        {% blocktrans %}Your account has been suspended.{% endblocktrans %}
+      </p>
+    </div>
+  </div>
 </div>
 {% endblock %}

=== modified file 'src/webui/templates/account/user_logged_out_no_valid_emails.html'
--- src/webui/templates/account/user_logged_out_no_valid_emails.html	2014-12-09 21:41:56 +0000
+++ src/webui/templates/account/user_logged_out_no_valid_emails.html	2019-09-05 13:35:58 +0000
@@ -1,21 +1,25 @@
-{% extends "base.html" %}
+{% extends "vanilla/base.html" %}
 {% load i18n %}
 {% load static_url %}
 
 {% comment %}
-Copyright 2010-2013 Canonical Ltd.  This software is licensed under the
+Copyright 2010-2019 Canonical Ltd.  This software is licensed under the
 GNU Affero General Public License version 3 (see the file  LICENSE).
 {% endcomment %}
 
 {% block title %}{% trans "Your account does not have a valid email address" %}{% endblock %}
 
-{% block text_title %}<h1 class="u1-h-main">{% trans "Your account does not have a valid email address" %}</h1>{% endblock %}
+{% block text_title %}<h1>{% trans "Your account does not have a valid email address" %}</h1>{% endblock %}
 
 {% block content %}
-<p>{% blocktrans %}
-You have no valid email addresses linked to your account, so it was deactivated.
-To reactivate the account please contact our support team at:{% endblocktrans %}
-<a href="{{ 'support_form'|static_url }}">{{ 'support_form'|static_url }}</a>
-</p>
+<div class="row">
+  <div class="col-8">
+    <p>{% blocktrans %}
+    You have no valid email addresses linked to your account, so it was deactivated.
+    To reactivate the account please contact our support team at:{% endblocktrans %}
+    <a href="{{ 'support_form'|static_url }}">{{ 'support_form'|static_url }}</a>
+    </p>
+  </div>
+</div>
 
 {% endblock %}

=== modified file 'src/webui/templates/device/generate-codes.html'
--- src/webui/templates/device/generate-codes.html	2013-06-12 16:20:01 +0000
+++ src/webui/templates/device/generate-codes.html	2019-09-05 13:35:58 +0000
@@ -1,8 +1,8 @@
-{% extends "base.html" %}
+{% extends "vanilla/base.html" %}
 {% load i18n %}
 
 {% comment %}
-Copyright 2012 Canonical Ltd.  This software is licensed under the GNU
+Copyright 2012-2019 Canonical Ltd.  This software is licensed under the GNU
 Affero General Public License version 3 (see the file LICENSE).
 {% endcomment %}
 
@@ -14,26 +14,33 @@
 
 
 {% block text_title %}
-<h1 class="main">{% trans "Generate new codes" %}</h1>
+<h1>{% trans "Generate new codes" %}</h1>
 {% endblock %}
 
 {% block content %}
-
-<h3>{% blocktrans %}
-Confirming the new codes will <strong>invalidate</strong> all the previous codes.<br/>
-Please print this new list and <strong>destroy any old lists</strong>.
-{% endblocktrans %}</h3>
-
-{% include 'device/code-list.html' %}
-
-<form method="post">
-  {% csrf_token %}
-  <p>
-    <button class="btn" type="submit" data-qa-id="confirm_new_codes">
-      <span><span>{% trans "Confirm new codes" %}</span></span>
-    </button>
-    {% trans "or" %}
-    <a href="{% url 'device-print' device_id %}" data-qa-id="cancel_new_codes">{% trans "cancel" %}</a>
-  </p>
-</form>
+<div class="row">
+  <div class="col-8">
+    <div class="p-notification--warning">
+      <p class="p-notification__response">
+        {% blocktrans %}
+        Confirming the new codes will <strong>invalidate</strong> all the previous codes.<br/>
+        Please print this new list and <strong>destroy any old lists</strong>.
+        {% endblocktrans %}
+      </p>
+    </div>
+
+    <hr>
+
+    {% include 'device/code-list.html' %}
+
+    <hr>
+
+    <form method="post">
+      {% csrf_token %}
+      <button class="p-button--positive" type="submit" data-qa-id="confirm_new_codes">{% trans "Confirm new codes" %}</button>
+      {% trans "or" %}
+      <a href="{% url 'device-print' device_id %}" data-qa-id="cancel_new_codes">{% trans "cancel" %}</a>
+    </form>
+  </div>
+</div>
 {% endblock %}