From beafc19659333bd494818a2be9a082912554b2e5 Mon Sep 17 00:00:00 2001
From: Rajit Sarkar <rsar@loc.gov>
Date: Tue, 1 Oct 2024 12:32:46 -0400
Subject: [PATCH] CONCD-939 we can make this more responsive by actually using
 bootstrap's grid

---
 concordia/static/scss/base.scss                           | 2 +-
 .../templates/transcriptions/asset_detail/editor.html     | 8 ++++----
 2 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/concordia/static/scss/base.scss b/concordia/static/scss/base.scss
index 66f0d8816..37539fa9c 100644
--- a/concordia/static/scss/base.scss
+++ b/concordia/static/scss/base.scss
@@ -1138,7 +1138,7 @@ $card-progress-height: 12px;
 /* How to Guide */
 #open-guide {
     border-radius: $btn-border-radius;
-    margin: -14px 5px 0 9px;
+    margin: 0 5px 0 9px;
     white-space: nowrap;
 }
 
diff --git a/concordia/templates/transcriptions/asset_detail/editor.html b/concordia/templates/transcriptions/asset_detail/editor.html
index 6fa7d9747..13f7408f0 100644
--- a/concordia/templates/transcriptions/asset_detail/editor.html
+++ b/concordia/templates/transcriptions/asset_detail/editor.html
@@ -27,7 +27,7 @@ <h2 id="display-inprogress" {% if transcription_status != "in_progress" %}hidden
         <input type="hidden" name="supersedes" value="{{ transcription.pk|default:'' }}" />
 
         <div class="row justify-content-sm-between px-3">
-            <span id="transcription-status-message">
+            <div id="transcription-status-message" class="col px-0">
                 <h2 id="message-contributors" {% if transcription_status == 'not_started' %}hidden{% endif %}>
                     Registered Contributors: <span id="message-contributors-num" class="font-weight-normal">{{ registered_contributors }}</span>
                 </h2>
@@ -43,10 +43,10 @@ <h2 id="message-contributors" {% if transcription_status == 'not_started' %}hidd
                 <span id="message-completed" {% if transcription_status != 'completed' %}hidden{% endif %}>
                     This transcription is finished! You can read and add tags.
                 </span>
-            </span>
+            </div>
             {% if cards %}
-                <div class="align-items-center align-self-end btn-group">
-                    <a class="font-weight-bold" id="quick-tips" data-toggle="modal" data-target="#tutorial-popup" role="button">
+                <div class="align-items-center align-self-end btn-group col px-0">
+                    <a class="font-weight-bold mt-3" id="quick-tips" data-toggle="modal" data-target="#tutorial-popup" role="button">
                         <u>Campaign Tips</u>
                     </a>
                     {% if guides %}