{"version":3,"file":"DBdv9OWV.js","sources":["../../../../node_modules/lucide-vue-next/dist/esm/icons/file-down.js","../../../../pages/project/[slug].vue"],"sourcesContent":["/**\n * @license lucide-vue-next v0.451.0 - ISC\n *\n * This source code is licensed under the ISC license.\n * See the LICENSE file in the root directory of this source tree.\n */\n\nimport createLucideIcon from '../createLucideIcon.js';\n\nconst FileDown = createLucideIcon(\"FileDownIcon\", [\n  [\"path\", { d: \"M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z\", key: \"1rqfz7\" }],\n  [\"path\", { d: \"M14 2v4a2 2 0 0 0 2 2h4\", key: \"tnqrlb\" }],\n  [\"path\", { d: \"M12 18v-6\", key: \"17g6i2\" }],\n  [\"path\", { d: \"m9 15 3 3 3-3\", key: \"1npd3o\" }]\n]);\n\nexport { FileDown as default };\n//# sourceMappingURL=file-down.js.map\n","<script lang=\"ts\" setup>\nimport { Navigation, Pagination } from \"swiper/modules\";\nimport { Swiper, SwiperSlide } from \"swiper/vue\";\nimport \"swiper/css\";\nimport \"swiper/css/navigation\";\nimport \"swiper/css/pagination\";\nimport { updateFadeInElements } from \"~/app.vue\";\nimport { ExternalLink, FileDown } from \"lucide-vue-next\";\n\nconst localePath = useLocalePath()\n\nconst modules = [Navigation, Pagination];\nconst { locale } = useI18n();\nconst route = useRoute();\nconst slug = Array.isArray(route.params.slug)\n  ? route.params.slug[0]\n  : route.params.slug;\n\ntype Data = {\n  content: {\n    title: string;\n    subtitle: string;\n    status: string;\n    dates: {\n      start: string;\n      end: string;\n    };\n    technologies: {\n      name: string;\n      icon: string;\n      description: string;\n    }[];\n    team: {\n      name: string;\n      role: string;\n    }[];\n    images: string[];\n    links: {\n      name: string;\n      url: string;\n      icon: string;\n    }[];\n  };\n  surround: [string, string];\n};\n\nconst { data }: { data: Ref<Data> } = await useAsyncData(\"page\", async () => {\n  const [content, surround] = await Promise.all([\n    queryContent(`${locale.value}/${slug}`).findOne(),\n    queryContent().only(\"_path\").findSurround(`/${locale.value}/${slug}`),\n  ]);\n\n  const surroundResult: (string | undefined)[] = [];\n  for (let i = 0; i < surround.length; ++i) {\n    if (surround[i]?._path?.split(\"/\")[1] !== locale.value) {\n      surroundResult.push(undefined);\n    } else {\n      surroundResult.push(surround[i]?._path?.split(\"/\").pop());\n    }\n  }\n  \n  return {\n    content,\n    surround: surroundResult\n  };\n});\n\nif (!data.value) {\n  const route = useRoute();\n  throw createError({\n    statusCode: 404,\n    message: `Page not found: ${route.fullPath}`,\n  });\n}\n\nonMounted(() => {\n  updateFadeInElements();\n  useHead({\n    title: data.value.content?.title,\n    meta: [\n      {\n        name: \"description\",\n        content: data.value.content?.subtitle,\n      },\n      { name: \"og:title\", content: data.value.content?.title },\n      { name: \"og:description\", content: data.value.content?.subtitle },\n      { name: \"twitter:title\", content: data.value.content?.title },\n      { name: \"twitter:description\", content: data.value.content?.subtitle },\n    ],\n  });\n});\n</script>\n\n<template>\n  <div>\n    <Header\n      :title=\"data.content?.title ?? ''\"\n      :subtitle=\"data.content?.subtitle\"\n    />\n    <main>\n      <section id=\"info\">\n        <div class=\"container\">\n          <div class=\"section-title centered fade-in\">\n            <h2>\n              <span class=\"section-title-number\">01.</span>\n              {{ $t(\"project.sections.info\") }}\n            </h2>\n            <hr />\n          </div>\n          <div class=\"info-status-dates fade-in\">\n            <p class=\"info-status\">\n              <span class=\"colored\">{{ $t(\"project.status\") }}:</span>\n              {{ data.content?.status }}\n            </p>\n            <p class=\"info-dates\">\n              <span class=\"colored\">{{ $t(\"project.dates\") }}:</span>\n              {{ data.content?.dates?.start.replaceAll(\"-\", \"/\") }} -\n              {{ data.content?.dates?.end.replaceAll(\"-\", \"/\") }}\n            </p>\n          </div>\n          <h3 class=\"fillTextWithgradient fade-in\">\n            {{ $t(\"project.technologies\") }}\n          </h3>\n          <ul class=\"technology-list\">\n            <li\n              class=\"technology-item fade-in\"\n              v-for=\"technology in data.content?.technologies\"\n              :key=\"technology.name\"\n            >\n              <img\n                class=\"technology-item-vector\"\n                :src=\"`https://cdn.simpleicons.org/${technology.icon}/f5f3fa`\"\n                alt=\"icon\"\n              />\n              <p class=\"technology-item-name\">{{ technology.name }}</p>\n              <p class=\"technology-item-description\">\n                // {{ technology.description }}\n              </p>\n            </li>\n          </ul>\n          <h3 class=\"fillTextWithgradient fade-in\">{{ $t(\"project.team\") }}</h3>\n          <ul class=\"team-list\">\n            <li\n              class=\"team-item fade-in\"\n              v-for=\"member in data.content?.team\"\n              :key=\"member.name\"\n            >\n              <p class=\"team-item-name\">{{ member.name }}</p>\n              <p class=\"team-item-role\">// {{ member.role }}</p>\n            </li>\n          </ul>\n        </div>\n      </section>\n      <section id=\"image\" class=\"fade-in\">\n        <Swiper\n          v-if=\"data.content?.images?.length > 1\"\n          class=\"project-slider\"\n          :slides-per-view=\"1\"\n          :space-between=\"20\"\n          :navigation=\"true\"\n          :pagination=\"{ clickable: true }\"\n          :loop=\"false\"\n          :grab-cursor=\"true\"\n          :centeredSlides=\"true\"\n          :modules=\"modules\"\n        >\n          <SwiperSlide\n            class=\"project-slider-item\"\n            v-for=\"image in data.content?.images\"\n            :key=\"image\"\n          >\n            <NuxtImg\n              :src=\"image\"\n              format=\"webp\"\n              placeholder\n              loading=\"lazy\"\n              quality=\"50\"\n              alt=\"Project {{ data.content?.title }}\"\n            />\n          </SwiperSlide>\n        </Swiper>\n        <NuxtImg\n          v-else-if=\"data.content?.images\"\n          :src=\"data.content?.images[0]\"\n          format=\"webp\"\n          placeholder\n          loading=\"lazy\"\n          quality=\"50\"\n          id=\"header-image\"\n          alt=\"Project {{ data.content?.title }}\"\n        />\n      </section>\n      <section id=\"links\">\n        <div class=\"container\">\n          <div class=\"section-title centered fade-in\">\n            <h2>\n              <span class=\"section-title-number\">02.</span>\n              {{ $t(\"project.sections.links\") }}\n            </h2>\n            <hr />\n          </div>\n          <ul class=\"link-list\" v-if=\"data.content?.links?.length > 0\">\n            <li\n              class=\"link-item fade-in\"\n              v-for=\"link in data.content?.links\"\n              :key=\"link.name\"\n            >\n              <a class=\"link-item-anchor\" :href=\"link.url\" target=\"_blank\">\n                <div v-if=\"link.icon == 'download'\" class=\"link-item-vector\">\n                  <FileDown :size=\"60\" color=\"#f5f3fa\" />\n                </div>\n                <div v-if=\"link.icon == 'web'\" class=\"link-item-vector\">\n                  <ExternalLink :size=\"60\" color=\"#f5f3fa\" />\n                </div>\n                <img\n                  v-else\n                  class=\"link-item-vector\"\n                  :src=\"`https://cdn.simpleicons.org/${link.icon}/f5f3fa`\"\n                  alt=\"icon\"\n                />\n                <p class=\"link-item-text\" v-html=\"link.name\"></p>\n              </a>\n            </li>\n          </ul>\n          <div class=\"link-empty fade-in\" v-else>\n            <p class=\"link-empty-text\">\n              /*<br />\n              &nbsp;* {{ $t(\"project.noLinks.1\") }}<br />\n              &nbsp;* {{ $t(\"project.nolinks.2\") }}<br />\n              &nbsp;*/\n            </p>\n          </div>\n        </div>\n      </section>\n      <section id=\"presentation\">\n        <div class=\"container\">\n          <div class=\"section-title centered fade-in\">\n            <h2>\n              <span class=\"section-title-number\">03.</span>\n              {{ $t(\"project.sections.presentation\") }}\n            </h2>\n            <hr />\n          </div>\n          <div class=\"presentation-content-block fade-in\">\n            <ContentRenderer :value=\"data?.content\" />\n          </div>\n        </div>\n      </section>\n      <section id=\"project-navigation\">\n        <div class=\"container fade-in\">\n          <UnderlinedButton\n            :href=\"data.surround[1] === undefined ? '#' : localePath(`/project/${data.surround[1]}`)\"\n            arrowPosition=\"left\"\n            :disabled=\"data.surround[1] === undefined\"\n          >\n            {{ $t(\"project.nav.next\") }}\n          </UnderlinedButton>\n          <UnderlinedButton\n            :href=\"data.surround[0] === undefined ? '#' : localePath(`/project/${data.surround[0]}`)\"\n            arrowPosition=\"right\"\n            :disabled=\"data.surround[0] === undefined\"\n          >\n            {{ $t(\"project.nav.last\") }}\n          </UnderlinedButton>\n        </div>\n      </section>\n    </main>\n  </div>\n</template>\n\n<style lang=\"scss\" scoped>\nsection#info {\n  .info-status-dates {\n    // Made this two columns\n    display: flex;\n    flex-direction: row;\n    justify-content: space-between;\n    align-items: flex-start;\n    p {\n      width: calc(50% - 0.5rem);\n      margin: 8px 0;\n      font-size: 1.5rem;\n      line-height: 1.5rem;\n      .colored {\n        color: var(--secondary-color);\n      }\n    }\n    @media (max-width: 768px) {\n      flex-direction: column;\n      p {\n        width: 100%;\n        font-size: 1.2rem;\n        line-height: 1.2rem;\n      }\n    }\n  }\n  h3 {\n    font-size: 2rem;\n    font-weight: bold;\n    margin-bottom: 1rem;\n    text-align: center;\n    @media screen and (max-width: 768px) {\n      font-size: 1.5rem;\n    }\n  }\n  ul.technology-list {\n    list-style: none;\n    width: 100%;\n    margin: 0;\n    padding: 0;\n    display: flex;\n    flex-wrap: wrap;\n    justify-content: center;\n    align-items: stretch;\n    li.technology-item {\n      margin: 1rem;\n      max-width: 300px;\n      width: 100%;\n      text-align: center;\n      display: flex;\n      flex-direction: column;\n      align-items: center;\n      justify-content: center;\n      .technology-item-name {\n        font-size: 1.25rem;\n        font-weight: 600;\n        color: var(--text-color);\n        margin: 0;\n      }\n      .technology-item-description {\n        color: var(--comment-color);\n      }\n      .technology-item-vector {\n        flex: 1;\n        max-height: 60px;\n        max-width: 60px;\n        margin-bottom: 1rem;\n      }\n    }\n  }\n  ul.team-list {\n    list-style: none;\n    width: 100%;\n    margin: 0;\n    padding: 0;\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    li.team-item {\n      margin: 0.5rem 0;\n      text-align: center;\n      .team-item-name {\n        font-size: 1.25rem;\n        font-weight: 600;\n        color: var(--text-color);\n        margin: 0;\n      }\n      .team-item-role {\n        color: var(--comment-color);\n        margin: 0;\n      }\n    }\n  }\n}\nsection#image {\n  overflow: hidden;\n  width: 100vw;\n  .project-slider {\n    .project-slider-item {\n      width: 100vw;\n      aspect-ratio: 16/9;\n      img {\n        width: 100%;\n        height: 100%;\n        object-fit: cover;\n      }\n    }\n  }\n  img#header-image {\n    width: 100%;\n    object-fit: cover;\n  }\n}\nsection#links {\n  background-color: #0c081693;\n  ul.link-list {\n    list-style: none;\n    width: 100%;\n    margin: 0;\n    padding: 0;\n    display: flex;\n    flex-wrap: wrap;\n    justify-content: center;\n    align-items: stretch;\n    li.link-item {\n      margin: 1rem;\n      max-width: 300px;\n      width: 100%;\n      text-align: center;\n      a.link-item-anchor {\n        display: flex;\n        flex-direction: column;\n        align-items: center;\n        justify-content: center;\n        text-decoration: none;\n        cursor: pointer;\n        .link-item-vector {\n          max-height: 60px;\n          max-width: 60px;\n          margin-bottom: 1rem;\n        }\n      }\n      p.link-item-text {\n        position: relative;\n        width: fit-content;\n        font-size: 1.25rem;\n        font-weight: 600;\n        color: var(--text-color);\n        margin: 0;\n        &::before {\n          content: \"\";\n          position: absolute;\n          height: 100%;\n          left: -2px;\n          right: -2px;\n          z-index: -1;\n          background-color: var(--primary-color);\n          transform: scaleX(0%);\n          transform-origin: right;\n          transition: transform 0.25s var(--easing);\n        }\n      }\n      &:hover {\n        p.link-item-text {\n          &::before {\n            transform: scaleX(100%);\n            transform-origin: left;\n          }\n        }\n      }\n    }\n  }\n  .link-empty {\n    display: grid;\n    place-items: center;\n    p.link-empty-text {\n      color: var(--comment-color);\n      margin: 0;\n    }\n  }\n}\nsection#presentation {\n  .presentation-content-block {\n    h1,\n    h2,\n    h3,\n    h4,\n    h5,\n    h6 {\n      font-size: 2rem;\n      font-weight: bold;\n      margin-bottom: 1rem;\n      @media screen and (max-width: 768px) {\n        font-size: 1.5rem;\n      }\n    }\n    p {\n      font-size: 1.25rem;\n      text-align: justify;\n      @media screen and (max-width: 768px) {\n        font-size: 1rem;\n        text-align: left;\n      }\n    }\n  }\n}\nsection#project-navigation {\n  margin: 0 0 2rem;\n  height: 2rem;\n  .container {\n    display: flex;\n    flex-flow: row nowrap;\n    justify-content: space-between;\n    align-items: center;\n  }\n}\n</style>\n"],"names":["FileDown","createLucideIcon","localePath","useLocalePath","modules","Navigation","Pagination","locale","useI18n","route","useRoute","slug","data","__temp","__restore","_withAsyncContext","useAsyncData","content","surround","queryContent","surroundResult","i","_b","_a","_d","_c","createError","onMounted","updateFadeInElements","useHead","_e","_f"],"mappings":"siBAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GASA,MAAMA,GAAWC,GAAiB,eAAgB,CAChD,CAAC,OAAQ,CAAE,EAAG,6DAA8D,IAAK,QAAQ,CAAE,EAC3F,CAAC,OAAQ,CAAE,EAAG,0BAA2B,IAAK,QAAQ,CAAE,EACxD,CAAC,OAAQ,CAAE,EAAG,YAAa,IAAK,QAAQ,CAAE,EAC1C,CAAC,OAAQ,CAAE,EAAG,gBAAiB,IAAK,QAAQ,CAAE,CAChD,CAAC,miCCLD,MAAMC,EAAaC,IAEbC,EAAU,CAACC,GAAYC,EAAU,EACjC,CAAE,OAAAC,GAAWC,IACbC,EAAQC,IACRC,EAAO,MAAM,QAAQF,EAAM,OAAO,IAAI,EACxCA,EAAM,OAAO,KAAK,CAAC,EACnBA,EAAM,OAAO,KA8BX,CAAE,KAAAG,IAA8B,CAAAC,EAAAC,CAAA,EAAAC,EAAA,SAAMC,GAAa,OAAQ,SAAY,aAC3E,KAAM,CAACC,EAASC,CAAQ,EAAI,MAAM,QAAQ,IAAI,CAC5CC,EAAa,GAAGZ,EAAO,KAAK,IAAII,CAAI,EAAE,EAAE,QAAQ,EAChDQ,IAAe,KAAK,OAAO,EAAE,aAAa,IAAIZ,EAAO,KAAK,IAAII,CAAI,EAAE,CAAA,CACrE,EAEKS,EAAyC,CAAA,EAC/C,QAASC,EAAI,EAAGA,EAAIH,EAAS,OAAQ,EAAEG,IACjCC,GAAAC,EAAAL,EAASG,CAAC,IAAV,YAAAE,EAAa,QAAb,YAAAD,EAAoB,MAAM,KAAK,MAAOf,EAAO,MAC/Ca,EAAe,KAAK,MAAS,EAEdA,EAAA,MAAKI,GAAAC,EAAAP,EAASG,CAAC,IAAV,YAAAI,EAAa,QAAb,YAAAD,EAAoB,MAAM,KAAK,KAAK,EAIrD,MAAA,CACL,QAAAP,EACA,SAAUG,CAAA,CACZ,CACD,CAAA,mBAEG,GAAA,CAACR,EAAK,MAAO,CACf,MAAMH,EAAQC,IACd,MAAMgB,GAAY,CAChB,WAAY,IACZ,QAAS,mBAAmBjB,EAAM,QAAQ,EAAA,CAC3C,CACH,CAEA,OAAAkB,GAAU,IAAM,iBACOC,KACbC,GAAA,CACN,OAAON,EAAAX,EAAK,MAAM,UAAX,YAAAW,EAAoB,MAC3B,KAAM,CACJ,CACE,KAAM,cACN,SAASD,EAAAV,EAAK,MAAM,UAAX,YAAAU,EAAoB,QAC/B,EACA,CAAE,KAAM,WAAY,SAASG,EAAAb,EAAK,MAAM,UAAX,YAAAa,EAAoB,KAAM,EACvD,CAAE,KAAM,iBAAkB,SAASD,EAAAZ,EAAK,MAAM,UAAX,YAAAY,EAAoB,QAAS,EAChE,CAAE,KAAM,gBAAiB,SAASM,EAAAlB,EAAK,MAAM,UAAX,YAAAkB,EAAoB,KAAM,EAC5D,CAAE,KAAM,sBAAuB,SAASC,EAAAnB,EAAK,MAAM,UAAX,YAAAmB,EAAoB,QAAS,CACvE,CAAA,CACD,CAAA,CACF","x_google_ignoreList":[0]}