{"version":3,"file":"13.e0d21a42.js","sources":["../../../../../../../../libs/fe/center-kit/src/components/site/feature/FeatureHeroSection.svelte","../../../../../../../../libs/fe/center-kit/src/components/site/feature/LoggingSection.svelte","../../../../../../../../libs/fe/center-kit/src/components/site/feature/SyncSection.svelte","../../../../../../src/routes/(marketing)/features/+page.svelte"],"sourcesContent":["<script lang=\"ts\">\n  import { onMount } from 'svelte';\n  import { AbTestService } from '@centerhealth/fe/abtest';\n  import { CenterImage } from '@centerhealth/fe/center-kit';\n  import { createSource, ISrcSetData } from '@centerhealth/fe/images';\n  // Models\n  import type { CtaModel } from '@centerhealth/fe/center-kit';\n  // Components\n  import { Button, StoreButton } from '@centerhealth/fe/center-kit';\n  //Intersection Observer Wrapper\n\n  const cta: CtaModel = {\n    label: 'Get started now ➡️',\n    link: '/signup',\n  };\n\n  const videoObjects: ISrcSetData[] = [\n    {\n      sourceUrl: '/assets/videos/features-hero.webm',\n    },\n    {\n      sourceUrl: '/assets/videos/features-hero.mp4',\n    },\n  ];\n\n  onMount(async () => {\n    // A/B test cta in /features\n    const featuresCtaVariation = await AbTestService.getVariation('featureCta_22-08-24');\n    if (featuresCtaVariation === 'linkSubscribe') {\n      cta.link = '/subscribe';\n    }\n  });\n</script>\n\n<section class=\"pt-7 pb-4 xl:pb-0 xl:py-7 xl:overflow-hidden xxl:pt-9\">\n  <div class=\"container-override\">\n    <h1 class=\"title-override text-gray-darkest\">\n      This is Center,\n      <br />\n      <span class=\"font-semibold\">the last diabetes app you'll ever need </span>\n    </h1>\n    <div class=\"demo-override -z-10\">\n      <CenterImage>\n        <video playsinline autoplay muted loop>\n          <source src={createSource(videoObjects[0].sourceUrl)} type=\"video/webm\" />\n          <source src={createSource(videoObjects[1].sourceUrl)} type=\"video/mp4\" />\n        </video>\n      </CenterImage>\n    </div>\n    <div\n      class=\"mt-7 xl:mt-0 xl:col-start-1 xl:col-end-7 xl:row-start-3 xl:row-end-5 xxl:pl-3 mobile-full\"\n    >\n      <Button\n        mobileBlock\n        heapAttr={{ action: 'cta', subAction: 'signup', sectionName: 'hero' }}\n        size=\"medium\"\n        href={cta.link}>{cta.label}</Button\n      >\n    </div>\n    <p\n      class=\"m-5 text-gray text-lg xl:col-start-1 xl:col-end-7 xl:row-start-4 xl:m-0 xl:self-end xl:text-xl xxl:pl-3\"\n    >\n      Get the app\n    </p>\n    <div class=\"store-override\">\n      <StoreButton type=\"app-store\" />\n      <StoreButton type=\"google-play\" />\n    </div>\n  </div>\n</section>\n\n<style lang=\"scss\">\n  section {\n    width: 100%;\n    background-repeat: no-repeat;\n    background-size: 700% auto;\n    background-position: center bottom;\n    @screen sm {\n      background-size: 300% auto;\n    }\n    @screen lg {\n      background-size: 200% auto;\n    }\n    @screen xl {\n      background-size: 110% auto;\n    }\n  }\n  .container-override {\n    @apply container overflow-hidden grid grid-cols-1 place-items-center mx-auto relative;\n    @screen xl {\n      max-height: 550px;\n      @apply xl:grid-cols-12 xl:grid-rows-6 xl:justify-items-start xl:items-center;\n    }\n    @screen xxl {\n      max-height: 650px;\n    }\n  }\n\n  .demo-override {\n    transform: scale3d(1.8, 1.8, 1.8);\n    @apply mt-7;\n\n    // Changing the size of the demo across different breakpoints\n    @screen md {\n      transform: scale3d(1.5, 1.5, 1.5);\n    }\n    @screen xl {\n      transform: scale3d(1.8, 1.8, 1.8);\n      @apply xl:mt-0 xl:absolute xl:row-start-1 xl:row-end-7 xl:col-start-7 xl:col-end-13 xl:justify-self-center xl:top-32;\n    }\n  }\n  .title-override {\n    @apply text-center mb-3 md:mx-8;\n\n    @screen xl {\n      @apply xl:text-left xl:col-start-1 xl:col-end-7 xl:row-start-2 xl:row-end-3 xl:mb-5 xl:mx-0;\n    }\n    @screen xxl {\n      @apply xxl:col-end-5 xxl:col-end-7 xxl:pl-3;\n    }\n  }\n\n  .store-override {\n    // Mobile first, Vertical layout for stores buttons\n    @apply flex flex-col items-center;\n    // Small first, Horizontal layout for stores buttons\n    @apply sm:flex-row sm:justify-center sm:gap-3;\n    // Large set the position of the stores buttons to the left of the grid\n    @apply xl:col-start-1 xl:col-end-7 xl:row-start-5 xl:justify-start;\n    @apply xxl:pl-3;\n  }\n\n  .mobile-full {\n    @media (max-width: 768px) {\n      @apply w-full;\n    }\n  }\n</style>\n","<script lang=\"ts\">\n  import { CenterImage } from '@centerhealth/fe/center-kit';\n  import { createSource, ISrcSetData } from '@centerhealth/fe/images';\n\n  const videoObjects: ISrcSetData[] = [\n    {\n      sourceUrl: '/assets/images/feature/hero-demo_compressed.webm',\n    },\n    {\n      sourceUrl: '/assets/videos/features-hero.webm',\n    },\n  ];\n</script>\n\n<section class=\"my-9 overflow-x-clip\">\n  <div\n    class=\"container relative grid grid-col-1 md:grid-cols-12 place-items-center gap-10 mx-auto py-4\"\n  >\n    <div class=\"mt-7 flex flex-col gap-2 md:col-span-5 md:mt-0 xxl:col-start-2\">\n      <h2 class=\"text-center leading-tight md:text-left text-black z-10\">\n        🍝 Instantly track your carbs and other events\n      </h2>\n      <p class=\"xl:text-lg text-center md:text-left text-gray z-10\">\n        Counting carbs shouldn't be difficult. A quick search or barcode scan, and you're on your\n        way.\n      </p>\n    </div>\n    <div class=\"order-first md:order-last md:col-span-7 xxl:col-start-7\">\n      <CenterImage>\n        <video playsinline autoplay muted loop>\n          <source src={createSource(videoObjects[0].sourceUrl)} type=\"video/webm\" />\n          <source src={createSource(videoObjects[1].sourceUrl)} type=\"video/mp4\" />\n        </video>\n      </CenterImage>\n    </div>\n  </div>\n</section>\n\n<style lang=\"postcss\">\n  video {\n    @apply -z-10;\n    transform: scale3d(1.8, 1.8, 1.8);\n  }\n</style>\n","<script lang=\"ts\">\n  import { CenterImage } from '@centerhealth/fe/center-kit';\n  import { createSource, createSourceSet, ISrcSetData } from '@centerhealth/fe/images';\n\n  const imageObject: ISrcSetData = {\n    sourceUrl: '/assets/images/sync-bg.webp',\n  };\n</script>\n\n<section>\n  <div class=\"container flex flex-col mx-auto my-7\">\n    <CenterImage>\n      <img\n        class=\"mb-2 md:mb-0 md:order-last w-max\tobject-contain\"\n        width=\"500\"\n        height=\"650\"\n        srcset={createSourceSet(imageObject)}\n        src={createSource(imageObject.sourceUrl)}\n        alt=\"\"\n      />\n    </CenterImage>\n    <h2 class=\"text-center leading-tight\">Sync with all your existing apps & devices</h2>\n    <p class=\"text-center text-lg xl:text-xl text-gray mt-2 xl:px-7 xxl:px-10\">\n      Center makes it easy to bring all your diabetes data under one roof, adding valuable context\n      to your readings.\n    </p>\n  </div>\n</section>\n","<script lang=\"ts\">\n  import { onMount } from 'svelte';\n  import { AbTestService } from '@centerhealth/fe/abtest';\n\n  // Module dependencies\n  import {\n    SvelteHead,\n    FeatureHeroSection,\n    LoggingSection,\n    SyncSection,\n    StatsSection,\n    FeaturesSection,\n    CallAction,\n  } from '@centerhealth/fe/center-kit';\n  import type { CtaModel } from '@centerhealth/fe/center-kit';\n  import { page } from '$app/stores';\n\n  // page info and meta\n  const htmlHead = {\n    title: 'Our App | Center Health',\n    description:\n      'Meet Center, an app for your diabetes combining simple logging, collaboration, and your very own personal assistant!',\n    url: $page.url.href,\n    host: $page.url.origin,\n  };\n\n  // call to action button on nav\n  const cta: CtaModel = {\n    label: 'Get started now 🎉',\n    link: '/signup',\n  };\n\n  onMount(async () => {\n    // A/B test cta to /subscribe\n    const featuresCta = await AbTestService.getVariation('featureCta_22-08-24');\n    if (featuresCta === 'linkSubscribe') {\n      cta.link = '/subscribe';\n    }\n  });\n</script>\n\n<SvelteHead {htmlHead} />\n\n<FeatureHeroSection />\n<FeaturesSection flipComponent={true} />\n<SyncSection />\n<LoggingSection />\n<StatsSection />\n<CallAction\n  {cta}\n  title=\"Oh, and it's completely free!\"\n  subtitle=\"What do you say – ready to make a change?\"\n/>\n"],"names":["src_url_equal","source0","source0_src_value","createSource","ctx","attr","source1","source1_src_value","insert_hydration","target","video","anchor","append_hydration","t_value","dirty","set_data","t","section","div3","h1","br","span","div0","div1","p","div2","button_changes","h2","img","createSourceSet","img_src_value","div"],"mappings":"skCA4CuBA,EAAAC,EAAA,IAAAC,EAAAC,EAAaC,EAAa,CAAA,EAAA,CAAC,EAAE,SAAS,CAAA,GAAAC,EAAAJ,EAAA,MAAAC,CAAA,2BACtCF,EAAAM,EAAA,IAAAC,EAAAJ,EAAaC,EAAa,CAAA,EAAA,CAAC,EAAE,SAAS,CAAA,GAAAC,EAAAC,EAAA,MAAAC,CAAA,sFAFrDC,EAGOC,EAAAC,EAAAC,CAAA,EAFLC,EAAyEF,EAAAT,CAAA,EACzEW,EAAwEF,EAAAJ,CAAA,qCAWzD,IAAAO,EAAAT,KAAI,MAAK,+DAATU,EAAA,GAAAD,KAAAA,EAAAT,KAAI,MAAK,KAAAW,GAAAC,EAAAH,CAAA,8LAFd,OAAQ,MAAO,UAAW,SAAU,YAAa,sBAEvD,KAAAT,KAAI,wKApB8B;AAAA,OAE1C,kCAC4B,wCAAuC,yFAsBrE,aAEA,4LA3B4C;AAAA,OAE1C,oEAC4B,wCAAuC,uOAsBrE,aAEA,6sBA7BJI,EAmCSC,EAAAQ,EAAAN,CAAA,EAlCPC,EAiCKK,EAAAC,CAAA,EAhCHN,EAIIM,EAAAC,CAAA,SAFFP,EAAKO,EAAAC,CAAA,SACLR,EAAyEO,EAAAE,CAAA,gBAE3ET,EAOKM,EAAAI,CAAA,qBACLV,EASKM,EAAAK,CAAA,qBACLX,EAIGM,EAAAM,CAAA,gBACHZ,EAGKM,EAAAO,CAAA,iHAXKX,EAAA,IAAAY,EAAA,KAAAtB,KAAI,g5BC1BKJ,EAAAC,EAAA,IAAAC,EAAAC,EAAaC,EAAa,CAAA,EAAA,CAAC,EAAE,SAAS,CAAA,GAAAC,EAAAJ,EAAA,MAAAC,CAAA,2BACtCF,EAAAM,EAAA,IAAAC,EAAAJ,EAAaC,EAAa,CAAA,EAAA,CAAC,EAAE,SAAS,CAAA,GAAAC,EAAAC,EAAA,MAAAC,CAAA,oHAFrDC,EAGOC,EAAAC,EAAAC,CAAA,EAFLC,EAAyEF,EAAAT,CAAA,EACzEW,EAAwEF,EAAAJ,CAAA,0LAZV,gDAElE,qBAC6D;AAAA,aAG7D,wMANkE,gDAElE,6DAC6D;AAAA,aAG7D,gkBAXNE,EAsBSC,EAAAQ,EAAAN,CAAA,EArBPC,EAoBKK,EAAAQ,CAAA,EAjBHb,EAQKa,EAAAH,CAAA,EAPHV,EAEIU,EAAAK,CAAA,gBACJf,EAGGU,EAAAE,CAAA,gBAELZ,EAOKa,EAAAF,CAAA,sqBClBOlB,EAAAuB,EAAA,SAAAC,GAAgBzB,EAAW,CAAA,CAAA,CAAA,YAC9BD,EAAaC,EAAW,CAAA,EAAC,SAAS,CAAA,GAAAC,EAAAuB,EAAA,MAAAE,CAAA,wBALzCtB,EAOCC,EAAAmB,EAAAjB,CAAA,kMAEmC,4CAA0C,qBACN;AAAA,wBAG1E,qJAJsC,4CAA0C,6DACN;AAAA,wBAG1E,2OAhBJH,EAkBSC,EAAAQ,EAAAN,CAAA,EAjBPC,EAgBKK,EAAAc,CAAA,qBALHnB,EAAoFmB,EAAAJ,CAAA,gBACpFf,EAGGmB,EAAAP,CAAA,weCmByB,EAAI,CAAA,CAAA"}