From 50ab824dcf89e958dec839bf23b6ff894c2e470d Mon Sep 17 00:00:00 2001
From: Ben Silverman <ben@performantsoftware.com>
Date: Thu, 9 Jan 2025 13:29:51 -0500
Subject: [PATCH] Improve alignment behavior in editor (#1698)

---
 sitemedia/js/controllers/ittpanel_controller.js | 5 +++++
 sitemedia/scss/components/_transcription.scss   | 4 ++--
 2 files changed, 7 insertions(+), 2 deletions(-)

diff --git a/sitemedia/js/controllers/ittpanel_controller.js b/sitemedia/js/controllers/ittpanel_controller.js
index 4a2de5fde..3677f23f4 100644
--- a/sitemedia/js/controllers/ittpanel_controller.js
+++ b/sitemedia/js/controllers/ittpanel_controller.js
@@ -32,6 +32,11 @@ export default class extends Controller {
         }
         // on resize, retrigger alignment
         window.addEventListener("resize", this.boundResizeHandler);
+        // a bit hacky; on annotation load, short wait for elements to be created, then align
+        // (this is only used in editor environment)
+        document.addEventListener("annotations-loaded", () =>
+            setTimeout(this.boundResizeHandler, 50)
+        );
     }
 
     disconnect() {
diff --git a/sitemedia/scss/components/_transcription.scss b/sitemedia/scss/components/_transcription.scss
index 84420c78d..174984937 100644
--- a/sitemedia/scss/components/_transcription.scss
+++ b/sitemedia/scss/components/_transcription.scss
@@ -1468,13 +1468,13 @@
 
     &[dir="ltr"] {
         li {
-            margin-left: 1.5em;
+            margin-left: 1.6em;
             padding-left: 1em; /* shift to make space for line numbers */
         }
         p {
             // match alignment of list items
             margin-left: 1em;
-            padding-left: 1.5em;
+            padding-left: 1.6em;
         }
         li > p {
             // if inside a list item, don't pad <p>