8.1.9

- D8CORE-3247: Publications styles  (#66) (a487064)
- Update composer.json for stanford_basic (#65) (586fabc)
- D8CORE-3528: updating class name to match reality (#64) (a49c69d)
- D8CORE-3499: fixing the link icons (#61) (a3a1119)
- D8CORE-3246 D8CORE-3487: fixing the external link icons (#63) (414b076)
- D8CORE-3248: publication set up for SOE (#59) (af11eda)

CHANGELOG.md

@@ -1,5 +1,16 @@
 # SOE Basic Sub-Theme
 
+8.x-1.9
+--------------------------------------------------------------------------------
+_Release Date: 2021-03-05_
+
+- D8CORE-3247: Publications styles  (#66) (a487064)
+- Update composer.json for stanford_basic (#65) (586fabc)
+- D8CORE-3528: updating class name to match reality (#64) (a49c69d)
+- D8CORE-3499: fixing the link icons (#61) (a3a1119)
+- D8CORE-3246 D8CORE-3487: fixing the external link icons (#63) (414b076)
+- D8CORE-3248: publication set up for SOE (#59) (af11eda)
+
 8.x-1.8
 --------------------------------------------------------------------------------
 _Release Date: 2021-02-08_

composer.json

@@ -7,6 +7,6 @@
   "license": "GPL-2.0+",
   "minimum-stability": "dev",
   "require": {
-    "su-sws/stanford_basic": "^8.4"
+    "su-sws/stanford_basic": "dev-8.x-5.x"
   }
 }

soe_basic.info.yml

@@ -2,7 +2,7 @@ name: SOE Basic
 type: theme
 description: 'SOE Branding Subtheme.'
 package: Stanford
-version: 8.x-1.8
+version: 8.x-1.9
 core_version_requirement: ^8 || ^9
 
 # Defines the base theme

src/scss/theme/_background-classes.scss

@@ -75,21 +75,26 @@
   &.section-event-list--title,
   &.section-stanford-news-views-header,
   &.su-people-header,
-  &.section-header {
+  &.section-header,
+  &.section-stanford-pubs-views-header {
     @include modular-spacing('padding', 6 null 6 null);
 
     .heading-h1 {
       margin: 0;
     }
-
   }
 }
 
-
 // Person node has a background color
 .person {
   @include gradient--solid-teal;
 
   color: $su-color-white;
 }
 
+// Publications background header color
+.section-editorial-content {
+  .node-stanford-page-title {
+    margin-top: 0;
+  }
+}

src/scss/theme/_news.scss

@@ -67,6 +67,7 @@
 
       .su-link {
         @include soe--link;
+        @include soe-link-icon(soe_arrow, 1.8rem, 0);
 
         display: inline;
         font-weight: $su-font-bold;
@@ -83,12 +84,15 @@
         }
 
         &::after {
-          transform: none;
-          background: url("#{$soe-image-path}/soe_arrow.svg") no-repeat 0 0;
-          background-size: 100%;
-          height: 1.8rem;
-          width: 1.8rem;
-          -webkit-mask: none;
+          background-color: $su-color-black;
+        }
+
+        &.su-link--external {
+          @include link-icon(arrow-up-right, 1.3rem, topright);
+
+          &::after {
+            background-color: $su-color-black;
+          }
         }
       }
     }

src/scss/theme/_publications.scss

@@ -0,0 +1,163 @@
+@charset 'UTF-8';
+
+
+.publication {
+  .main-region {
+
+    .su-publication-cta {
+      .su-button {
+        @include soe-button--turquoise;
+
+        &.su-link--external {
+          &::after {
+            background-color: $su-color-black;
+          }
+        }
+
+        &:hover {
+          color: $su-color-white;
+
+          &::after {
+            background-color: $su-color-white;
+          }
+        }
+      }
+    }
+
+  }
+
+  // More publications cards on the publication node page.
+  .su-card__contents {
+    h2 {
+      > a:not(.su-link--external) {
+        @include soe--link;
+        @include soe-link-icon(soe_arrow, 1.8rem, 0);
+
+        display: inline;
+        font-weight: $su-font-bold;
+        margin: 0;
+        animation: none;
+
+        &::after {
+          background-color: $su-color-black;
+          color: $su-color-black;
+          transform: none;
+        }
+
+        &:hover,
+        &:focus {
+          @include soe--link-hover;
+
+          color: $su-color-black;
+          text-decoration: none;
+
+          &::after {
+            transform: none;
+          }
+        }
+
+        &::after {
+          background-color: $su-color-black;
+        }
+      }
+
+      > a {
+        &.su-link--external {
+          @include soe--link;
+          @include link-icon(arrow-up-right, 1.3rem, topright);
+
+          &::after {
+            background-color: $su-color-black;
+          }
+
+          &:hover,
+          &:focus {
+            @include soe--link-hover;
+
+            color: $su-color-black;
+            text-decoration: none;
+
+            &::after {
+              transform: none;
+            }
+          }
+        }
+      }
+    }
+  }
+}
+
+// Publications list view
+.stanford-publications {
+  &.view {
+    a:not([class*="button"]) {
+      @include soe--link;
+
+      display: inline;
+      font-weight: $su-font-bold;
+      margin: 0;
+      animation: none;
+      color: $su-color-black;
+
+      &:hover,
+      &:focus {
+        @include soe--link-hover;
+
+        text-decoration: none;
+
+        &::after {
+          transform: none;
+        }
+      }
+
+      &::after {
+        background-color: $su-color-black;
+      }
+
+      &.su-link--external {
+        @include link-icon(arrow-up-right, 1.3rem, 0);
+
+        &::after {
+          background-color: $su-color-black;
+        }
+      }
+    }
+
+    // Load more button.
+    .js-pager__items {
+      .pager__item {
+        .button {
+          @include button-big;
+          @include box-shadow('shallow');
+
+          background-color: $soe-color-turquoise;
+          color: $soe-color-black;
+
+          &:hover {
+            background-color: $su-color-black;
+            color: $su-color-white;
+          }
+        }
+      }
+    }
+
+  }
+}
+
+// Filter list view
+// Getting the banner aligned full width
+.publications-terms--filtered {
+  max-width: 100vw;
+  width: 100vw;
+  position: relative;
+  left: 50%;
+  right: 50%;
+  margin-left: -50vw;
+  margin-right: -50vw;
+
+  h1 {
+    @include centered-column;
+  }
+
+}
+

src/scss/theme/_super-footer.scss

@@ -1,6 +1,6 @@
 @charset "UTF-8";
 
-.block-soe-basic-config-pages-super-footer {
+.block-soe-basic-config-pages-stanford-super-footer {
   border-bottom: 1px solid $su-color-black-30;
 
   .flex-container {
@@ -10,6 +10,7 @@
   // Link styles.
   .su-super-footer__link {
 
+
     a {
       border: 0;
       color: $soe-color-black;

src/scss/theme/index.scss

@@ -22,4 +22,5 @@
 @import 'image-cta';
 @import 'news';
 @import 'people';
+@import 'publications';
 @import 'super-footer';

src/scss/utilities/mixins/_soe_link-icon.scss

@@ -0,0 +1,33 @@
+@charset "UTF-8";
+
+///
+/// Display SOE arrow icon after a link.
+///
+/// @name link-icon
+///
+/// @param {string} $icon  - Basename of link icon .svg file (without the .svg suffix).
+/// @param {string} $width  - Width of icon including unit, e.g. 0.75em, 24px.
+/// @param {string} $vertical  - Adjustment of vertical position of icon, e.g., '2px' moves icon up 2 pixels, '-0.3em' moves it down 0.3 em.
+///
+/// @group mixin
+@mixin soe-link-icon($icon, $width: 0.65em, $vertical: null) {
+  text-decoration: none;
+  @supports (mask-repeat: no-repeat) {
+    &::after {
+      @include margin(null 0.3em $vertical 0.4em);
+      @include size($width);
+      display: inline-block;
+      content: '';
+      mask: url("#{$soe-image-path}/soe_arrow.svg") no-repeat 0 0;
+      mask-size: contain;
+      background-color: color(link);
+    }
+
+    &:hover,
+    &:focus {
+      &::after {
+        background-color: color(link--hover);
+      }
+    }
+  }
+}

src/scss/utilities/mixins/index.scss

@@ -8,3 +8,4 @@
 @import 'gradients';
 @import 'buttons';
 @import 'links';
+@import 'soe_link-icon';