Merge pull request #361 from ASUWebPlatforms/ws2-2-8-0-theme-compile

ws2 theme compilation
ASUWebPlatforms · Dec 12, 2022 · ddb0087 · ddb0087
2 parents fc8061c + 0be479b
commit ddb0087
Show file tree

Hide file tree

Showing 9 changed files with 79 additions and 10 deletions.
diff --git a/assets/css/renovation.style.css b/assets/css/renovation.style.css
diff --git a/src/sass/design-tokens/_variables.scss b/src/sass/design-tokens/_variables.scss
@@ -1,6 +1,6 @@
 
 // Do not edit directly
-// Generated on Thu, 12 May 2022 11:42:45 GMT
+// Generated on Mon, 12 Dec 2022 22:53:00 GMT
 
 $uds-asset-font-icon-name: "FontAwesome";
 $uds-asset-font-icon-ttf: "assets/fontawesome/webfonts/fa-regular-400.ttf";

diff --git a/src/sass/extends/_anchor-menu.scss b/src/sass/extends/_anchor-menu.scss
@@ -25,6 +25,8 @@
 
     svg {
       margin-left: $uds-size-spacing-1;
+      margin-right: $uds-size-spacing-1;
+      margin-top: 0.35rem;
       transform: rotate(0deg);
     }
 
@@ -47,6 +49,7 @@
   .nav-link {
     color: $uds-color-base-gray-7;
     padding: $uds-size-spacing-3 0;
+    padding-left: 0.5rem;
     text-align: start;
     font-weight: 400;
 
@@ -67,6 +70,7 @@
     svg {
       width: 2rem !important;
       margin-right: $uds-size-spacing-1;
+      margin-left: -0.5rem;
     }
   }
 }

diff --git a/src/sass/extends/_backgrounds.scss b/src/sass/extends/_backgrounds.scss
@@ -44,10 +44,6 @@
   max-width: 1920px;
 }
 
-.center-container {
-  margin: 0 auto;
-}
-
 .content-description-container {
   background-color: $uds-color-base-gray-1;
   width: 100%;

diff --git a/src/sass/extends/_breadcrumb.scss b/src/sass/extends/_breadcrumb.scss
@@ -6,3 +6,9 @@
     }
   }
 }
+// WS2-1036 and UDS-1129 hide breadcrumb on mobile
+@media screen and (max-width: $uds-breakpoint-sm) {
+  .breadcrumb {
+    display: none;
+  }
+}
diff --git a/src/sass/extends/_cards.scss b/src/sass/extends/_cards.scss
@@ -548,6 +548,11 @@ Cards - Table of Contents
       background-color: $uds-color-base-gray-2;
     }
 
+    h3 {
+      font-size: 1.25rem;
+    }
+
+    h3,
     h4,
     h5 {
       margin: 0;

diff --git a/src/sass/extends/_heroes.scss b/src/sass/extends/_heroes.scss
@@ -124,7 +124,7 @@ div[class^='uds-hero'] {
       .btn {
         white-space: normal;
         &:last-child {
-        margin-top: $uds-size-spacing-1;
+          margin-top: $uds-size-spacing-1;
 
           & + .btn {
             margin-left: 0;
@@ -142,6 +142,11 @@ div[class^='uds-hero'] {
   &.hide-content .content {
     display: none;
   }
+
+  &.uds-video-hero video,
+  &.uds-video-hero .video-hero-controls {
+    display: none;
+  }
 }
 
 div.uds-hero-sm,
@@ -306,6 +311,60 @@ div.uds-hero-lg {
     .btn-row {
       max-width: calc(940px - 34%);
     }
+
+    &.uds-video-hero {
+      .hero {
+        display: none;
+      }
+
+      &.uds-video-hero video {
+        display: block;
+        grid-row: 1 / span 6;
+        grid-column: 1 / span 3;
+        z-index: 30;
+        height: 100%;
+        min-height: 100%;
+        position: absolute;
+        top: 0;
+        left: 50%;
+        transform: translateX(-50%);
+        width: 100%;
+        object-fit: cover;
+      }
+
+      .video-hero-controls {
+        display: block;
+        position: relative;
+        z-index: 40;
+        grid-column: 2;
+        grid-row: 6;
+        align-self: end;
+        justify-self: flex-end;
+        top: -3rem;
+
+        .btn-circle-large {
+          width: 56px !important;
+          height: 56px !important;
+          font-size: 16px !important;
+          opacity: 0.3 !important;
+
+          &:hover {
+            opacity: 1 !important;
+            cursor: pointer;
+            transform: none;
+          }
+
+          .svg-inline--fa.fa-w-14 {
+            margin-left: 0 !important;
+          }
+        }
+
+        #playHeroVid {
+          // The play button starts as hidden as the video autoplays upoon page load.
+          display: none;
+        }
+      }
+    }
   }
 }
 

diff --git a/src/sass/extends/_sidebar.scss b/src/sass/extends/_sidebar.scss
@@ -104,7 +104,7 @@ $nav-item-min-height: 3rem;
       width: 100%;
       background-color: $uds-color-base-gold;
       text-decoration: none;
-      bottom: -0.7rem;
+      bottom: -0.76rem;
       left: 50%;
       transform: translateX(-50%);
     }

diff --git a/src/sass/extends/_tables.scss b/src/sass/extends/_tables.scss
@@ -11,6 +11,7 @@
       font-size: 1rem;
       text-align: left;
       padding: 1rem;
+      max-width: 700px;
     }
 
     tr {
@@ -38,8 +39,6 @@
           background-color: white;
 
           p {
-            display: flex;
-            align-items: center;
             margin-bottom: 0;
           }
         }
-Original file line number
+Diff line change
@@ Expand Up / @@ -548,6 +548,11 @@ Cards - Table of Contents @@
           background-color: $uds-color-base-gray-2;
         }
+        h3 {
+          font-size: 1.25rem;
+        }
+        h3,
         h4,
         h5 {
           margin: 0;
@@ Expand Down @@