feat(aspen/goodcry-band): Move blurb below show list r/7553

Change-Id: I56d23af0a08947e5f28aedf41c9c3d4ac490ac7f
Reviewed-on: https://cl.tvl.fyi/c/depot/+/10962
Reviewed-by: aspen <root@gws.fyi>
Tested-by: BuildkiteCI
Autosubmit: aspen <root@gws.fyi>

2 files changed, 33 insertions, 19 deletions

diff --git a/users/aspen/goodcry-band/index.css b/users/aspen/goodcry-band/index.css
index cd7b51af44..ef2aaee882 100644
--- a/users/aspen/goodcry-band/index.css
+++ b/users/aspen/goodcry-band/index.css
@@ -52,25 +52,30 @@ subtitle {
     padding-bottom: 2.7rem;
 }
 
-header hr {
+hr {
     border-top-style: none;
     border-left-style: none;
     border-right-style: none;
-    border-color: var(--gray);
-    margin-bottom: 2.7rem;
+    border-bottom: 1px solid var(--gray);
     width: 35%;
+    margin: 1.4rem 0;
+}
+
+header hr {
+    margin-top: 0;
+    margin-bottom: 2.7rem;
 }
 
 .header-image {
-    width: 100%;
-    max-width: 100%;
+    width: 75%;
+    max-width: 75%;
     transform: translateX(4%);
     margin-top: 1rem;
 }
 
-@media (min-width: 800px) {
+@media (min-width: 600px) {
     .header-image {
-        max-width: 800px;
+        max-width: 600px;
         margin-bottom: 1.2rem;
     }
 }
@@ -81,15 +86,21 @@ h2 {
     padding-bottom: 0.5rem;
 }
 
+.content {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+}
+
 a {
     color: var(--blue);
     text-decoration: none;
 }
 
 p {
-    margin-bottom: 1.5rem;
     text-align: center;
     max-width: 400px;
+    padding: 0 1rem;
 }
 
 a:active {
@@ -102,7 +113,6 @@ a:active {
     list-style: none;
     font-size: 1.2em;
     text-align: center;
-    margin-bottom: 1rem;
 }
 
 @media (min-width: 800px) {
diff --git a/users/aspen/goodcry-band/index.html b/users/aspen/goodcry-band/index.html
index 15b1fba8a7..ea9ec2f654 100644
--- a/users/aspen/goodcry-band/index.html
+++ b/users/aspen/goodcry-band/index.html
@@ -21,11 +21,6 @@
       <subtitle> just let it all out, baby </subtitle>
       <hr />
     </header>
-    <p>
-      Good Cry is rock n roll by way of grief for an unreachable future. Good
-      Cry is songs about the trials and tribulations of NYC trans love and
-      community. Good Cry is the joy in the heartache
-    </p>
     <h2>Shows</h2>
     <ul class="link-list">
       <li>
@@ -37,11 +32,20 @@
         </a>
       </li>
     </ul>
-    <p>
-      DM us
-      <a href="https://www.instagram.com/goodcryband_bk/">on Instagram</a> for
-      booking inquiries
-    </p>
+    <div class="content">
+      <hr />
+      <p>
+        Good Cry is rock n roll by way of grief for an unreachable future. Good
+        Cry is songs about the trials and tribulations of NYC trans love and
+        community. Good Cry is the joy in the heartache
+      </p>
+      <hr />
+      <p>
+        DM us
+        <a href="https://www.instagram.com/goodcryband_bk/">on Instagram</a> for
+        booking inquiries
+      </p>
+    </div>
     <nav class="social-links">
       <a href="https://www.instagram.com/goodcryband_bk/" title="Instagram">
         <svg