CONCD-939 we can make this more responsive by actually using bootstra…

…p's grid (#2551)
LibraryOfCongress · Oct 2, 2024 · e1cf880 · e1cf880
1 parent 729a031
commit e1cf880
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 5 deletions.
diff --git 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
@@ -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 %}