adding css for a firefox display:inline-grid and reset to block if @support...

 adding css for a firefox  display:inline-grid and reset to block if @support break-inside attribute

build_gesso.sh

@@ -2,7 +2,7 @@ env_option=${1:-1}
 build_option=${2:-1}
 HTML_PATH=${3:-"/var/www/html"}
 DRUPAL_PATH=${4:-/var/www/drupal8}
-gesso_version="8.x-3.2-uw_wcms1"
+gesso_version="8.x-3.2-uw_wcms2"
 
 if [[ -L "$HTML_PATH/uw_wcms_gesso" ]]; then
   echo ""

core/drupal.init.js

 /**
+ * @file
 * DO NOT EDIT THIS FILE.
 * See the following change record for more information,
-* https://www.drupal.org/node/2815083
+* https://www.drupal.org/node/2815083.
 * @preserve
 **/
 
@@ -15,7 +16,8 @@ document.documentElement.className += ' js';
   var domReady = function domReady(callback) {
     if (document.readyState !== 'loading') {
       callback();
-    } else {
+    }
+else {
       var listener = function listener() {
         callback();
         document.removeEventListener('DOMContentLoaded', listener);

core/drupal.js

 /**
+ * @file
 * DO NOT EDIT THIS FILE.
 * See the following change record for more information,
-* https://www.drupal.org/node/2815083
+* https://www.drupal.org/node/2815083.
 * @preserve
 **/
 
@@ -23,7 +24,8 @@ window.Drupal = { behaviors: {}, locale: {} };
       if (typeof behaviors[i].attach === 'function') {
         try {
           behaviors[i].attach(context, settings);
-        } catch (e) {
+        }
+catch (e) {
           Drupal.throwError(e);
         }
       }
@@ -40,7 +42,8 @@ window.Drupal = { behaviors: {}, locale: {} };
       if (typeof behaviors[i].detach === 'function') {
         try {
           behaviors[i].detach(context, settings, trigger);
-        } catch (e) {
+        }
+catch (e) {
           Drupal.throwError(e);
         }
       }
@@ -126,7 +129,9 @@ window.Drupal = { behaviors: {}, locale: {} };
 
     try {
       url = decodeURIComponent(url);
-    } catch (e) {}
+    }
+catch (e) {
+}
 
     urlParsingNode.setAttribute('href', url);
 
@@ -144,10 +149,14 @@ window.Drupal = { behaviors: {}, locale: {} };
 
     try {
       absoluteUrl = decodeURIComponent(absoluteUrl);
-    } catch (e) {}
+    }
+catch (e) {
+}
     try {
       baseUrl = decodeURIComponent(baseUrl);
-    } catch (e) {}
+    }
+catch (e) {
+}
 
     return absoluteUrl === baseUrl || absoluteUrl.indexOf(baseUrl + '/') === 0;
   };
@@ -162,7 +171,8 @@ window.Drupal = { behaviors: {}, locale: {} };
 
     if (typeof drupalTranslations !== 'undefined' && drupalTranslations.pluralFormula) {
       index = count in drupalTranslations.pluralFormula ? drupalTranslations.pluralFormula[count] : drupalTranslations.pluralFormula.default;
-    } else if (args['@count'] !== 1) {
+    }
+else if (args['@count'] !== 1) {
       index = 1;
     }
 

core/drupalSettingsLoader.js

 /**
+ * @file
 * DO NOT EDIT THIS FILE.
 * See the following change record for more information,
-* https://www.drupal.org/node/2815083
+* https://www.drupal.org/node/2815083.
 * @preserve
 **/
 

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
  */
@@ -186,6 +169,22 @@
   };
 })(jQuery, Drupal);
 
+/**
+ * @file
+ */
+
+(function ($, Drupal) {
+  Drupal.behaviors.filtersopen = {
+    attach: function (context, settings) {
+      $(document).ready(function () {
+        $('.view-filters details').each(function () {
+          $(this).attr("open", "");
+        });
+      });
+    }
+  };
+})(jQuery, Drupal);
+
 /**
  * @file
  */
@@ -311,6 +310,34 @@ else if (e.keyCode === 37) {
   };
 })(jQuery, Drupal);
 
+/**
+ * @file
+ */
+
+(function ($, Drupal) {
+  Drupal.behaviors.tabs = {
+    attach: function (context, settings) {
+      $(document).ready(function () {
+
+        $('.uw-contact-expand-all').click(function () {
+          $('.uw-contact details').each(function () {
+            console.log($(this));
+            $(this).attr("open", "");
+          });
+        });
+
+        $('.uw-contact-collapse-all').click(function () {
+          $('.uw-contact details').each(function () {
+            console.log($(this));
+            $(this).removeAttr("open");
+          });
+        });
+
+      });
+    }
+  };
+})(jQuery, Drupal);
+
 /**
  * @file
  */
@@ -346,6 +373,23 @@ 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
  */
@@ -601,20 +645,20 @@ else {
  */
 
 (function ($, Drupal) {
-  Drupal.behaviors.viewcontact = {
+  Drupal.behaviors.uwexpcolall = {
     attach: function (context, settings) {
       $(document).ready(function () {
 
-        $('.uw-contact-expand-all').click(function () {
-          $('.uw-contact details').each(function () {
-            console.log($(this));
+        $('.uw-exp-col-expand-all').click(function () {
+          var uuid = $(this).attr('data-uuid');
+          $('[data-uuid="' + uuid + '"] details').each(function () {
             $(this).attr("open", "");
           });
         });
 
-        $('.uw-contact-collapse-all').click(function () {
-          $('.uw-contact details').each(function () {
-            console.log($(this));
+        $('.uw-exp-col-collapse-all').click(function () {
+          var uuid = $(this).attr('data-uuid');
+          $('[data-uuid="' + uuid + '"] details').each(function () {
             $(this).removeAttr("open");
           });
         });

source/_data/design-tokens.artifact.yml

@@ -220,7 +220,7 @@ gesso:
       generic:
         background: "#A2A2A2"
         background-darker: "#000"
-        background-dark: "#4e4e4e"
+        background-dark: "#757575"
         background-light: "#eee"
         background-lighter: "#fafafa"
         border: "#A2A2A2"

source/_patterns/00-config/01-mixins/_mixins.uw.scss

@@ -11,7 +11,17 @@ $test-color-10: #00ff58;
 $test-color-11: #3e3d12;
 $test-color-12: #f00;
 
-
+@mixin uw-no-breakout {
+  //-ms-hyphens: auto;
+  //-moz-hyphens: auto;
+  //-webkit-hyphens: auto;
+  //hyphens: auto;
+  overflow-wrap: break-word;
+  -ms-word-break: break-all;
+  word-break: break-all;
+  word-break: break-word;
+  word-wrap: break-word;
+}
 
 @mixin uw-contained-width {
   margin-left: auto;

source/_patterns/00-config/_design-tokens.artifact.scss

@@ -263,7 +263,7 @@ $gesso: (
       generic: (
         background: #A2A2A2,
         background-darker: #000,
-        background-dark: #4e4e4e,
+        background-dark: #757575,
         background-light: #eee,
         background-lighter: #fafafa,
         border: #A2A2A2,
@@ -511,4 +511,4 @@ $gesso: (
     xxl: 96px,
   ),
   gutter-width: 40px,
-);
+);
\ No newline at end of file

source/_patterns/00-config/config.design-tokens.yml

@@ -220,7 +220,7 @@ gesso:
       generic:
         background: grayscale.gray-4
         background-darker: grayscale.black
-        background-dark: grayscale.gray-6
+        background-dark: grayscale.gray-5
         background-light: grayscale.gray-2
         background-lighter: grayscale.gray-1
         border: grayscale.gray-4

source/_patterns/02-base/date-formats/_date-formats.scss

@@ -12,9 +12,9 @@ $faculties: 'org-default', 'org-ahs', 'org-art', 'org-eng', 'org-env', 'org-mat'
 .uw-field--name-field-uw-blog-date,
 .uw-field--name-field-uw-event-date,
 .uw-field--name-field-uw-news-date{
-  background-color:gesso-brand(org-default,uw-black,'primary');
+  background-color: gesso-brand(org-default, uw-gold, 'primary');
   clear: both;
-  color: gesso-brand(org-default,uw-gold,'primary');
+  color: gesso-brand(org-default, uw-black, 'primary');
   display:inline-block;
   font-family: gesso-font-family(systemmedium);
   font-size: gesso-font-size(-1);
@@ -36,8 +36,8 @@ $faculties: 'org-default', 'org-ahs', 'org-art', 'org-eng', 'org-env', 'org-mat'
     .uw-field--name-field-uw-event-date time,
     .uw-field--name-field-uw-news-date time{
       @if $faculty == org-default {
-        background-color:gesso-brand(org-default,uw-black,'primary');
-        color: gesso-brand(org-default,uw-gold,'primary');
+        background-color: gesso-brand(org-default, uw-gold, 'primary');
+        color: gesso-brand(org-default, uw-black, 'primary');
 
       }
       @else {

source/_patterns/03-layouts/content/_content.scss

@@ -2,3 +2,8 @@
 // Styles for Content Layout.
 
 // .l-content {}
+.uw-main{
+  &.layout.uw-contained-width{
+    padding:0 0 1rem
+  }
+}

source/_patterns/03-layouts/media/media.twig

-<div class="uw-media {{ modifier_classes }}">
+<div class="uw-media {{ modifier_classes }}" {{ attributes }}>
   {% block content %}
     {% if media %}
       <div class="uw-media__object">{{ media }}</div>

source/_patterns/04-components/button/_button.scss

@@ -44,15 +44,6 @@
     padding:rem(gesso-spacing(xxs)) rem(gesso-spacing(xxs));
   }
 }
-.button--icon{
-  font-size: rem(gesso-font-size(-3));
-  max-width: 5rem;
-  padding:rem(gesso-spacing(xxs)) rem(gesso-spacing(xxs));
-  &:hover,
-  &:focus {
-    padding:rem(gesso-spacing(xxs)) rem(gesso-spacing(xxs));
-  }
-}
 
 // Drupal outputs this class on buttons that can delete content.
 .button--primary {

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

@@ -64,7 +64,9 @@
     {{ text }}
   </button>
 {% else %}
-  <a href="{{ url }}" class="button {{ modifier_classes }}">{{ text }}</a>
+  <a {% if aria %} aria-{{ aria_type_name }}="{{ aria_type_value}}" {% endif %} {% if data_type_name %} data-{{ data_type_name }}="{{ data_type_value }}"{% endif %} {% if btn_id %} id="{{ btn_id }}" {% endif %} class="button {{ modifier_classes }}" href="{{ url }}" {%  if btnclick %} onclick="{{ btnclick }}" {% endif %} {%  if target %}target="{{ target }}" {% endif %}>
+    {{ text }}
+  </a>
 {% endif %}
 
 {% if is_demo %}

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

@@ -45,7 +45,7 @@ $card-padding: rem(gesso-spacing(sm)) !default;
 }
 // top
 .card__header{
-  //background: $test-color-2;
+  @include uw-no-breakout();
   color: $card-meta-color;
   margin-bottom: rem(gesso-spacing(sm));
   width: 100%;
@@ -67,6 +67,7 @@ $card-padding: rem(gesso-spacing(sm)) !default;
   }
 }
 .card__author{
+  @include uw-no-breakout();
   font-family: gesso-font-family(systemmedium);
   font-size: gesso-font-size(-1);
   a {
@@ -76,9 +77,6 @@ $card-padding: rem(gesso-spacing(sm)) !default;
     );
   }
 }
-
-
-
 // body
 .card__body {
   @include uw-flex-grid();
@@ -95,7 +93,6 @@ $card-padding: rem(gesso-spacing(sm)) !default;
   margin-bottom: rem(gesso-spacing(md));
   width: 100%;
 }
-
 .card__media {
   //background:$test-color-4;
   margin-bottom: rem(gesso-spacing(md));
@@ -129,10 +126,11 @@ $card-padding: rem(gesso-spacing(sm)) !default;
 }
 // footer
 .card__footer {
-  //background:$test-color-12;
+  @include uw-no-breakout();
   margin-top: auto;
   padding: rem(gesso-spacing(md));
   width: 100%;
+
   > div {
     margin-bottom: rem(gesso-spacing(sm));
     &:last-child {
@@ -142,6 +140,7 @@ $card-padding: rem(gesso-spacing(sm)) !default;
 }
 .card__tags{
   width: 100%;
+
 }
 .card__readmore {
   text-align: right;

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

@@ -21,11 +21,12 @@
 
       .card__body {
 
-        background:gesso-brand(org-default,uw-white,primary);
+
       }
 
       .card__header {
         @include uw-contained-width;
+        background:gesso-brand(org-default,uw-white,primary);
         .card__title {
           font-size: gesso-font-size(8);
 
@@ -64,23 +65,6 @@
           .card__sub-title {
             font-size: gesso-font-size(4);
           }
-
-          .card__date {
-            width: 100%;
-            @include large{
-              width: inherit;
-            }
-            .uw-date {
-              background-color: gesso-brand(org-default, uw-gold, 'primary');
-              color: gesso-brand(org-default, uw-black, 'primary');
-              display: inline-block;
-              width: 100%;
-              @include large{
-                width: inherit;
-              }
-            }
-          }
-
           .card__author {
             padding: gesso-spacing(xs) gesso-spacing(md);
           }
@@ -92,27 +76,21 @@
     }
     .uw-node__with-image {
       .card {
-        >  .card__body {@include uw-contained-width;}
+          .card__header {
+          @include uw-contained-width;
+        }
         .card__body {
-          margin-top: -10rem;
+          margin-top: -7rem;
         }
         .card__header {
-          margin-bottom: 7rem;
-
+          margin-bottom: 1rem;
+          padding-bottom: 2rem;
           .card__title {
-
             padding: gesso-spacing(xs) gesso-spacing(md);
           }
-
           .card__sub-title {
-
             padding: gesso-spacing(xs) gesso-spacing(md);
           }
-
-          .card__date {
-
-          }
-
           .card__author {
             padding: gesso-spacing(xs) gesso-spacing(md);
           }
@@ -120,10 +98,6 @@
         .card__date {
           margin-top: -2.25rem;
           .uw-date {
-            background-color: gesso-brand(org-default, uw-gold, 'primary');
-            color: gesso-brand(org-default, uw-black, 'primary');
-            display: inline-block;
-            width: inherit;
           }
         }
         .card__footer{
@@ -134,35 +108,7 @@
 
   }
 }
-.node--type-uw-ct-event{
-  .uw-node__without-image {
-  }
-  .uw-node__with-image {
-    .card.node {
-      .card__body{
-        .card__header {
-          .card__date {
-            .uw-date-details{
-              .uw-date {
-                background-color: gesso-brand(org-default, uw-black, 'primary');
-                color: gesso-brand(org-default, uw-gold, 'primary');
 
-              }
-            }
-            .uw-date {
-              background-color: gesso-brand(org-default, uw-black, 'primary');
-              color: gesso-brand(org-default, uw-gold, 'primary');
-              width:100%;
-
-            }
-
-          }
-        }
-      }
-
-    }
-  }
-}
 .node--type-uw-ct-profile,
 .node--type-uw-ct-contact {
   .uw-node__without-image,

source/_patterns/04-components/contact/_contact.scss

@@ -2,7 +2,9 @@
   .details{
     margin:0;
     &__summary{
+
       //padding: $details-padding gesso-spacing(xl) $details-padding $details-padding;
+      padding-right: rem(gesso-spacing(xl));
       text-transform: inherit;
       white-space:normal;
     }
@@ -22,7 +24,6 @@
     font-family:gesso-font-family(primary);
     font-size:rem(gesso-font-size(2));
     font-weight:400;
-    padding-right:1.5rem;
     text-decoration:none;
     text-transform: inherit;
     width:100%;

source/_patterns/04-components/date/_date.scss

 .uw-date {
-  width: 100%
+  width: 100%;
+// On node page make the date width auto
+// On phone make date touch left
+  .node--type-uw-ct-event &,
+  .node--type-uw-ct-blog &,
+  .node--type-uw-ct-news-item &{
+    width:auto;
+    @include large {
+      margin-left:inherit;
+    }
+  }
 }
 
 .uw-date-details{
+  background-color: gesso-brand(org-default, uw-gold, 'primary');
   box-sizing: border-box;
+
   .uw-date {
-    background-color: gesso-brand(org-default,uw-black,'primary');
+    background-color: gesso-brand(org-default, uw-gold,'primary');
     box-sizing: border-box;
     display:block;
     padding: rem(gesso-spacing(xs))  rem(gesso-spacing(sm)) ;
@@ -16,13 +28,13 @@
   .uw-date{
     background:inherit;
   }
-  @include svg-background(mobile-arrow-down-y);
-  background-color: gesso-brand(org-default,uw-black,'primary');
+  @include svg-background(mobile-arrow-down);
+  background-color: gesso-brand(org-default, uw-gold,'primary');
   background-position: right 1rem center; // LTR
   background-repeat: no-repeat;
   background-size: rem(13px);
   box-sizing: border-box;
-  color: gesso-brand(org-default,uw-gold,'primary');
+  color: gesso-brand(org-default,uw-black,'primary');
   cursor: pointer;
   display: block;
   padding:0;
@@ -30,6 +42,6 @@
     background-position: right 0.5rem center; // LTR
   }
   [open] > & {
-    @include svg-background(mobile-arrow-up-y);
+    @include svg-background(mobile-arrow-up);
   }
 }