additional css to match the contact card spacing

js/component_scripts.min.js

+/**
+ * @file
+ * Ckeditor Modal.
+ */
+
+(function ($, Drupal) {
+  if ($.ui && $.ui.dialog) {
+    orig_allowInteraction = $.ui.dialog.prototype._allowInteraction;
+    $.ui.dialog.prototype._allowInteraction = function (event) {
+      if ($(event.target).closest('.cke_dialog').length) {
+        return true;
+      }
+      return orig_allowInteraction.apply(this, arguments);
+    };
+  }
+})(jQuery, Drupal);
+
 /**
  * @file
  */
@@ -329,23 +346,6 @@ else {
   };
 })(jQuery);
 
-/**
- * @file
- * Ckeditor Modal.
- */
-
-(function ($, Drupal) {
-  if ($.ui && $.ui.dialog) {
-    orig_allowInteraction = $.ui.dialog.prototype._allowInteraction;
-    $.ui.dialog.prototype._allowInteraction = function (event) {
-      if ($(event.target).closest('.cke_dialog').length) {
-        return true;
-      }
-      return orig_allowInteraction.apply(this, arguments);
-    };
-  }
-})(jQuery, Drupal);
-
 /**
  * @file
  */

source/_patterns/04-components/card/_card.scss

@@ -15,6 +15,10 @@ $card-padding: rem(gesso-spacing(sm)) !default;
   .views-row &{
     height:100%;
   }
+  .uw-label{
+    display:block;
+    margin-top:1rem;
+  }
 }
 
 // if card--show-hover class is present then show "

source/_patterns/04-components/card/card.twig

@@ -125,7 +125,7 @@
             {% endif %}
             {% if location %}
               <div class="card__location">
-                Location: {{ location }}
+                <span class="uw-label">Location:</span> {{ location }}
               </div>
             {% endif %}
           {% endblock %}
@@ -142,14 +142,13 @@
 
           {% block details_content %}
             {% if link_profile %}
-              <div class="uw-contact__link-profile">
-                <strong>Link to Profile:</strong><br />
+              <div class="card__link-profile">Link to Profile:<br />
                 <a href="{{ link_profile.uri }}">{{ link_profile.title }}</a>
               </div>
             {% endif %}
             {% if personal_webpage %}
-              <div class="uw-contact__personal-webpage">
-                <strong>Link to personal webpage:</strong><br />
+              <div class="card__personal-webpage">
+                <span class="uw-label">Link to personal webpage:</span>
                 <a href="{{ personal_webpage.uri }}">{{ personal_webpage.title }}</a>
               </div>
             {% endif %}
@@ -169,8 +168,8 @@
 
           {% block details_content %}
             {% if host %}
-              <div class="uw-contact__host">
-                <strong>Host:</strong><br />
+              <div class="card__host">
+                <span class="uw-label"> Host:</span>
                 <a href="{{ host.uri }}">
                   {% if host.title %}
                     {{ host.title }}
@@ -181,8 +180,8 @@
               </div>
             {% endif %}
             {% if event_website %}
-              <div class="uw-contact__event-website">
-                <strong>Event website:</strong><br />
+              <div class="card__event-website">
+                <span class="uw-label"> Event website:</span>
                 <a href="{{ event_website.uri }}">
                   {% if event_website.title %}
                     {{ event_website.title }}
@@ -193,8 +192,8 @@
               </div>
             {% endif %}
             {% if cost %}
-              <div class="uw-contact__cost">
-                <strong>Cost:</strong><br />
+              <div class="card__cost">
+                <span class="uw-label">Cost:</span>
                 ${{ cost }}
               </div>
             {% endif %}
@@ -214,8 +213,8 @@
 
           {% block details_content %}
             {% if address %}
-              <div class="uw-contact__address">
-                <strong>Location Address:</strong><br />
+              <div class="card__address">
+                <span class="uw-label">Location Address:</span>
                 {% if address.address_line1 %}
                   {{ address.address_line1 }}<br />
                 {% endif %}
@@ -231,14 +230,14 @@
               </div>
             {% endif %}
             {% if map %}
-              <div class="uw-contact__map">
-                <strong>Location coordinates:</strong><br />
+              <div class="card__map">
+                <span class="uw-label">Location coordinates:</span>
                 {{ map }}
               </div>
             {% endif %}
             {% if map_link %}
-              <div class="uw-contact__map-link">
-                <strong>Link to map:</strong><br />
+              <div class="card__map-link">
+                <span class="uw-label"> Link to map:</span>
                 <a href="{{ map_link.uri }}">{{ map_link.uri }}</a>
               </div>
             {% endif %}