{"version":3,"file":"Header-0c4518a6.js","sources":["../../assets/img/mm-letter.svg","../../components/auth/Login.vue","../../components/auth/Recovery.vue","../../components/common/AuthSection.vue","../../components/bf/Marquesina.vue","../../components/common/Header.vue"],"sourcesContent":["export default \"__VITE_ASSET__92d1e75c__\"","<script setup lang=\"ts\">\nimport { Link, useForm } from \"@inertiajs/vue3\";\n\nimport Btn from \"@/components/ui/atoms/Btn.vue\";\nimport Input from \"@/components/ui/atoms/Input.vue\";\nimport Pill from \"@/components/ui/atoms/Pill.vue\";\nimport PillContainer from \"@/components/ui/atoms/PillContainer.vue\";\nimport { resolveUrl } from \"@/utils/urls\";\n\nconst form = useForm({\n  username: null,\n  password: null,\n});\n</script>\n\n<template>\n  <div class=\"login\">\n    <img class=\"login__brand\" src=\"@img/mm-letter.svg\" alt=\"Mastermind\" />\n    <h2 class=\"login__title\">ACCESO AL SISTEMA</h2>\n    <h3 class=\"login__subtitle\">Inicia sesión para empezar a aprender</h3>\n    <form @submit.prevent=\"form.post(resolveUrl('account_loging'))\">\n      <PillContainer :full-width=\"true\" no-padding>\n        <Input\n          v-model=\"form.username\"\n          type=\"email\"\n          placeholder=\"Email\"\n          required\n          size=\"medium\"\n          theme=\"dark-bold\"\n          shape=\"square\"\n          :class=\"[{ error: Object.keys(form.errors).length }]\"\n          high\n          full-width\n        />\n        <span v-if=\"form.errors.username\" class=\"error\">{{ form.errors.username }}</span>\n      </PillContainer>\n      <PillContainer full-width :class=\"'login__psw-container'\" no-padding>\n        <Input\n          v-model=\"form.password\"\n          required\n          type=\"password\"\n          placeholder=\"Contraseña\"\n          size=\"medium\"\n          theme=\"dark-bold\"\n          shape=\"square\"\n          :class=\"[{ error: Object.keys(form.errors).length }]\"\n          high\n          full-width\n        />\n        <Btn\n          tag=\"button\"\n          type=\"submit\"\n          theme=\"green-bold\"\n          shape=\"round\"\n          :class=\"['input-submit', { 'input-submit-loading': form.processing }]\"\n          full-width\n          :disabledç=\"form.processing\"\n        />\n        <span v-if=\"form.errors.password\" class=\"error\">{{ form.errors.password }}</span>\n      </PillContainer>\n\n      <PillContainer full-width v-if=\"form.errors['__all__']\" no-padding>\n        <Pill shape=\"square\" size=\"small\" :class=\"'error-message'\">\n          <div class=\"pico\" />\n          {{ form.errors[\"__all__\"] }}\n        </Pill>\n      </PillContainer>\n    </form>\n    <PillContainer full-width :class=\"['login__links']\" no-padding>\n      <a @click=\"$emit('recovery')\">Recuperar contraseña</a>\n      <Link :href=\"resolveUrl('subscription_show')\">¿Sin cuenta? Suscríbete ya</Link>\n    </PillContainer>\n  </div>\n</template>\n\n<style scoped lang=\"scss\">\n@use \"@/styles/settings/vars\";\n\n.login {\n  .pill-container {\n    margin-bottom: 4px;\n  }\n\n  &__brand {\n    margin: 24px 0;\n  }\n\n  &__title {\n    margin-bottom: 8px;\n  }\n\n  &__subtitle {\n    margin-top: 0;\n  }\n\n  &__links {\n    display: flex;\n    justify-content: space-between;\n    margin-top: 8px;\n\n    a {\n      cursor: pointer;\n      text-decoration: underline;\n    }\n  }\n\n  &__psw-container {\n    position: relative;\n  }\n}\n\n.button--plus {\n  margin-top: 16px;\n}\n\n.error {\n  color: vars.$kernel-violet;\n}\n</style>\n","<script setup lang=\"ts\">\nimport { Link, useForm } from \"@inertiajs/vue3\";\nimport axios from \"axios\";\nimport { ref } from \"vue\";\n\nimport Btn from \"@/components/ui/atoms/Btn.vue\";\nimport Input from \"@/components/ui/atoms/Input.vue\";\nimport PillContainer from \"@/components/ui/atoms/PillContainer.vue\";\nimport { resolveUrl } from \"@/utils/urls\";\n\nconst recoveryMessage = ref(false);\n\nconst recoverySubmit = () => {\n  form.processing = true;\n  axios\n    .post(resolveUrl(\"account_recovery\"), form.data())\n    .then((response) => {\n      form.processing = false;\n      if (response.data.success) {\n        form.reset();\n        recoveryMessage.value = true;\n      }\n    })\n    .catch((error) => {\n      form.processing = false;\n      form.errors = error.response.data.errors;\n    });\n};\n\nconst form = useForm({\n  email: null,\n});\n</script>\n\n<template>\n  <div class=\"recovery\" v-if=\"!recoveryMessage\">\n    <img class=\"recovery__brand\" src=\"@img/mm-letter.svg\" alt=\"Mastermind\" />\n    <h2 class=\"recovery__title\">PROBLEMAS DE ACCESO</h2>\n    <h3 class=\"recovery__subtitle\">Introduce tu email para acceder a su cuenta</h3>\n    <form @submit.prevent=\"recoverySubmit\">\n      <PillContainer full-width :class=\"'recovery__psw-container'\" no-padding>\n        <Input\n          v-model=\"form.email\"\n          required\n          type=\"email\"\n          placeholder=\"Email\"\n          size=\"medium\"\n          theme=\"dark-bold\"\n          shape=\"square\"\n          :class=\"[{ error: Object.keys(form.errors).length }]\"\n          high\n          full-width\n        />\n        <Btn\n          tag=\"button\"\n          type=\"submit\"\n          theme=\"green-bold\"\n          shape=\"round\"\n          :class=\"['input-submit', { 'input-submit-loading': form.processing }]\"\n          full-width\n          :disabled=\"form.processing\"\n        />\n        <span v-if=\"form.errors.email\" class=\"error\">{{ form.errors.email }}</span>\n      </PillContainer>\n    </form>\n    <PillContainer full-width :class=\"['recovery__links']\" no-padding>\n      <a @click=\"$emit('recovery')\">Entrar</a>\n      <Link href=\"/precios\">¿Sin cuenta? Suscríbete ya</Link>\n    </PillContainer>\n  </div>\n  <div class=\"recovery--message\" v-if=\"recoveryMessage\">\n    <img class=\"recovery__brand\" src=\"@img/mm-letter.svg\" alt=\"Mastermind\" />\n    <h2 class=\"recovery__title\">TRANQUI, YA VAMOS</h2>\n    <h3 class=\"recovery__subtitle\">\n      Revisa tu bandeja de entrada y spam, te hemos enviado un email con los pasos para\n      restablecer tu contraseña.\n    </h3>\n    <PillContainer full-width :class=\"['recovery__links']\" no-padding>\n      <a @click=\"$emit('recovery')\">Volver</a>\n    </PillContainer>\n  </div>\n</template>\n\n<style scoped lang=\"scss\">\n@use \"@/styles/settings/vars\";\n\n.recovery {\n  &__psw-container {\n    position: relative;\n  }\n\n  &__brand {\n    margin: 24px 0;\n  }\n\n  &__title {\n    margin-bottom: 8px;\n  }\n\n  &__subtitle {\n    margin-top: 0;\n  }\n\n  &__links {\n    display: flex;\n    justify-content: space-between;\n    margin-top: 8px;\n\n    a {\n      cursor: pointer;\n      text-decoration: underline;\n    }\n  }\n}\n</style>\n","<script setup lang=\"ts\">\nimport { defineProps, ref } from \"vue\";\n\nimport Login from \"@/components/auth/Login.vue\";\nimport Recovery from \"@/components/auth/Recovery.vue\";\nimport SocialLogin from \"@/components/auth/SocialLogin.vue\";\nimport Btn from \"@/components/ui/atoms/Btn.vue\";\nimport PillContainer from \"@/components/ui/atoms/PillContainer.vue\";\n\nconst showRecovery = ref(false);\n\ndefineProps({\n  visible: Boolean,\n});\n</script>\n\n<template>\n  <div :class=\"['side-box ', { 'side-box--visible': visible }]\">\n    <Transition :duration=\"{ enter: 240, leave: 240 }\">\n      <section class=\"side-box__section\" v-if=\"visible\">\n        <PillContainer tag=\"div\" on-right>\n          <Btn\n            tag=\"button\"\n            size=\"small\"\n            theme=\"dark-bold\"\n            shape=\"round\"\n            @click=\"$emit('closeSidebar')\"\n          >\n            Cerrar\n          </Btn>\n        </PillContainer>\n        <Recovery v-if=\"showRecovery\" @recovery=\"showRecovery = false\" />\n        <Login v-else @recovery=\"showRecovery = true\" />\n        <SocialLogin />\n      </section>\n    </Transition>\n  </div>\n</template>\n\n<style lang=\"scss\" scoped>\n@use \"@/styles/settings/vars\";\n\n.side-box {\n  position: fixed;\n  width: 520px;\n  right: -520px;\n  box-sizing: border-box;\n  background-color: vars.$iron;\n  bottom: 0;\n  top: 0;\n  padding: 0 8px;\n  z-index: 999;\n  transition: right 0.4s ease-in-out;\n\n  &__section {\n    color: vars.$off-white;\n    padding: 0.75rem;\n  }\n\n  &--visible {\n    right: -0;\n  }\n\n  .button {\n    margin-left: auto;\n  }\n}\n\n@media (max-width: 1024px) {\n  .side-box {\n    right: -100%;\n    width: 100%;\n\n    &--visible {\n      right: 0;\n    }\n  }\n}\n</style>\n","<script setup lang=\"ts\">\nconst bfMode = true;\nconsole.log(bfMode);\n</script>\n\n<template>\n  <div class=\"marquesina-container\" v-if=\"bfMode\">\n    <div class=\"pill pill--green-bold pill--medium marquesina\" />\n  </div>\n</template>\n\n<style scoped lang=\"scss\">\n.marquesina-container {\n  padding: 0;\n}\n\n.marquesina {\n  width: 100%;\n  height: calc(38px + 4px);\n  overflow: hidden;\n  background-image: url(\"@img/marquesina_bf.svg\");\n  background-repeat: repeat-x;\n  background-size: 1820px 20px;\n  background-position-y: center;\n  animation: moveImage 20s linear infinite;\n  padding: 1em;\n}\n\n@keyframes moveImage {\n  0% {\n    background-position-x: 0;\n  }\n\n  100% {\n    background-position-x: -1820px;\n  }\n}\n</style>\n","<script setup lang=\"ts\">\nimport { Link, usePage } from \"@inertiajs/vue3\";\nimport { defineEmits, ref } from \"vue\";\n\nimport Marquesina from \"@/components/bf/Marquesina.vue\";\nimport Btn from \"@/components/ui/atoms/Btn.vue\";\nimport { type InertiaSharedProps } from \"@/shared/types\";\nimport { resolveUrl } from \"@/utils/urls\";\n\nconst page = usePage<InertiaSharedProps>();\nconst user = ref(page.props.user);\nconst emit = defineEmits([\"openSidebar\", \"toggleMenu\"]);\n\ninterface Props {\n  expand?: boolean;\n}\n\nwithDefaults(defineProps<Props>(), {\n  expand: false,\n});\n\nconst mobileMenuOpen = ref(false);\nconst toggleMenu = () => {\n  mobileMenuOpen.value = !mobileMenuOpen.value;\n  emit(\"toggleMenu\");\n};\n\nconst openLogin = () => {\n  mobileMenuOpen.value = false;\n  emit(\"openSidebar\");\n};\n</script>\n\n<template>\n  <div>\n    <Marquesina />\n    <header class=\"header\">\n      <div class=\"header__container\">\n        <section :class=\"['header__menu', { container: !expand }]\">\n          <Link href=\"/\">\n            <img src=\"@img/logo.png\" alt=\"Mastermind\" class=\"header__logo\" />\n          </Link>\n          <nav class=\"header__desktop\">\n            <Btn\n              :class=\"{ active: page.component === 'Pricing' }\"\n              tag=\"a\"\n              :href=\"resolveUrl('subscription_show')\"\n              theme=\"transparent\"\n              size=\"medium\"\n              :high=\"true\"\n            >\n              suscripción\n            </Btn>\n            <Btn\n              v-if=\"false\"\n              :class=\"{ active: page.component === 'Packs' }\"\n              tag=\"a\"\n              :href=\"resolveUrl('pack_list')\"\n              theme=\"transparent\"\n              size=\"medium\"\n              :high=\"true\"\n            >\n              paquetes y cursos\n            </Btn>\n            <Btn\n              :class=\"{ active: page.component === 'Faqs' }\"\n              tag=\"a\"\n              href=\"/#preguntas\"\n              theme=\"transparent\"\n              size=\"medium\"\n              :high=\"true\"\n            >\n              FAQ\n            </Btn>\n            <Btn\n              tag=\"button\"\n              type=\"button\"\n              v-if=\"!user\"\n              theme=\"green-bold\"\n              size=\"medium\"\n              high\n              @click=\"$emit('openSidebar')\"\n            >\n              login\n            </Btn>\n            <div v-else>\n              <a\n                class=\"pill pill--clickable pill--medium pill--high pill--green-bold pill--square btn-action--generic\"\n                :href=\"resolveUrl('account_show')\"\n              >\n                Mi Cuenta\n              </a>\n            </div>\n          </nav>\n          <div class=\"header__mobile\" @click=\"toggleMenu\">\n            <Btn\n              tag=\"button\"\n              theme=\"green-bold\"\n              size=\"medium\"\n              :high=\"true\"\n              :class=\"['header__mobile__menu']\"\n              shape=\"square\"\n            />\n          </div>\n        </section>\n      </div>\n    </header>\n    <Transition name=\"fade\">\n      <div class=\"mobile-menu\" v-if=\"mobileMenuOpen\">\n        <div class=\"header__mobile\" @click=\"toggleMenu\">\n          <Btn\n            tag=\"button\"\n            theme=\"green-bold\"\n            size=\"medium\"\n            :high=\"true\"\n            :class=\"['header__mobile__menu', 'header__mobile__menu--open']\"\n            shape=\"square\"\n          />\n        </div>\n        <ul class=\"mobile-menu__links\">\n          <li>\n            <Link\n              :class=\"{ active: page.component === 'Index' }\"\n              :href=\"resolveUrl('home_show')\"\n            >\n              Inicio\n            </Link>\n          </li>\n          <li>\n            <Link\n              :class=\"{ active: page.component === 'Price' }\"\n              :href=\"resolveUrl('subscription_show')\"\n            >\n              Suscripción\n            </Link>\n          </li>\n          <li v-if=\"false\">\n            <Link\n              :class=\"{ active: page.component === 'Packs' }\"\n              :href=\"resolveUrl('pack_list')\"\n            >\n              Paquetes y Cursos\n            </Link>\n          </li>\n          <li>\n            <Link :class=\"{ active: page.component === 'Faqs' }\" href=\"/#preguntas\">\n              Preguntas\n            </Link>\n          </li>\n          <li v-if=\"!user\">\n            <a @click=\"openLogin\">Entrar</a>\n          </li>\n          <li v-else>\n            <a :href=\"resolveUrl('account_show')\">Mi Cuenta</a>\n          </li>\n        </ul>\n      </div>\n    </Transition>\n  </div>\n</template>\n\n<style lang=\"scss\" scoped>\n@use \"@/styles/settings/vars\";\n\n.header {\n  padding: 0;\n  height: inherit;\n\n  a.active {\n    background-color: vars.$dust;\n    border-color: vars.$dust;\n    color: vars.$poly-fuchsia;\n  }\n\n  &__container {\n    width: 100%;\n    background-color: vars.$off-white;\n    padding: 4px 4px 4px 1rem;\n  }\n\n  &__menu {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    padding: 0;\n  }\n\n  &__logo {\n    width: 220px;\n    height: auto;\n    text-decoration: none;\n  }\n\n  &__desktop {\n    display: none;\n    gap: 4px;\n    align-items: center;\n  }\n\n  &__mobile {\n    display: flex;\n  }\n\n  @media (min-width: 1024px) {\n    &__desktop {\n      display: flex;\n    }\n\n    &__mobile {\n      display: none;\n    }\n  }\n}\n\n.header__mobile__menu {\n  width: 3em;\n  height: 3em;\n  background-image: url(\"@img/icons/hamburger-icon.svg\");\n  background-repeat: no-repeat;\n  background-position: center;\n  background-size: 1em;\n\n  &--open {\n    position: absolute;\n    margin: 4px;\n    top: 0;\n    right: 0;\n    background-color: vars.$iron;\n    background-image: url(\"@img/icons/close-white.svg\");\n    z-index: 999;\n  }\n}\n\n.header__mobile__menu--open:hover {\n  background-color: vars.$off-black !important;\n}\n\n.mobile-menu {\n  position: fixed;\n  background-color: vars.$iron;\n  top: 0;\n  width: 100%;\n  height: 100vh;\n  overflow: hidden;\n  z-index: 99;\n\n  &--visible {\n    top: 0;\n  }\n\n  &__links {\n    margin-top: 4em;\n    margin-left: 2em;\n    padding: 0;\n\n    li {\n      list-style: none;\n      text-align: left;\n      margin-bottom: 2em;\n\n      a {\n        color: vars.$off-white;\n        text-decoration: none;\n        font-family: vars.$ff_apparat_medium;\n        font-size: 2em;\n        text-transform: uppercase;\n        cursor: pointer;\n      }\n\n      .active {\n        color: vars.$poly-fuchsia;\n      }\n    }\n  }\n}\n\n.fade-enter-active,\n.fade-leave-active {\n  transition: opacity 0.4s ease;\n}\n\n.fade-enter-from,\n.fade-leave-to {\n  opacity: 0;\n}\n</style>\n"],"names":["_imports_0","form","useForm","recoveryMessage","ref","recoverySubmit","axios","resolveUrl","response","error","showRecovery","bfMode","page","usePage","user","emit","__emit","mobileMenuOpen","toggleMenu","openLogin"],"mappings":"6cAAA,MAAeA,EAAA,icCSf,MAAMC,EAAOC,EAAQ,CACnB,SAAU,KACV,SAAU,IAAA,CACX,g7ECFK,MAAAC,EAAkBC,EAAI,EAAK,EAE3BC,EAAiB,IAAM,CAC3BJ,EAAK,WAAa,GAEfK,EAAA,KAAKC,EAAW,kBAAkB,EAAGN,EAAK,MAAM,EAChD,KAAMO,GAAa,CAClBP,EAAK,WAAa,GACdO,EAAS,KAAK,UAChBP,EAAK,MAAM,EACXE,EAAgB,MAAQ,GAC1B,CACD,EACA,MAAOM,GAAU,CAChBR,EAAK,WAAa,GACbA,EAAA,OAASQ,EAAM,SAAS,KAAK,MAAA,CACnC,CAAA,EAGCR,EAAOC,EAAQ,CACnB,MAAO,IAAA,CACR,20CCtBK,MAAAQ,EAAeN,EAAI,EAAK,gvBCRxBO,EAAS,sCACf,eAAQ,IAAIA,CAAM,khBCOlB,MAAMC,EAAOC,IACPC,EAAOV,EAAIQ,EAAK,MAAM,IAAI,EAC1BG,EAAOC,EAUPC,EAAiBb,EAAI,EAAK,EAC1Bc,EAAa,IAAM,CACRD,EAAA,MAAQ,CAACA,EAAe,MACvCF,EAAK,YAAY,CAAA,EAGbI,EAAY,IAAM,CACtBF,EAAe,MAAQ,GACvBF,EAAK,aAAa,CAAA"}