From 91e74929eb76f83c2052a708ddb8ce03d2e7fdaa Mon Sep 17 00:00:00 2001
From: Chris Hill-Scott <me@quis.cc>
Date: Wed, 14 Oct 2020 14:11:48 +0100
Subject: [PATCH] Use live indicator on individual broadcast page

So the view of an individual broadcast feel consistent when coming from
the dashboard.
---
 app/assets/stylesheets/app.scss                 | 10 ++++++++++
 app/templates/views/broadcast/view-message.html |  2 +-
 2 files changed, 11 insertions(+), 1 deletion(-)

diff --git a/app/assets/stylesheets/app.scss b/app/assets/stylesheets/app.scss
index bd3de737b..e64f593de 100644
--- a/app/assets/stylesheets/app.scss
+++ b/app/assets/stylesheets/app.scss
@@ -252,6 +252,16 @@ details .arrow {
     //box-shadow: inset 0 0 0 2px $red, inset 0 0 0 5px $white;
   }
 
+  &--left {
+
+    &:before {
+      float: left;
+      margin-left: 0;
+      margin-right: 10px;
+    }
+
+  }
+
 }
 
 input:-webkit-autofill::first-line {
diff --git a/app/templates/views/broadcast/view-message.html b/app/templates/views/broadcast/view-message.html
index 59af6615b..f75265387 100644
--- a/app/templates/views/broadcast/view-message.html
+++ b/app/templates/views/broadcast/view-message.html
@@ -100,7 +100,7 @@
     {{ page_header(broadcast_message.template_name) }}
 
     {% if broadcast_message.status == 'broadcasting' %}
-      <p class="govuk-body">
+      <p class="govuk-body govuk-!-margin-bottom-2 live-broadcast live-broadcast--left">
         Live until {{ broadcast_message.finishes_at|format_datetime_relative }}&ensp;
         {%- if not hide_stop_link %}
           <a href="{{ url_for('.cancel_broadcast_message', service_id=current_service.id, broadcast_message_id=broadcast_message.id) }}" class="destructive-link destructive-link--no-visited-state">Stop broadcasting</a>