spacing around download steps

mozilla · Jul 22, 2024 · dc8589e · dc8589e
1 parent 24f8129
commit dc8589e
Show file tree

Hide file tree

Showing 3 changed files with 7 additions and 3 deletions.
diff --git a/bedrock/firefox/templates/firefox/all/download.html b/bedrock/firefox/templates/firefox/all/download.html
@@ -28,13 +28,13 @@ <h2 class="c-step-name{% if not (product and platform and locale) %} t-step-disa
   {% endif %}
   {% if product.slug.startswith("desktop") %}
     {% if platform.startswith("win-store") %}
-      <p><br>
+      <p class="c-step-download">
         {% set ms_store_product = 'firefox_beta' if product.slug.endswith('beta') else 'firefox' %}
         {% set ms_store_href = ms_store_url(product=ms_store_product, campaign='firefox-all') %}
         {{ ms_store_button(href=ms_store_href, id='msStoreLink') }}
       </p>
     {% else %}
-    <p><br>
+    <p class="c-step-download">
       <a href="{{ download_url }}" id="download-button-primary" class="mzp-c-button mzp-t-product mzp-t-xl c-download-button" data-link-type="download" data-download-location="primary cta">
         {{ ftl('download-button-download-now') }} {{ icon_download|safe }}
       </a>

diff --git a/bedrock/firefox/templates/firefox/all/mobile.html b/bedrock/firefox/templates/firefox/all/mobile.html
@@ -22,7 +22,7 @@
 <div class="c-mobile">
 
   {% if product.slug.startswith("ios-beta") %}
-    <p><br>
+    <p class="c-step-download">
       <a href="{{ url('firefox.ios.testflight') }}">{{ ftl('firefox-all-testflight') }}</a>
     </p>
   {% else %}

diff --git a/media/css/firefox/all.scss b/media/css/firefox/all.scss
@@ -100,6 +100,10 @@ $image-path: '/media/protocol/img';
     display: none;
 }
 
+.c-step-download {
+    margin-top: $layout-md;
+}
+
 .c-product-list {
     padding-left: 36px; // to match the desktop & mobile icons