Fixing layout issue

weather-gov · Sep 9, 2024 · 9cbe32e · 9cbe32e
1 parent 286e73b
commit 9cbe32e
Showing 1 changed file with 21 additions and 18 deletions.
diff --git a/web/themes/new_weather_theme/templates/wfo-info/node--wfo-info.html.twig b/web/themes/new_weather_theme/templates/wfo-info/node--wfo-info.html.twig
@@ -71,30 +71,33 @@
     {% set hasSocial = hasFacebook or hasTwitter or hasYoutube %}
 
     {% set hasContact = hasSocial or hasAddress or hasPhone or hasEmail %}
+    {% set hasFirstPane = hasPhone or hasAddress or hasEmail %}
 
     {% if hasContact %}
       <h2 class="font-sans-xl border-top-1px border-base-light text-normal text-primary-darker margin-bottom-0 padding-top-105 margin-top-4">
         {{ "Contact us" | t }}
       </h2>
 
       <div class="grid-row margin-top-2">
-        <div class="grid-col-12 tablet:grid-col-4">
-          {% if hasPhone %}
-            {{ content.field_phone_number_opt }}
-          {% endif %}
-
-          {% if hasEmail %}
-            {% if hasPhone %}<div class="margin-top-2">{% endif %}
-              {{ content.field_wfo_email }}
-            {% if hasPhone %}</div>{% endif %}
-          {% endif %}
-
-          {% if hasAddress %}
-            {% if hasPhone or hasEmail %}<div class="margin-top-2">{% endif %}
-              {{ content.field_address }}
-            {% if hasPhone or hasEmail %}</div>{% endif %}
-          {% endif %}
-        </div>
+        {% if hasFirstPane %}
+          <div class="grid-col-12 tablet:grid-col-4">
+            {% if hasPhone %}
+              {{ content.field_phone_number_opt }}
+            {% endif %}
+
+            {% if hasEmail %}
+              {% if hasPhone %}<div class="margin-top-2">{% endif %}
+                {{ content.field_wfo_email }}
+                {% if hasPhone %}</div>{% endif %}
+            {% endif %}
+
+            {% if hasAddress %}
+              {% if hasPhone or hasEmail %}<div class="margin-top-2">{% endif %}
+                {{ content.field_address }}
+                {% if hasPhone or hasEmail %}</div>{% endif %}
+            {% endif %}
+          </div>
+        {% endif %}
 
         <div class="grid-col-12 tablet:grid-col-8">
           {% if hasSocial %}
@@ -108,4 +111,4 @@
       </div>
     {% endif %}
   </div>
-</div>
+</div>