Merge pull request #1379 from alphagov/consistent-banners

Make banners more consistent

app/assets/stylesheets/components/banner.scss

@@ -3,14 +3,14 @@
 .banner-default {
 
   @include core-19;
-  background: $govuk-blue;
-  color: $white;
+  color: $text-colour;
   display: block;
   padding: $gutter-half;
   margin: $gutter-half 0 $gutter 0;
   text-align: left;
   position: relative;
   clear: both;
+  border: 5px solid $button-colour;
 
   &-title {
     @include bold-24;
@@ -29,9 +29,9 @@
 %banner-with-tick,
 .banner-with-tick {
   padding: $gutter-half ($gutter + $gutter-half);
-  background-image: file-url('tick-white.png');
+  background-image: file-url('tick.png');
   @include ie-lte(8) {
-    background-image: file-url('tick-white-16px.png');
+    background-image: file-url('tick-16px.png');
   }
   background-size: 19px;
   background-repeat: no-repeat;
@@ -49,7 +49,7 @@
   @extend %banner;
   @include bold-19;
   background: $white;
-  color: $error-colour;
+  color: $text-colour;
   border: 5px solid $error-colour;
   margin: 15px 0;
   text-align: left;
@@ -160,7 +160,7 @@
   background: $yellow;
   color: $text-colour;
   border: 5px solid $text-colour;
-  margin: $gutter 0 $gutter 0;
+  margin: $gutter-half 0 $gutter 0;
   text-align: left;
   padding: 20px;
 

app/main/views/api_keys.py

@@ -110,8 +110,9 @@ def revoke_api_key(service_id, key_id):
     key_name = api_key_api_client.get_api_keys(service_id=service_id, key_id=key_id)['apiKeys'][0]['name']
     if request.method == 'GET':
         return render_template(
-            'views/api/keys/revoke.html',
-            key_name=key_name
+            'views/api/keys.html',
+            revoke_key=key_name,
+            keys=api_key_api_client.get_api_keys(service_id=service_id)['apiKeys'],
         )
     elif request.method == 'POST':
         api_key_api_client.revoke_api_key(service_id=service_id, key_id=key_id)

app/main/views/templates.py

@@ -428,22 +428,24 @@ def delete_service_template(service_id, template_id):
         last_used_notification = template_statistics_client.get_template_statistics_for_template(
             service_id, template['id']
         )
-        message = '{} was last used {} ago'.format(
-            last_used_notification['template']['name'],
+        message = 'It was last used {} ago.'.format(
             get_human_readable_delta(
                 parse(last_used_notification['created_at']).replace(tzinfo=None),
-                datetime.utcnow())
+                datetime.utcnow()
+            )
         )
     except HTTPError as e:
         if e.status_code == 404:
-            message = '{} has never been used'.format(template['name'])
+            message = None
         else:
             raise e
 
-    flash('{}. Are you sure you want to delete it?'.format(message), 'delete')
-
     return render_template(
         'views/templates/template.html',
+        template_delete_confirmation_message=(
+            'Are you sure you want to delete {}?'.format(template['name']),
+            message,
+        ),
         template=get_template(
             template,
             current_service,

app/templates/components/banner.html

@@ -7,7 +7,7 @@
     {% endif %}
   >
     {% if subhead -%}
-        {{ subhead }} 
+      <h1 class="banner-title">{{ subhead }}</h1>
     {%- endif -%}
     {{ body }}
     {% if delete_button %}

app/templates/views/api/keys.html

@@ -1,4 +1,5 @@
 {% extends "withnav_template.html" %}
+{% from "components/banner.html" import banner_wrapper %}
 {% from "components/table.html" import list_table, field, hidden_field_heading %}
 {% from "components/api-key.html" import api_key %}
 {% from "components/page-footer.html" import page_footer %}
@@ -9,16 +10,31 @@
 
 {% block maincolumn_content %}
 
-  <div class="grid-row">
-    <div class="column-two-thirds">
-      <h1 class="heading-large">
-        API keys
-      </h1>
+  {% if revoke_key %}
+    <div class="bottom-gutter">
+      {% call banner_wrapper(type='dangerous', subhead='Are you sure you want to revoke this API key?') %}
+        <p>
+          ‘{{ revoke_key }}’ will no longer let you connect to GOV.UK Notify.
+        </p>
+        <form method='post'>
+          <input type="hidden" name="csrf_token" value="{{ csrf_token() }}" />
+          <input type="submit" class="button" name="delete" value="Confirm" />
+        </form>
+      {% endcall %}
     </div>
-    <div class="column-one-third">
-      <a href="{{ url_for('.create_api_key', service_id=current_service.id) }}" class="button align-with-heading">Create an API key</a>
+  {% else %}
+    <div class="grid-row">
+      <div class="column-two-thirds">
+        <h1 class="heading-large">
+          API keys
+        </h1>
+      </div>
+      <div class="column-one-third">
+        <a href="{{ url_for('.create_api_key', service_id=current_service.id) }}" class="button align-with-heading">Create an API key</a>
+      </div>
     </div>
-  </div>
+  {% endif %}
+
   <div class="body-copy-table">
     {% call(item, row_number) list_table(
       keys,

app/templates/views/api/keys/revoke.html

@@ -1,31 +0,0 @@
-{% extends "withnav_template.html" %}
-{% from "components/page-footer.html" import page_footer %}
-{% from "components/api-key.html" import api_key %}
-
-{% block service_page_title %}
-  Revoke API key
-{% endblock %}
-
-{% block maincolumn_content %}
-
-    <h1 class="heading-large">
-      Revoke API key
-    </h1>
-
-    <p>
-      ‘{{ key_name }}’ will no longer let you connect to GOV.UK Notify.
-    </p>
-    <p>
-      You can’t undo this.
-    </p>
-
-    <form method="post">
-      {{ page_footer(
-        'Revoke this API key',
-        back_link=url_for('.api_keys', service_id=current_service.id),
-        back_link_text='Back to API keys',
-        destructive=True
-      ) }}
-    </form>
-
-{% endblock %}

app/templates/views/dashboard/no-permissions-banner.html

@@ -1,5 +1,6 @@
 {% from "components/banner.html" import banner_wrapper %}
 
-{% call banner_wrapper(type="default") %}
-  You only have permission to view this service
+{% call banner_wrapper(type="warning") %}
+  You only have permission to view this service. To send messages, edit
+  templates or manage team members, contact the person who invited you.
 {% endcall %}

app/templates/views/templates/template.html

@@ -27,10 +27,24 @@
         </form>
       {% endcall %}
     </div>
+  {% elif template_delete_confirmation_message %}
+    <div class="bottom-gutter">
+      {% call banner_wrapper(type='dangerous', subhead=template_delete_confirmation_message[0]) %}
+        {% if template_delete_confirmation_message[1] %}
+          <p>
+            {{ template_delete_confirmation_message[1] }}
+          </p>
+        {% endif %}
+        <form method='post'>
+          <input type="hidden" name="csrf_token" value="{{ csrf_token() }}" />
+          <input type="submit" class="button" name="delete" value="Confirm" />
+        </form>
+      {% endcall %}
+    </div>
+  {% else %}
+    <h1 class="heading-large">{{ template.name }}</h1>
   {% endif %}
 
-  <h1 class="heading-large">{{ template.name }}</h1>
-
   <div class="grid-row">
     {% with show_title=False, expanded=True %}
       {% include 'views/templates/_template.html' %}