From 0211ba2a4724431e7291a9a59fb00a80dbc9da7f Mon Sep 17 00:00:00 2001
From: Rajit Sarkar <rsar@loc.gov>
Date: Thu, 10 Oct 2024 11:03:34 -0400
Subject: [PATCH] CONCD-924 still more fixes (for spacing, etc)

---
 concordia/static/scss/base.scss               | 36 +++++++++++++------
 .../templates/fragments/_filter-buttons.html  |  2 +-
 .../transcriptions/asset_detail.html          |  4 +--
 .../transcriptions/asset_detail/editor.html   |  6 ++--
 4 files changed, 32 insertions(+), 16 deletions(-)

diff --git a/concordia/static/scss/base.scss b/concordia/static/scss/base.scss
index 0a9c6a2b8..1bfebbc35 100644
--- a/concordia/static/scss/base.scss
+++ b/concordia/static/scss/base.scss
@@ -134,7 +134,7 @@ $alert-padding-x: 1rem;
 $bg-completed: $dark;
 $bg-submitted: $primary;
 /* stylelint-disable-next-line scss/no-global-function-names */
-$bg-in-progress: tint-color($primary, 30%);
+$bg-in-progress: tint-color($primary, 28%);
 $bg-not-started: #fff;
 
 // shadow
@@ -187,14 +187,17 @@ body .container,
     padding-right: 15px;
 }
 
-.row {
+div.row {
     margin-left: -15px;
     margin-right: -15px;
 }
 
-body .row > * {
-    padding-left: 0;
-    padding-right: 0;
+small {
+    font-weight: 400;
+}
+
+header.border-bottom {
+    border-bottom: 1px solid $border-color !important;
 }
 
 .close {
@@ -249,6 +252,10 @@ body h5 {
     font-weight: $headings-font-weight;
 }
 
+div h6 {
+    font-weight: $headings-font-weight;
+}
+
 li a {
     text-decoration: none;
 }
@@ -288,6 +295,10 @@ body .btn {
     font-weight: $btn-font-weight;
 }
 
+.btn-block {
+    width: 100%;
+}
+
 .input-group-sm > .input-group-prepend > .input-group-text {
     font-size: 0.875rem;
 }
@@ -650,6 +661,10 @@ a.card-title.text-dark {
     overflow: hidden;
 }
 
+li.breadcrumb-item.active {
+    color: $gray-800;
+}
+
 .breadcrumb .breadcrumb-item + .breadcrumb-item {
     padding-left: 0.25rem;
 }
@@ -793,7 +808,7 @@ body .campaign-page-progress {
     height: 2.5rem;
 }
 
-.campaign-progress {
+div.campaign-progress {
     height: 35px;
     margin-top: 20px;
 }
@@ -876,6 +891,10 @@ body .disabled > .page-link {
     max-width: 270px;
 }
 
+.call-to-action {
+    min-width: 292px;
+}
+
 // Campaign small blocks
 
 .small-campaign-title {
@@ -1053,10 +1072,6 @@ body .disabled > .page-link {
     }
 }
 
-body .help-buttons {
-    padding-left: 75px;
-}
-
 @include media-breakpoint-down(sm) {
     #contribute-container {
         flex-direction: column !important;
@@ -1382,6 +1397,7 @@ a.btn-outline-primary:hover {
     right: 1rem;
     top: 0.375rem;
     color: $blue;
+    cursor: pointer;
     font-size: 1.5rem;
     font-weight: 700;
 }
diff --git a/concordia/templates/fragments/_filter-buttons.html b/concordia/templates/fragments/_filter-buttons.html
index 3cb189d1f..097d63cab 100644
--- a/concordia/templates/fragments/_filter-buttons.html
+++ b/concordia/templates/fragments/_filter-buttons.html
@@ -1,5 +1,5 @@
 {% if user.is_authenticated and user.is_staff %}
-    <div class="mt-4">
+    <div class="col-4 mt-4 ps-5">
         <input name="radioButtons" type="radio" id="show-all" {% if do_filter %}onclick="filterAssets(false, '{{ all_url }}?{{ sublevel_qs }}')"{% else %}checked{% endif %}>
         <label>Show all</label>
         <input name="radioButtons" type="radio" id="filter-assets" {% if do_filter %}checked{% else %}onclick="filterAssets(true, '{{ filtered_url }}?{{ sublevel_qs }}')"{% endif %}>
diff --git a/concordia/templates/transcriptions/asset_detail.html b/concordia/templates/transcriptions/asset_detail.html
index 5f1c90dd0..3e83c76dc 100644
--- a/concordia/templates/transcriptions/asset_detail.html
+++ b/concordia/templates/transcriptions/asset_detail.html
@@ -96,8 +96,8 @@
         <div id="help-container" class="mt-1 d-print-none">
             <div class="row p-3 bg-light justify-content-sm-between">
                 <div class="d-flex align-items-center ps-1 col">Share this item: {% share_buttons current_asset_url asset.item.title %}</div>
-                <div class="btn-group align-items-center col-3 help-buttons">
-                    <p class="ms-1 me-2 my-0">Need help?</p>
+                <div class="btn-group align-items-center col">
+                    <p class="ms-auto me-2 my-0">Need help?</p>
 
                     <div class="d-grid gap-2 d-md-block">
                         <a class="btn btn-primary mx-1" href="https://ask.loc.gov/crowd" target="_blank" rel=noopener>
diff --git a/concordia/templates/transcriptions/asset_detail/editor.html b/concordia/templates/transcriptions/asset_detail/editor.html
index 4d724342f..fda620392 100644
--- a/concordia/templates/transcriptions/asset_detail/editor.html
+++ b/concordia/templates/transcriptions/asset_detail/editor.html
@@ -26,8 +26,8 @@ <h2 id="display-inprogress" {% if transcription_status != "in_progress" %}hidden
         {% csrf_token %}
         <input type="hidden" name="supersedes" value="{{ transcription.pk|default:'' }}" />
 
-        <div class="row justify-content-sm-between px-3">
-            <div class="col-4">
+        <div class="row justify-content-sm-between ps-3 pe-2">
+            <div class="col">
                 <span id="transcription-status-message">
                     <h2 id="message-contributors" {% if transcription_status == 'not_started' %}hidden{% endif %}>
                         Registered Contributors: <span id="message-contributors-num" class="fw-normal">{{ registered_contributors }}</span>
@@ -47,7 +47,7 @@ <h2 id="message-contributors" {% if transcription_status == 'not_started' %}hidd
                 </span>
             </div>
             {% if cards %}
-                <div class="align-items-center align-self-end btn-group col-6">
+                <div class="align-items-end btn-group col call-to-action pe-0">
                     <a class="fw-bold" id="quick-tips" data-bs-toggle="modal" data-bs-target="#tutorial-popup" role="button">
                         <u>Campaign Tips</u>
                     </a>