{"version":3,"file":"CrDYfFKf.js","sources":["../../../../virtual:public?%2Fimages%2Fdiagram-bg.png","../../../../virtual:public?%2Fimages%2Fstreamfold-centerpiece.png","../../../../pages/index.vue"],"sourcesContent":["import { publicAssetsURL } from '#internal/nuxt/paths';export default publicAssetsURL(\"/images/diagram-bg.png\")","import { publicAssetsURL } from '#internal/nuxt/paths';export default publicAssetsURL(\"/images/streamfold-centerpiece.png\")","<script setup lang=\"ts\">\nuseHead({ title: \"!Streamfold - Telemetry Pipeline for Developers\" })\n</script>\n\n<template>\n  <div>\n    <!-- Hero -->\n    <section\n      class=\"bg-gradient-to-b from-indigo-25 to-white border-b border-indigo-50\"\n    >\n      <div class=\"wrapper max-w-7xl mx-auto py-16 px-8\">\n        <div class=\"text-center\">\n          <h1\n            class=\"text-6xl font-medium bg-clip-text text-transparent bg-gradient-to-r from-indigo-600 to-violet-400 mx-auto pb-2\"\n          >\n            A telemetry pipeline built for\n            <span class=\"text-indigo-600\">developers</span>.\n          </h1>\n          <div\n            class=\"relative items-center justify-center mx-auto mt-12 max-w-5xl lg:max-w-5xl hidden lg:flex lg:mt-12\"\n          >\n            <img src=\"/images/diagram-bg.png\" alt=\"Streamfold\" class=\"w-5xl\" />\n            <div\n              class=\"w-[230px] h-[230px] absolute grid border border-indigo-50 rounded-full border-opacity-100 rotate-45\"\n            >\n              <div class=\"w-full h-full absolute grid items-center rotate-0\">\n                <div class=\"reverse path w-full h-full rounded-full\">\n                  <div\n                    class=\"bg-teal-100 bg-opacity-100 rounded-full w-2 h-2 absolute top-0 left-1/2 transform -translate-x-1/2 -translate-y-1/2\"\n                  ></div>\n                </div>\n              </div>\n              <div class=\"w-full h-full absolute grid items-center rotate-90\">\n                <div class=\"reverse path w-full h-full rounded-full\">\n                  <div\n                    class=\"bg-sky-100 bg-opacity-100 rounded-full w-2 h-2 absolute top-0 left-1/2 transform -translate-x-1/2 -translate-y-1/2\"\n                  ></div>\n                </div>\n              </div>\n              <div class=\"w-full h-full absolute grid items-center rotate-180\">\n                <div class=\"reverse path w-full h-full rounded-full\">\n                  <div\n                    class=\"bg-violet-100 bg-opacity-100 rounded-full w-2 h-2 absolute top-0 left-1/2 transform -translate-x-1/2 -translate-y-1/2\"\n                  ></div>\n                </div>\n              </div>\n              <div\n                class=\"w-full h-full absolute grid items-center rotate-[270deg]\"\n              >\n                <div class=\"reverse path w-full h-full rounded-full\">\n                  <div\n                    class=\"bg-indigo-100 bg-opacity-100 rounded-full w-2 h-2 absolute top-0 left-1/2 transform -translate-x-1/2 -translate-y-1/2\"\n                  ></div>\n                </div>\n              </div>\n            </div>\n            <div\n              class=\"w-[200px] h-[200px] absolute grid border border-indigo-25 rounded-full border-opacity-100 rotate-0\"\n            >\n              <div class=\"w-full h-full absolute grid items-center rotate-0\">\n                <div class=\"normal path w-full h-full rounded-full\">\n                  <div\n                    class=\"bg-teal-100 bg-opacity-100 rounded-full w-3 h-3 absolute top-0 left-1/2 transform -translate-x-1/2 -translate-y-1/2\"\n                  ></div>\n                </div>\n              </div>\n              <div class=\"w-full h-full absolute grid items-center rotate-90\">\n                <div class=\"normal path w-full h-full rounded-full\">\n                  <div\n                    class=\"bg-sky-100 bg-opacity-100 rounded-full w-3 h-3 absolute top-0 left-1/2 transform -translate-x-1/2 -translate-y-1/2\"\n                  ></div>\n                </div>\n              </div>\n              <div class=\"w-full h-full absolute grid items-center rotate-180\">\n                <div class=\"normal path w-full h-full rounded-full\">\n                  <div\n                    class=\"bg-violet-100 bg-opacity-100 rounded-full w-3 h-3 absolute top-0 left-1/2 transform -translate-x-1/2 -translate-y-1/2\"\n                  ></div>\n                </div>\n              </div>\n              <div\n                class=\"w-full h-full absolute grid items-center rotate-[270deg]\"\n              >\n                <div class=\"normal path w-full h-full rounded-full\">\n                  <div\n                    class=\"bg-indigo-100 bg-opacity-100 rounded-full w-3 h-3 absolute top-0 left-1/2 transform -translate-x-1/2 -translate-y-1/2\"\n                  ></div>\n                </div>\n              </div>\n            </div>\n            <img\n              src=\"/images/streamfold-centerpiece.png\"\n              alt=\"Streamfold\"\n              class=\"absolute h-[241px]\"\n            />\n          </div>\n        </div>\n      </div>\n    </section>\n    <!-- Benefits -->\n    <section class=\"bg-white border-b border-indigo-50\">\n      <div\n        class=\"wrapper max-w-7xl mx-auto px-8 py-16 grid grid-cols-1 md:grid-cols-3 gap-8\"\n      >\n        <div>\n          <h2\n            class=\"text-2xl font-medium text-indigo-500 mb-4 pl-8 bg-[url('/icons/square-3-stack-3d.svg')] bg-left bg-no-repeat pb-0.5\"\n          >\n            Bring your own stack\n          </h2>\n          <p class=\"text-slate-600 text-lg leading-6 mb-4\">\n            Full support for the most common telemetry tools. OpenTelemetry,\n            Datadog, Elastic, Splunk, Amazon S3, Honeycomb, and more.\n          </p>\n        </div>\n        <div>\n          <h2\n            class=\"text-2xl font-medium text-indigo-500 mb-4 pl-8 bg-[url('/icons/banknotes.svg')] bg-left bg-no-repeat pb-0.5\"\n          >\n            Manage spend\n          </h2>\n          <p class=\"text-slate-600 text-lg leading-6 mb-4\">\n            Optimize the costs of your logs, metrics, and traces. Send vendors\n            what you care about and eliminate the rest.\n          </p>\n        </div>\n        <div>\n          <h2\n            class=\"text-2xl font-medium text-indigo-500 mb-4 pl-8 bg-[url('/icons/adjustments-horizontal.svg')] bg-left bg-no-repeat pb-0.5\"\n          >\n            Take back ownership\n          </h2>\n          <p class=\"text-slate-600 text-lg leading-6 mb-4\">\n            Full-fidelity archives with cost-efficient cloud storage like S3.\n            Have all the context you need for compliance and post incident\n            analysis.\n          </p>\n        </div>\n      </div>\n    </section>\n    <!-- Features -->\n    <section class=\"bg-white\">\n      <div class=\"wrapper max-w-7xl mx-auto px-8 pt-16 pb-16\">\n        <div class=\"grid grid-cols-1 md:grid-cols-2 gap-8\">\n          <div class=\"flex mb-6\">\n            <div>\n              <h2 class=\"text-slate-600 text-lg font-medium inline\">\n                Flexible routing\n              </h2>\n              <p class=\"text-slate-400 text-lg inline\">\n                &mdash; Connect your telemetry to multiple destinations to\n                empower teams with your data. No more need to build separate\n                pipelines for observability, product, data science and customer\n                success.\n              </p>\n            </div>\n          </div>\n          <div class=\"flex mb-6\">\n            <div>\n              <h2 class=\"text-slate-600 text-lg font-medium inline\">\n                Data transforms\n              </h2>\n              <p class=\"text-slate-400 text-lg inline\">\n                &mdash; Enforce taxonomies, rename fields, parse data, and\n                extract fields. Pre-built functions let you work with data from\n                OpenTelemetry, Datadog or JSON using our structured event model.\n              </p>\n            </div>\n          </div>\n          <div class=\"flex mb-6\">\n            <div>\n              <h2 class=\"text-slate-600 text-lg font-medium inline\">\n                Fully observable\n              </h2>\n              <p class=\"text-slate-400 text-lg inline\">\n                &mdash; See your telemetry in real-time with live sampling of\n                events and metrics on ingestion, filtering, transform and\n                deliverability. Preview the impact of changes with live data\n                before deploying.\n              </p>\n            </div>\n          </div>\n          <div class=\"flex mb-6\">\n            <div>\n              <h2 class=\"text-slate-600 text-lg font-medium inline\">\n                Instant deploys\n              </h2>\n              <p class=\"text-slate-400 text-lg inline\">\n                &mdash; Empower anyone on the team to instantly deploy pipeline\n                changes through the API or UI and swiftly roll back those\n                changes in the event of any unexpected impacts or issues.\n              </p>\n            </div>\n          </div>\n        </div>\n      </div>\n    </section>\n    <!-- Join Waitlist Section -->\n    <section class=\"bg-teal-50 border-t border-b border-teal-100\">\n      <!-- add background image -->\n      <div class=\"max-w-7xl mx-auto px-8 py-20\">\n        <div class=\"text-center\">\n          <p class=\"text-4xl text-teal-400 w-4/6 mx-auto mb-4\">\n            Want more control over your telemetry?\n          </p>\n          <a href=\"/waitlist/\">\n            <button\n              class=\"mt-4 bg-teal-400 text-lg text-white py-3 px-8 rounded hover:bg-teal-500\"\n            >\n              Request Early Access\n            </button>\n          </a>\n        </div>\n      </div>\n    </section>\n  </div>\n</template>\n\n<style scoped>\n.normal {\n  animation: orbit-normal 20s linear infinite;\n}\n.reverse {\n  animation: orbit-reverse 20s linear infinite;\n}\n\n@keyframes orbit-normal {\n  from {\n    transform: rotate(0deg);\n  }\n  to {\n    transform: rotate(360deg);\n  }\n}\n\n@keyframes orbit-reverse {\n  from {\n    transform: rotate(0deg);\n  }\n  to {\n    transform: rotate(-360deg);\n  }\n}\n</style>\n"],"names":["_imports_0","publicAssetsURL","_imports_1","useHead"],"mappings":"4EAAuD,MAAeA,EAAAC,EAAgB,wBAAwB,ECAxCC,EAAAD,EAAgB,oCAAoC,gnOCClH,OAAAE,EAAA,CAAE,MAAO,iDAAA,CAAmD"}