{"version":3,"file":"ArticleHero-vue.js?v=59069fdff18e93b6c47a","mappings":"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","sources":["webpack://ratandboa/./src/components/journal/top-level/ArticleHero.vue","webpack://ratandboa/./src/components/journal/top-level/ArticleHero.vue?aeef"],"sourcesContent":["<template>\n  <div\n    class=\"article-hero\"\n    :class=\"classes\"\n    :style=\"{\n      '--backgroundImageSmall': `url(${images?.smallMedia})`,\n      '--backgroundImageMedium': `url(${images?.mediumMedia})`,\n      '--backgroundImageLarge': `url(${images?.largeMedia})`,\n    }\"\n  >\n    <template v-if=\"videoUrl && !lowPower\">\n      <Media\n        :sources=\"[\n          {\n            url: videoUrl,\n          },\n        ]\"\n        cover\n        class=\"media\"\n        @lowPower=\"lowPower = true\"\n      />\n    </template>\n    <div class=\"copy\" :class=\"copyClasses\">\n      <div v-if=\"type\" class=\"type\">{{ type }}</div>\n      <h1 class=\"heading\">\n        <template v-if=\"heading\">{{ heading }}</template>\n        <template v-else><slot name=\"heading\" /></template>\n      </h1>\n      <div v-if=\"subheading\" class=\"subheading\">{{ subheading }}</div>\n      <div class=\"button-container\">\n        <Button\n          v-if=\"linkButton\"\n          theme=\"white\"\n          class=\"linkButton\"\n          tag=\"a\"\n          :href=\"link\"\n        >\n          {{ linkButton }}\n        </Button>\n      </div>\n    </div>\n  </div>\n</template>\n\n<script>\nimport Button from \"@/components/Button.vue\";\nimport Media from \"@/components/Media.vue\";\nexport default {\n  name: \"ArticleHero\",\n  components: {\n    Button,\n    Media,\n  },\n  props: {\n    heading: {\n      type: String,\n      default: null,\n    },\n    subheading: {\n      type: String,\n      default: null,\n    },\n    type: {\n      type: String,\n      default: null,\n    },\n    images: {\n      type: Object,\n      default: null,\n    },\n    heroBackgroundPostitionTop: {\n      type: Boolean,\n      default: false,\n    },\n    centerTextWithSpanItalic: {\n      type: Boolean,\n      default: false,\n    },\n    linkButton: {\n      type: String,\n      default: null,\n    },\n    link: {\n      type: String,\n      default: null,\n    },\n    textLeftAlign: {\n      type: Boolean,\n      default: false,\n    },\n    styleSeries: {\n      type: Boolean,\n      default: false,\n    },\n    videoMobile: {\n      type: Boolean,\n      default: false,\n    },\n    videoUrl: {\n      type: String,\n      default: null,\n    },\n    lowPowerImages: {\n      type: Object,\n      default: () => {},\n    },\n  },\n  data() {\n    return {\n      lowPower: false,\n    };\n  },\n  computed: {\n    backgroundImages() {\n      if (this.lowPower) {\n        return this.lowPowerImages;\n      }\n\n      return this.images;\n    },\n    classes() {\n      return {\n        \"article-hero--heroBackgroundPostitionTop\":\n          this.heroBackgroundPostitionTop,\n        \"article-hero--videoMobile\": this.videoMobile,\n        \"copy--center-text-with--span-italic\": this.centerTextWithSpanItalic,\n        \"copy--text-left-align\": this.textLeftAlign,\n      };\n    },\n    copyClasses() {\n      return {\n        \"copy--center-text-with--span-italic\": this.centerTextWithSpanItalic,\n        \"copy--text-left-align\": this.textLeftAlign,\n        \"copy--style-series\": this.styleSeries,\n      };\n    },\n  },\n};\n</script>\n\n<style lang=\"scss\" scoped>\n.article-hero {\n  position: relative;\n  height: 70vh;\n  overflow: hidden;\n  background-image: var(--backgroundImageSmall);\n  background-repeat: no-repeat;\n  background-size: cover;\n  background-position: center center;\n\n  @include respond-above(sm) {\n    background-image: var(--backgroundImageMedium);\n  }\n\n  @include respond-above(md) {\n    height: 85vh;\n    background-image: var(--backgroundImageLarge);\n  }\n\n  &::after {\n    content: \"\";\n    background: linear-gradient(\n      180deg,\n      rgba(89, 89, 89, 0) 0%,\n      rgba(1, 1, 1, 0.6) 100%\n    );\n    position: absolute;\n    left: 0;\n    right: 0;\n    bottom: 0;\n    height: 75%;\n  }\n\n  &--heroBackgroundPostitionTop {\n    background-position: top center;\n  }\n  &--videoMobile {\n    height: auto;\n  }\n}\n.type {\n  color: $color-white;\n  @include t__editorial-headline-10;\n\n  @include respond-above(md) {\n    @include t__editorial-headline-20;\n  }\n}\n\n.subheading {\n  color: $color-white;\n  @include t__editorial-headline-10;\n\n  @include respond-above(md) {\n    @include t__editorial-headline-20;\n  }\n}\n\n.copy {\n  width: 100%;\n  position: absolute;\n  text-align: center;\n  z-index: 1;\n  top: auto;\n  bottom: 60px;\n  padding: 0 20px;\n  text-wrap: balance;\n\n  @include respond-above(md) {\n    bottom: 40px;\n    padding: 0;\n  }\n  &--center-text-with--span-italic {\n    top: 50%;\n    .heading {\n      @include t__editorial-headline-50;\n      @include respond-above(md) {\n        @include t__editorial-headline-80;\n      }\n      :slotted(p) {\n        @include respond-above(md) {\n          display: inline;\n        }\n      }\n      :slotted(span) {\n        text-wrap: pretty;\n        display: block;\n        font-style: italic;\n        @include respond-above(md) {\n          display: inline;\n        }\n      }\n    }\n    .subheading {\n      text-transform: none;\n      font-weight: 400;\n    }\n  }\n  &--text-left-align {\n    @include respond-above(md) {\n      text-align: left;\n    }\n    .heading {\n      font-size: 50px;\n      @include respond-above(md) {\n        @include t__editorial-headline-80;\n      }\n    }\n    .subheading {\n      text-transform: none;\n      @include respond-above(md) {\n        max-width: 1100px;\n        margin: 0 auto;\n      }\n    }\n    .button-container {\n      margin: 20px auto;\n      @include respond-above(md) {\n        max-width: 1100px;\n      }\n    }\n  }\n  &--style-series {\n    bottom: 60px;\n    .heading {\n      font-size: 36px;\n      margin: 0 auto 16px;\n      line-height: 100%;\n      @include respond-above(md) {\n        bottom: 80px;\n        @include t__editorial-headline-80;\n      }\n    }\n    .subheading {\n      text-transform: none;\n      font-size: 16px;\n      font-weight: 500;\n    }\n  }\n}\n\n.heading {\n  color: rgb(255, 255, 255);\n  @include t__editorial-headline-30;\n\n  text-transform: uppercase;\n\n  @include respond-above(md) {\n    margin: 0 auto;\n    max-width: 1100px;\n    @include t__editorial-headline-50;\n  }\n}\n\n:deep(.picture__wrapper) {\n  display: block;\n}\n\n.heading :slotted(span) {\n  display: block;\n}\n\n.linkButton {\n  background-color: $color-white;\n  color: $color-grey-dark;\n  font-family: $utility-font-family;\n  margin-top: 20px;\n  font-weight: 400;\n  font-size: 11px;\n  padding: 14px 28px;\n  border-radius: 4px;\n  @include respond-above(md) {\n    font-size: 13px;\n  }\n}\n\n.media {\n  height: 100%;\n}\n</style>\n","import { render } from \"./ArticleHero.vue?vue&type=template&id=6a754453&scoped=true\"\nimport script from \"./ArticleHero.vue?vue&type=script&lang=js\"\nexport * from \"./ArticleHero.vue?vue&type=script&lang=js\"\n\nimport \"./ArticleHero.vue?vue&type=style&index=0&id=6a754453&lang=scss&scoped=true\"\n\nimport exportComponent from \"/home/runner/work/rb-redev/rb-redev/node_modules/vue-loader/dist/exportHelper.js\"\nconst __exports__ = /*#__PURE__*/exportComponent(script, [['render',render],['__scopeId',\"data-v-6a754453\"]])\n\nexport default __exports__"],"names":["class","name","components","Button","Media","props","heading","type","String","default","subheading","images","Object","heroBackgroundPostitionTop","Boolean","centerTextWithSpanItalic","linkButton","link","textLeftAlign","styleSeries","videoMobile","videoUrl","lowPowerImages","data","lowPower","computed","backgroundImages","this","classes","copyClasses","_createElementBlock","_normalizeClass","$options","style","_normalizeStyle","$props","_$props$images","smallMedia","_$props$images2","mediumMedia","_$props$images3","largeMedia","$data","_createBlock","_component_Media","sources","cover","onLowPower","_cache","$event","_createElementVNode","_hoisted_1","_toDisplayString","_hoisted_2","_Fragment","key","_renderSlot","_ctx","$slots","_hoisted_3","_hoisted_4","_component_Button","theme","tag","href"],"sourceRoot":""}