From 977db604c2d7403f224f28240c686131f7c2ffdd Mon Sep 17 00:00:00 2001
From: kirsty-hames <kirsty-hames@users.noreply.github.com>
Date: Fri, 3 May 2024 15:50:31 +0100
Subject: [PATCH] New: Completion icon added to transcript button (#291)

---
 less/media.less     | 24 ++++++++++++++++++++----
 templates/media.hbs |  6 ++++++
 2 files changed, 26 insertions(+), 4 deletions(-)

diff --git a/less/media.less b/less/media.less
index 23ea290..20af76a 100644
--- a/less/media.less
+++ b/less/media.less
@@ -7,10 +7,6 @@
   
   // Transcript
   // --------------------------------------------------
-  &__transcript-body-inline {
-    display: none;
-  }
-
   // Skip to transcript button
   &__skip-to-transcript {
 
@@ -26,6 +22,26 @@
     }
   }
 
+  // Transcript container
+  &__transcript-btn {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+  }
+
+  &__transcript-btn-icon {
+    margin-inline-start: @icon-padding / 2;
+  }
+
+  &.is-complete &__transcript-btn-icon .icon {
+    .icon-tick;
+  }
+
+  &__transcript-body-inline {
+    display: none;
+  }
+
+
   // Cross browser bug fixes
   // --------------------------------------------------
   .me-plugin {
diff --git a/templates/media.hbs b/templates/media.hbs
index f6ad952..fd69a19 100644
--- a/templates/media.hbs
+++ b/templates/media.hbs
@@ -61,6 +61,9 @@
         {{_transcript.transcriptLink}}
         {{/if}}
       </span>
+      <span class="media__transcript-btn-icon">
+        <span class="icon" aria-hidden="true"></span>
+      </span>
     </button>
     {{/if}}
 
@@ -73,6 +76,9 @@
         {{_transcript.transcriptLink}}
         {{/if}}
       </span>
+      <span class="media__transcript-btn-icon">
+        <span class="icon" aria-hidden="true"></span>
+      </span>
     </button>
     {{/if}}