{"version":3,"sources":["webpack:///./src/components/Modal/VModal.vue?0825","webpack:///src/components/Modal/VModal.vue","webpack:///./src/components/Modal/VModal.vue?59be","webpack:///./src/components/Modal/VModal.vue?fd7c","webpack:///./src/components/Modal/VModal.vue?b138"],"names":["render","_vm","this","_h","$createElement","_c","_self","attrs","staticClass","on","close","_t","_v","staticRenderFns","methods","$emit","component"],"mappings":"gJAAA,IAAIA,EAAS,WAAa,IAAIC,EAAIC,KAASC,EAAGF,EAAIG,eAAmBC,EAAGJ,EAAIK,MAAMD,IAAIF,EAAG,OAAOE,EAAG,aAAa,CAACE,MAAM,CAAC,KAAO,eAAe,CAACF,EAAG,MAAM,CAACG,YAAY,iBAAiBC,GAAG,CAAC,MAAQR,EAAIS,QAAQ,CAACL,EAAG,MAAM,CAACG,YAAY,QAAQD,MAAM,CAAC,KAAO,SAAS,kBAAkB,aAAa,mBAAmB,qBAAqB,CAACF,EAAG,SAAS,CAACG,YAAY,eAAeD,MAAM,CAAC,GAAK,eAAe,CAACN,EAAIU,GAAG,WAAW,GAAGN,EAAG,UAAU,CAACG,YAAY,aAAaD,MAAM,CAAC,GAAK,qBAAqB,CAACN,EAAIU,GAAG,SAAS,GAAGN,EAAG,SAAS,CAACG,YAAY,gBAAgB,CAACP,EAAIU,GAAG,SAAS,CAACN,EAAG,SAAS,CAACG,YAAY,gBAAgBD,MAAM,CAAC,KAAO,SAAS,aAAa,eAAeE,GAAG,CAAC,MAAQR,EAAIS,QAAQ,CAACL,EAAG,MAAM,CAACG,YAAY,iBAAiB,CAACP,EAAIW,GAAG,QAAQP,EAAG,MAAM,CAACG,YAAY,kBAAkB,CAACH,EAAG,MAAM,CAACG,YAAY,QAAQD,MAAM,CAAC,IAAM,EAAQ,QAAqC,IAAM,aAAa,QAAU,iBAAiB,UACn5BM,EAAkB,GC0CtB,GACEC,QAAS,CACPJ,MADJ,WAEMR,KAAKa,MAAM,YC9C8U,I,wBCQ3VC,EAAY,eACd,EACAhB,EACAa,GACA,EACA,KACA,WACA,MAIa,aAAAG,E,2CCnBf","file":"js/chunk-1552b73e.8ef58df5.js","sourcesContent":["var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('transition',{attrs:{\"name\":\"modal-fade\"}},[_c('div',{staticClass:\"modal-backdrop\",on:{\"click\":_vm.close}},[_c('div',{staticClass:\"modal\",attrs:{\"role\":\"dialog\",\"aria-labelledby\":\"modalTitle\",\"aria-describedby\":\"modalDescription\"}},[_c('header',{staticClass:\"modal-header\",attrs:{\"id\":\"modalTitle\"}},[_vm._t(\"header\")],2),_c('section',{staticClass:\"modal-body\",attrs:{\"id\":\"modalDescription\"}},[_vm._t(\"body\")],2),_c('footer',{staticClass:\"modal-footer\"},[_vm._t(\"footer\",[_c('button',{staticClass:\"button__modal\",attrs:{\"type\":\"button\",\"aria-label\":\"Close modal\"},on:{\"click\":_vm.close}},[_c('div',{staticClass:\"button__label\"},[_vm._v(\"OK\")]),_c('div',{staticClass:\"button__circle\"},[_c('img',{staticClass:\"arrow\",attrs:{\"src\":require(\"../../assets/icons/arrow-next.svg\"),\"alt\":\"Next arrow\",\"loading\":\"lazy\"}})])])])],2)])])])}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\n  <transition name=\"modal-fade\">\n    <div class=\"modal-backdrop\" @click=\"close\">\n      <div\n        class=\"modal\"\n        role=\"dialog\"\n        aria-labelledby=\"modalTitle\"\n        aria-describedby=\"modalDescription\"\n      >\n        <header class=\"modal-header\" id=\"modalTitle\">\n          <slot name=\"header\">\n          </slot>\n        </header>\n        <section class=\"modal-body\" id=\"modalDescription\">\n          <slot name=\"body\">\n          </slot>\n        </section>\n        <footer class=\"modal-footer\">\n          <slot name=\"footer\">\n            <button\n              type=\"button\"\n              class=\"button__modal\"\n              @click=\"close\"\n              aria-label=\"Close modal\"\n            >\n              <div class=\"button__label\">OK</div>\n              <div class=\"button__circle\">\n                <img\n                  src=\"../../assets/icons/arrow-next.svg\"\n                  class=\"arrow\"\n                  alt=\"Next arrow\"\n                  loading=\"lazy\"\n                />\n              </div>\n            </button>\n          </slot>\n        </footer>\n      </div>\n    </div>\n  </transition>\n</template>\n\n<script>\nexport default {\n  methods: {\n    close() {\n      this.$emit(\"close\");\n    }\n  }\n};\n</script>\n\n<style lang=\"scss\" scoped>\n.modal-fade-enter,\n.modal-fade-leave-active {\n  opacity: 0;\n}\n\n.modal-fade-enter-active,\n.modal-fade-leave-active {\n  transition: opacity 0.5s ease;\n}\n\n.modal-backdrop {\n  position: fixed;\n  top: 0;\n  bottom: 0;\n  left: 0;\n  right: 0;\n  background: rgba(0, 0, 0, 0.54);\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  z-index: 1999;\n  &:hover {\n    cursor: pointer;\n  }\n}\n\n.modal {\n  z-index: 2000;\n  background: rgba(22, 22, 22, 0.65);\n  box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.25);\n  backdrop-filter: blur(34px);\n  border-radius: 10px;\n  display: flex;\n  flex-direction: column;\n  padding: 40px 20px;\n  width: calc(100% - 20px);\n  max-width: 500px;\n  @include for-tablet-portrait-up {\n    padding: 40px 30px;\n  }\n  @include for-tablet-landscape-up {\n    padding: 50px 25px;\n    max-width: 550px;\n  }\n  @include for-desktop-up {\n    padding: 50px 40px;\n    max-width: 580px;\n  }\n  &-header,\n  &-footer {\n    display: flex;\n  }\n  &-header {\n    color: var(--white-color);\n    justify-content: center;\n    position: relative;\n    // text-decoration: underline;\n    @include P2();\n    @include for-tablet-portrait-up {\n      @include P1();\n    }\n    @include for-tablet-landscape-up {\n      @include H4();\n    }\n    @include for-desktop-up {\n      @include H2();\n    }\n    &::after {\n      display: block;\n      position: absolute;\n      top: 30px;\n      left: 0;\n      right: 0;\n      width: 60px;\n      height: 3px;\n      border-radius: 4px;\n      margin-left: auto;\n      margin-right: auto;\n      content: \"\";\n      background: $dark-blue-color;\n      box-shadow: 0px 1px 4px rgba(14, 129, 232, 0.678);\n      transition: width 0.3s ease-out;\n      @include for-tablet-portrait-up {\n        width: 80px;\n      }\n      @include for-tablet-landscape-up {\n        top: 40px;\n      }\n      @include for-desktop-up {\n        top: 60px;\n      }\n    }\n  }\n  &-footer {\n    justify-content: center;\n  }\n  &-body {\n    padding-top: 54px;\n    padding-bottom: 60px;\n    justify-content: center;\n    color: var(--white-color);\n    @include P4();\n    text-align: center;\n    @include for-tablet-portrait-up {\n      padding-top: 58px;\n      padding-bottom: 52px;\n    }\n    @include for-tablet-landscape-up {\n      @include P2();\n      padding-top: 60px;\n      padding-bottom: 42px;\n    }\n    @include for-desktop-up {\n      @include P2();\n      padding-top: 60px;\n      padding-bottom: 61px;\n    }\n  }\n}\n\n.button__modal {\n  @include modal__btn-primary();\n  .button__circle {\n    @include form-btn__circle();\n    background: var(--white-color);\n  }\n  .button__label {\n    display: flex;\n    width: calc(100% - 32px);\n    justify-content: center;\n    text-align: center;\n    @include for-tablet-portrait-up {\n      width: calc(100% - 36px);\n    }\n    @include for-tablet-landscape-up {\n      width: calc(100% - 40px);\n    }\n  }\n}\n</style>\n","import mod from \"-!../../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../../node_modules/thread-loader/dist/cjs.js!../../../node_modules/babel-loader/lib/index.js!../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./VModal.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../../node_modules/thread-loader/dist/cjs.js!../../../node_modules/babel-loader/lib/index.js!../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./VModal.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./VModal.vue?vue&type=template&id=39228d98&scoped=true&\"\nimport script from \"./VModal.vue?vue&type=script&lang=js&\"\nexport * from \"./VModal.vue?vue&type=script&lang=js&\"\nimport style0 from \"./VModal.vue?vue&type=style&index=0&id=39228d98&lang=scss&scoped=true&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  \"39228d98\",\n  null\n  \n)\n\nexport default component.exports","export * from \"-!../../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--8-oneOf-1-0!../../../node_modules/css-loader/dist/cjs.js??ref--8-oneOf-1-1!../../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../../node_modules/postcss-loader/src/index.js??ref--8-oneOf-1-2!../../../node_modules/sass-loader/dist/cjs.js??ref--8-oneOf-1-3!../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./VModal.vue?vue&type=style&index=0&id=39228d98&lang=scss&scoped=true&\""],"sourceRoot":""}