fix(ResponsiveStyling): Show subset of heading at thin widths

newrelic · Jun 19, 2020 · e81387d · e81387d
1 parent 79dbb6d
commit e81387d
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 1 deletion.
diff --git a/src/pages/index.js b/src/pages/index.js
@@ -97,7 +97,10 @@ const IndexPage = ({ pageContext }) => (
               styles.gettingStartedHeading
             )}
           >
-            Get started in minutes
+            <div>
+              Get started{' '}
+              <span className={styles.getStartedTextFull}>in minutes</span>
+            </div>
             <ExternalLink href="https://newrelic.com/signup?partner=Developer+Edition">
               <button type="button">Create a free account</button>
             </ExternalLink>

diff --git a/src/pages/index.module.scss b/src/pages/index.module.scss
@@ -45,3 +45,9 @@
 .gettingStartedHeading {
   margin-bottom: 4rem;
 }
+
+@media screen and (max-width: 980px) {
+  .getStartedTextFull {
+    display: none;
+  }
+}