sfc-utils 1.4.34 → 1.4.35

package/components/byline.mjs

@@ -7,7 +7,7 @@ import {
   moddateString,
 } from './helpers/datehelpers.mjs'
 
-const Byline = ({ meta, updateNote }) => {
+const Byline = ({ meta, updateNote, updatePrefix }) => {
   const {
     PROJECT: { AUTHORS, ISO_MODDATE, ISO_PUBDATE },
   } = meta
@@ -61,7 +61,12 @@ const Byline = ({ meta, updateNote }) => {
                 dateTime={ISO_MODDATE}
                 itemProp="dateModified"
               >
-                Updated {moddateString}
+                {updatePrefix ? (
+                  <>{updatePrefix}{' '}</>
+                ) : (
+                  <>Updated{' '}</>
+                )}
+                {moddateString}
               </time>
             </>
           )}

package/components/topper2.mjs

@@ -277,6 +277,7 @@ const Topper2 = ({ settings, wcmData, mods }) => {
             wcm={Image}
             alt={Image_Alt}
             wcmData={wcmData}
+            containerCssList={[imageStyles.cContainerFullscreen]}
             imageCssList={[imageStyles.cImgFullscreen]}
           />
         )

package/example/package-lock.json

@@ -27,7 +27,7 @@
         "react": "16.14.0",
         "react-dom": "16.14.0",
         "react-headroom": "3.1.1",
-        "react-helmet": "6.1.0",
+        "react-helmet": "^6.1.0",
         "react-lazyload": "3.2.0",
         "require-directory": "2.1.1",
         "swr": "^0.5.6"

package/example/package.json

@@ -22,7 +22,7 @@
     "react": "16.14.0",
     "react-dom": "16.14.0",
     "react-headroom": "3.1.1",
-    "react-helmet": "6.1.0",
+    "react-helmet": "^6.1.0",
     "react-lazyload": "3.2.0",
     "require-directory": "2.1.1",
     "swr": "^0.5.6"

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "sfc-utils",
-  "version": "1.4.34",
+  "version": "1.4.35",
   "author": "ewagstaff <evanjwagstaff@gmail.com>",
   "dependencies": {
     "archieml": "^0.4.2",
@@ -10,6 +10,7 @@
     "htmlparser2": "4.1.0",
     "opn": "^6.0.0",
     "prop-types": "^15.8.1",
+    "react-helmet": "^6.1.0",
     "react-transition-group": "^4.4.5",
     "write": "^2.0.0"
   }

package/styles/modules/topper2.module.less

@@ -9,7 +9,12 @@
 
 .topperContainerFullScreen {
   max-width: 100%;
+  height: calc(100vh - 37px);
   position: relative;
+
+  @media @tablet {
+    height: auto;
+  }
 }
 
 .topperContainerSlideshowFullScreen {
@@ -25,6 +30,7 @@
 .topperContainerSideBySide {
   display: flex;
   align-items: center;
+  justify-content: center;
   background: var(--container-background-color);
 
   @media (max-width: @lg) {
@@ -57,11 +63,14 @@
 }
 
 .imageFullScreen {
-  top: 0 !important;
+  position: absolute;
   width: 100%;
 
-  @media @mobile {
+  @media @tablet {
+    margin: 0;
+    padding: 0;
     height: 100%;
+    position: static;
   }
 }
 
@@ -314,7 +323,11 @@
 }
 
 .dropshadow {
-  text-shadow: 1px 1px 10px rgba(0, 0, 0, .4)
+  text-shadow: 1px 1px 10px rgba(0, 0, 0, .4);
+
+  @media @tablet {
+    text-shadow: none;
+  }
 }
 
 .hideWhenTablet {

package/styles/modules/topperimage.module.less

@@ -70,6 +70,14 @@
   padding-bottom: var(--img-bottom-padding-ratio);
 }
 
+.c-container-fullscreen {
+  padding-bottom: 100vh;
+
+  @media @tablet {
+    padding-bottom: var(--img-bottom-padding-ratio);
+  }
+}
+
 .c-container-small-visual {
   height: calc(var(--img-bottom-padding-fraction)*var(--small-visual-max-width));
   max-width: var(--small-visual-max-width);
@@ -108,6 +116,11 @@
   height: calc(100vh - 37px);
 
   @media @tablet {
+    display: block;
+    position: absolute;
+    margin: 0;
+    padding: 0;
+    width: 100%;
     height: auto;
   }
 }
@@ -134,7 +147,6 @@
 }
 
 .c-img-side-by-side {
-  object-fit: cover;
   width: 50vw;
   height: var(--img-height-viewport);