diff --git a/packages/marko-web-theme-monorail/components/nodes/section-feed-content.marko b/packages/marko-web-theme-monorail/components/nodes/section-feed-content.marko index 441b4a09e..6dd08747d 100644 --- a/packages/marko-web-theme-monorail/components/nodes/section-feed-content.marko +++ b/packages/marko-web-theme-monorail/components/nodes/section-feed-content.marko @@ -1,4 +1,4 @@ -import { getAsObject, get } from "@parameter1/base-cms-object-path"; +import { getAsObject, getAsArray, get } from "@parameter1/base-cms-object-path"; import { buildImgixUrl } from "@parameter1/base-cms-image"; import defaultValue from "@parameter1/base-cms-marko-core/utils/default-value"; @@ -6,6 +6,8 @@ $ const { site, i18n } = out.global; $ const content = getAsObject(input, "node"); $ const { company } = content; +$ const contentType = defaultValue(content.type, 'article'); +$ const modifiers = [...getAsArray(input, "modifiers"), `${contentType}-content-type`] $ const withCompany = (company) ? defaultValue(input.withCompany, true) : false; $ const primaryImage = getAsObject(content, "primaryImage"); $ const primarySection = getAsObject(content, "primarySection"); @@ -29,7 +31,7 @@ $ const lazyload = defaultValue(input.lazyload, true); Keys are content types (all lowercase), values are the field to use when available on that type. **/ $ const linkOffsite = getAsObject(site, "config.linkOffsite"); -$ const linkField = get(linkOffsite, get(content, "type")); +$ const linkField = get(linkOffsite, contentType); $ const linkTarget = linkField && get(content, linkField) ? defaultValue(get(linkOffsite, "target"), "") : ""; $ const imageOptions = { @@ -48,7 +50,7 @@ $ const mobileImageOptions = { $ const blockName = "section-feed-content-node"; - + diff --git a/packages/marko-web-theme-monorail/scss/components/blocks/_section-feed.scss b/packages/marko-web-theme-monorail/scss/components/blocks/_section-feed.scss index 78b103a01..619c23108 100644 --- a/packages/marko-web-theme-monorail/scss/components/blocks/_section-feed.scss +++ b/packages/marko-web-theme-monorail/scss/components/blocks/_section-feed.scss @@ -120,6 +120,26 @@ } } } + &--video-content-type { + #{ $self } { + &__image-wrapper { + position: relative; + &::after { + position: absolute; + top: 50%; + left: 50%; + width: 50px; + height: 50px; + content: ""; + background-image: url("data:image/png;base64,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"); + filter: brightness(0) invert(1) drop-shadow(2px 2px 2px rgba(0, 0, 0, .5)); + background-size: contain; + opacity: .6; + transform: translate(-50%, -50%); + } + } + } + } } .node-list {