From 2714cd2c7cb6daf51e78317523dd18278e62c440 Mon Sep 17 00:00:00 2001
From: Bryce Robertson <bryceerobertson@gmail.com>
Date: Mon, 6 Jan 2025 23:16:56 -0300
Subject: [PATCH] fixed random mobile line break

---
 app/components/HowCanIHelp/howcanihelp.css | 12 ++++++++++++
 app/routes/how-can-i-help._index.tsx       |  2 +-
 2 files changed, 13 insertions(+), 1 deletion(-)

diff --git a/app/components/HowCanIHelp/howcanihelp.css b/app/components/HowCanIHelp/howcanihelp.css
index 5d039fb9..3592ba4d 100644
--- a/app/components/HowCanIHelp/howcanihelp.css
+++ b/app/components/HowCanIHelp/howcanihelp.css
@@ -7,3 +7,15 @@
 .link-card .image + div {
   max-width: calc(100% - 105px);
 }
+
+/* Show line break on desktop */
+.title-break {
+  display: inline;
+}
+
+/* Hide line break on mobile */
+@media (max-width: 1136px) {
+  .title-break {
+    display: none;
+  }
+}
diff --git a/app/routes/how-can-i-help._index.tsx b/app/routes/how-can-i-help._index.tsx
index 1103bec4..a7ece20d 100644
--- a/app/routes/how-can-i-help._index.tsx
+++ b/app/routes/how-can-i-help._index.tsx
@@ -13,7 +13,7 @@ export default function HowCanIHelp() {
       <div className="page-body padding-top-56">
         <div className="flexbox padding-bottom-80">
           <h1 className="teal-500 col-7">
-            How can I help with<br></br> AI safety?
+            How can I help with <br className="title-break"></br>AI safety?
           </h1>
           <p className="large col-5 desktop-only">
             The AI safety movement is still relatively new, and your actions could have significant