oneuptime/Home/Views/Partials/copilot.ejs

<style>
  .highlight {
    background-color: yellow;
    padding-left: 15px;
    padding-right: 15px;
    border-radius: 20px;
  }
</style>

<section class="mb-32 border-gray-100 border-t-2">
  <div class="relative isolate overflow-hidden bg-white px-6 py-24 sm:py-32 lg:overflow-visible lg:px-0">
    <div
      class="mx-auto grid max-w-2xl grid-cols-1 gap-x-8 gap-y-16 lg:mx-0 lg:max-w-none lg:grid-cols-2 lg:items-start lg:gap-y-10">
      <div
        class="lg:col-span-2 lg:col-start-1 lg:row-start-1 lg:mx-auto lg:grid lg:w-full lg:max-w-7xl lg:grid-cols-2 lg:gap-x-8 lg:px-8">
        <div class="lg:pr-4">
          <div class="lg:max-w-lg">
            <div class="inline-flex space-x-6 mb-5">
              <span
                class="rounded-full bg-indigo-600/10 px-3 py-1 text-sm font-semibold leading-6 text-indigo-600 ring-1 ring-inset ring-indigo-600/10">Reliability
                Copilot</span>
            </div>
            <h1 class="mt-2 text-3xl font-bold tracking-tight text-gray-900 sm:text-4xl">Spending days debugging?</h1>
            <p class="mt-6 text-xl leading-8 text-gray-700 ">
              OneUptime is building next frontier in software observability.
              <span class="highlight">We not only find issues with your software, but also fix it for you
                automatically.</span>
            </p>
          </div>
        </div>
      </div>
      <div class="-ml-12 -mt-12 p-12 lg:sticky lg:top-4 lg:col-start-2 lg:row-span-2 lg:row-start-1 lg:overflow-hidden">
        <img class="w-[48rem] max-w-none rounded-xl bg-gray-900 shadow-xl ring-1 ring-gray-400/10 sm:w-[57rem]"
          src="/img/copilot.png" alt="">
      </div>
      <div
        class="lg:col-span-2 lg:col-start-1 lg:row-start-2 lg:mx-auto lg:grid lg:w-full lg:max-w-7xl lg:grid-cols-2 lg:gap-x-8 lg:px-8">
        <div class="lg:pr-4">
          <div class="max-w-xl text-base leading-7 text-gray-700 lg:max-w-lg">
            <p>
              OneUptime integrates with OpenTelemetry to collect logs, metrics, traces from your software and
              infrastructure. We then use generative AI to fix the issues
              in your code. 
              <span class="highlight">All you see is a pull request with the fixes and a detailed report of what was
                fixed waiting to be reviewed and merged.</span>
            </p>
            <ul role="list" class="mt-8 space-y-8 text-gray-600">
              <li class="flex gap-x-3">
                <svg class="mt-1 h-5 w-5 flex-none text-indigo-600" viewBox="0 0 20 20" fill="currentColor"
                  aria-hidden="true">
                  <path stroke-linecap="round" stroke-linejoin="round"
                    d="m3.75 13.5 10.5-11.25L12 10.5h8.25L9.75 21.75 12 13.5H3.75Z" />
                </svg>
                <span><strong class="font-semibold text-gray-900">
                    Automatically add telemetry code.
                  </strong>
                  No need to manually add it. Add tracing, metrics, and logs in your codebase with a single
                  click.
                </span>
              </li>
              <li class="flex gap-x-3">
                <svg class="mt-1 h-5 w-5 flex-none text-indigo-600" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2.5" stroke="currentColor" class="size-6">
                  <path stroke-linecap="round" stroke-linejoin="round" d="M7.5 3.75H6A2.25 2.25 0 0 0 3.75 6v1.5M16.5 3.75H18A2.25 2.25 0 0 1 20.25 6v1.5m0 9V18A2.25 2.25 0 0 1 18 20.25h-1.5m-9 0H6A2.25 2.25 0 0 1 3.75 18v-1.5M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z" />
                </svg>
                
                
                <span><strong class="font-semibold text-gray-900">Fix exceptions automatically.</strong>
                  When we notice exceptions in your traces or logs, we automatically fix the issue in your codebase.
                </span>
              </li>
              <li class="flex gap-x-3">
                <svg class="mt-1 h-5 w-5 flex-none text-indigo-600" viewBox="0 0 20 20" fill="currentColor"
                  aria-hidden="true">

                  <path stroke-linecap="round" stroke-linejoin="round"
                    d="M3 13.125C3 12.504 3.504 12 4.125 12h2.25c.621 0 1.125.504 1.125 1.125v6.75C7.5 20.496 6.996 21 6.375 21h-2.25A1.125 1.125 0 0 1 3 19.875v-6.75ZM9.75 8.625c0-.621.504-1.125 1.125-1.125h2.25c.621 0 1.125.504 1.125 1.125v11.25c0 .621-.504 1.125-1.125 1.125h-2.25a1.125 1.125 0 0 1-1.125-1.125V8.625ZM16.5 4.125c0-.621.504-1.125 1.125-1.125h2.25C20.496 3 21 3.504 21 4.125v15.75c0 .621-.504 1.125-1.125 1.125h-2.25a1.125 1.125 0 0 1-1.125-1.125V4.125Z" />


                </svg>
                <span><strong class="font-semibold text-gray-900">Improve performance automatically</strong>
                  We look at the traces that take the longest time to execute and and automatically create a pull
                  request with a fix.
                </span>
              </li>
            </ul>
            <p class="mt-8">
              Less time looking at graphs and charts (like in other obervability tools), more time reviewing at fixed code.
            </p>
            <h2 class="mt-16 text-2xl font-bold tracking-tight text-gray-900">
              Enterprise? We have you covered.
            </h2>
            <p class="mt-6">
              <ul role="list" class="mt-8 space-y-8 text-gray-600">
              <li class="flex gap-x-3">
               
                <svg class="mt-1 h-5 w-5 flex-none text-indigo-600" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2.5" stroke="currentColor" class="size-6">
                  <path stroke-linecap="round" stroke-linejoin="round" d="m21 7.5-9-5.25L3 7.5m18 0-9 5.25m9-5.25v9l-9 5.25M3 7.5l9 5.25M3 7.5v9l9 5.25m0-9v9" />
                </svg>
                
                <span><strong class="font-semibold text-gray-900">
                    Use AI model of your choice.
                  </strong>
                  OneUptime works with any AI model of your choice. Self host your AI model and no data or code is sent
                  to us.
                </span>
              </li>
              <li class="flex gap-x-3">
               
                <svg class="mt-1 h-5 w-5 flex-none text-indigo-600" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2.5" stroke="currentColor" class="size-6">
                  <path stroke-linecap="round" stroke-linejoin="round" d="M17.25 6.75 22.5 12l-5.25 5.25m-10.5 0L1.5 12l5.25-5.25m7.5-3-4.5 16.5" />
                </svg>
                
                <span><strong class="font-semibold text-gray-900">
                    We don't see, store or train on your code.
                  </strong>
                  Regardless whether you are on the free tier or enterprise tier, we don't store or train on your code. No part of your code is sent to us.
                </span>
              </li>
            </ul>
            </p>
          </div>
        </div>
      </div>
    </div>
  </div>
</section>