oneuptime/Home/views/features-table.ejs
2023-07-29 13:10:45 -07:00

1033 lines
32 KiB
Plaintext

<div class="bg-white">
<div class="mx-auto max-w-7xl py-24 px-6 lg:px-8">
<div class="sm:align-center sm:flex sm:flex-col">
<h1 class="text-5xl font-bold tracking-tight text-gray-900 sm:text-center">The open platform for all your
observability needs.</h1>
<p class="mt-5 text-xl text-gray-500 sm:text-center">With OneUptime, you get a complete SRE toolchain
out-of-the-box. One interface. One conversation. One permission model. Thousands of features. You'll be amazed
at everything OneUptime can do today. And we're just getting started.</p>
</div>
<div
class="mt-12 space-y-4 sm:mt-16 sm:grid sm:grid-cols-2 sm:gap-6 sm:space-y-0 lg:mx-auto lg:max-w-4xl xl:mx-0 xl:max-w-none xl:grid-cols-4">
<div class="divide-y divide-gray-200 rounded-lg border border-gray-200 shadow-sm">
<div class="p-6">
<div class="text-lg font-medium leading-6 text-gray-900 flex space-x-2">
<div>
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5"
stroke="currentColor" class="w-6 h-6">
<path stroke-linecap="round" stroke-linejoin="round"
d="M9 12.75L11.25 15 15 9.75M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
</svg>
</div>
<div>Status Page</div>
</div>
<p class="mt-4 text-sm text-gray-500">Status Page for your Business</p>
</div>
<div class="px-6 pt-6 pb-8">
<h3 class="text-sm font-medium text-gray-900">What's included</h3>
<ul role="list" class="mt-6 space-y-4">
<li class="flex space-x-3">
<!-- Heroicon name: mini/check -->
<%- include('./partials/tick-icon') %>
<span class="text-sm text-gray-500"> Unlimited Public Status Pages</span>
</li>
<li class="flex space-x-3">
<!-- Heroicon name: mini/check -->
<%- include('./partials/tick-icon') %>
<span class="text-sm text-gray-500">Unlimited Private Status Pages</span>
</li>
<li class="flex space-x-3">
<!-- Heroicon name: mini/check -->
<%- include('./partials/tick-icon') %>
<span class="text-sm text-gray-500">Unlimited Subscribers</span>
</li>
<li class="flex space-x-3">
<!-- Heroicon name: mini/check -->
<%- include('./partials/tick-icon') %>
<span class="text-sm text-gray-500">Custom Domain Support</span>
</li>
<li class="flex space-x-3">
<!-- Heroicon name: mini/check -->
<%- include('./partials/tick-icon') %>
<span class="text-sm text-gray-500">Custom Branding</span>
</li>
<li class="flex space-x-3">
<!-- Heroicon name: mini/check -->
<%- include('./partials/tick-icon') %>
<span class="text-sm text-gray-500">Post Announcements</span>
</li>
<li class="flex space-x-3">
<!-- Heroicon name: mini/check -->
<%- include('./partials/tick-icon') %>
<span class="text-sm text-gray-500">Post Incidents</span>
</li>
<li class="flex space-x-3">
<!-- Heroicon name: mini/check -->
<%- include('./partials/tick-icon') %>
<span class="text-sm text-gray-500">Scheduled Maintenance</span>
</li>
</ul>
<h3 class="text-sm font-medium text-gray-900 mt-8">Coming soon</h3>
<ul role="list" class="mt-6 space-y-4">
<li class="flex space-x-3">
<%- include('./partials/comingsoon-icon') %>
<span class="text-sm text-gray-500">Show status of dependencies</span>
</li>
<li class="flex space-x-3">
<!-- Heroicon name: mini/check -->
<%- include('./partials/comingsoon-icon') %>
<span class="text-sm text-gray-500">SLA Certificates</span>
</li>
<li class="flex space-x-3">
<!-- Heroicon name: mini/check -->
<%- include('./partials/comingsoon-icon') %>
<span class="text-sm text-gray-500">RSS Feeds</span>
</li>
</ul>
</div>
<div class="p-6 border-t-2 border-gray-200">
<h2 class="text-lg font-medium leading-6 text-gray-900">OneUptime can replace</h2>
<p class="mt-4 text-sm text-gray-500">StatusPage.io, FreshPing, etc.</p>
</div>
</div>
<div class="divide-y divide-gray-200 rounded-lg border border-gray-200 shadow-sm">
<div class="p-6">
<div class="text-lg font-medium leading-6 text-gray-900 flex space-x-2">
<div>
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5"
stroke="currentColor" class="w-6 h-6">
<path stroke-linecap="round" stroke-linejoin="round"
d="M12 9v3.75m-9.303 3.376c-.866 1.5.217 3.374 1.948 3.374h14.71c1.73 0 2.813-1.874 1.948-3.374L13.949 3.378c-.866-1.5-3.032-1.5-3.898 0L2.697 16.126zM12 15.75h.007v.008H12v-.008z" />
</svg>
</div>
<div>Incident Management</div>
</div>
<p class="mt-4 text-sm text-gray-500">Respond to incidents faster</p>
</div>
<div class="px-6 pt-6 pb-8">
<h3 class="text-sm font-medium text-gray-900">What's included</h3>
<ul role="list" class="mt-6 space-y-4">
<li class="flex space-x-3">
<!-- Heroicon name: mini/check -->
<%- include('./partials/tick-icon') %>
<span class="text-sm text-gray-500">Integrates with monitoring tool</span>
</li>
<li class="flex space-x-3">
<!-- Heroicon name: mini/check -->
<%- include('./partials/tick-icon') %>
<span class="text-sm text-gray-500">Show Incident on Status Page</span>
</li>
<li class="flex space-x-3">
<!-- Heroicon name: mini/check -->
<%- include('./partials/tick-icon') %>
<span class="text-sm text-gray-500">See Root Cause</span>
</li>
<li class="flex space-x-3">
<!-- Heroicon name: mini/check -->
<%- include('./partials/tick-icon') %>
<span class="text-sm text-gray-500">Custom Incident States</span>
</li>
<li class="flex space-x-3">
<!-- Heroicon name: mini/check -->
<%- include('./partials/tick-icon') %>
<span class="text-sm text-gray-500">Custom Incident Severity</span>
</li>
<li class="flex space-x-3">
<!-- Heroicon name: mini/check -->
<%- include('./partials/tick-icon') %>
<span class="text-sm text-gray-500">Post Public Postmortem</span>
</li>
<li class="flex space-x-3">
<!-- Heroicon name: mini/check -->
<%- include('./partials/tick-icon') %>
<span class="text-sm text-gray-500">Private Postmortem Notes</span>
</li>
<li class="flex space-x-3">
<!-- Heroicon name: mini/check -->
<%- include('./partials/tick-icon') %>
<span class="text-sm text-gray-500">Integrate with Slack</span>
</li>
<li class="flex space-x-3">
<!-- Heroicon name: mini/check -->
<%- include('./partials/tick-icon') %>
<span class="text-sm text-gray-500">5000+ integrations</span>
</li>
<li class="flex space-x-3">
<!-- Heroicon name: mini/check -->
<%- include('./partials/tick-icon') %>
<span class="text-sm text-gray-500">Incident Workflows</span>
</li>
<li class="flex space-x-3">
<!-- Heroicon name: mini/check -->
<%- include('./partials/tick-icon') %>
<span class="text-sm text-gray-500">Active Monitoring</span>
</li>
<li class="flex space-x-3">
<!-- Heroicon name: mini/check -->
<%- include('./partials/tick-icon') %>
<span class="text-sm text-gray-500">On-Call Rotation</span>
</li>
<li class="flex space-x-3">
<!-- Heroicon name: mini/check -->
<%- include('./partials/tick-icon') %>
<span class="text-sm text-gray-500">Call & SMS Alerts</span>
</li>
</ul>
</div>
<div class="p-6 border-t-2 border-gray-200">
<h2 class="text-lg font-medium leading-6 text-gray-900">OneUptime can replace</h2>
<p class="mt-4 text-sm text-gray-500">Incident.io, Fire Hydrant, etc.</p>
</div>
</div>
<div class="divide-y divide-gray-200 rounded-lg border border-gray-200 shadow-sm">
<div class="p-6">
<div class="text-lg font-medium leading-6 text-gray-900 flex space-x-2">
<div>
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5"
stroke="currentColor" class="w-6 h-6">
<path stroke-linecap="round" stroke-linejoin="round"
d="M12 21a9.004 9.004 0 008.716-6.747M12 21a9.004 9.004 0 01-8.716-6.747M12 21c2.485 0 4.5-4.03 4.5-9S14.485 3 12 3m0 18c-2.485 0-4.5-4.03-4.5-9S9.515 3 12 3m0 0a8.997 8.997 0 017.843 4.582M12 3a8.997 8.997 0 00-7.843 4.582m15.686 0A11.953 11.953 0 0112 10.5c-2.998 0-5.74-1.1-7.843-2.918m15.686 0A8.959 8.959 0 0121 12c0 .778-.099 1.533-.284 2.253m0 0A17.919 17.919 0 0112 16.5c-3.162 0-6.133-.815-8.716-2.247m0 0A9.015 9.015 0 013 12c0-1.605.42-3.113 1.157-4.418" />
</svg>
</div>
<div>Monitoring</div>
</div>
<p class="mt-4 text-sm text-gray-500">Monitor status of any resource</p>
</div>
<div class="px-6 pt-6 pb-8">
<h3 class="text-sm font-medium text-gray-900">What's included</h3>
<ul role="list" class="mt-6 space-y-4">
<li class="flex space-x-3">
<%- include('./partials/tick-icon') %>
<span class="text-sm text-gray-500"> Static Monitors </span>
</li>
<li class="flex space-x-3">
<!-- Heroicon name: mini/check -->
<%- include('./partials/tick-icon') %>
<span class="text-sm text-gray-500">Advanced Workflows</span>
</li>
<li class="flex space-x-3">
<!-- Heroicon name: mini/check -->
<%- include('./partials/tick-icon') %>
<span class="text-sm text-gray-500">Monitor Website</span>
</li>
<li class="flex space-x-3">
<!-- Heroicon name: mini/check -->
<%- include('./partials/tick-icon') %>
<span class="text-sm text-gray-500">Monitor API</span>
</li>
<li class="flex space-x-3">
<!-- Heroicon name: mini/check -->
<%- include('./partials/tick-icon') %>
<span class="text-sm text-gray-500">Monitor IPv4 and IPv6</span>
</li>
<li class="flex space-x-3">
<!-- Heroicon name: mini/check -->
<%- include('./partials/tick-icon') %>
<span class="text-sm text-gray-500">On-Call and Alerts</span>
</li>
</ul>
<h3 class="text-sm font-medium text-gray-900 mt-5">Coming soon</h3>
<ul role="list" class="mt-6 space-y-4">
<li class="flex space-x-3">
<%- include('./partials/comingsoon-icon') %>
<span class="text-sm text-gray-500">Inbound Webhook Monitoring</span>
</li>
<li class="flex space-x-3">
<%- include('./partials/comingsoon-icon') %>
<span class="text-sm text-gray-500">Monitor VM's &amp; Servers</span>
</li>
<li class="flex space-x-3">
<%- include('./partials/comingsoon-icon') %>
<span class="text-sm text-gray-500">Monitor Docker Containers</span>
</li>
<li class="flex space-x-3">
<%- include('./partials/comingsoon-icon') %>
<span class="text-sm text-gray-500">Monitor Kubernetes Clusters</span>
</li>
<li class="flex space-x-3">
<%- include('./partials/comingsoon-icon') %>
<span class="text-sm text-gray-500">Monitor your Network</span>
</li>
</ul>
</div>
<div class="p-6 border-t-2 border-gray-200">
<h2 class="text-lg font-medium leading-6 text-gray-900">OneUptime will replace</h2>
<p class="mt-4 text-sm text-gray-500">Pingdom, New Relic, DataDog, etc. </p>
</div>
</div>
<div class="divide-y divide-gray-200 rounded-lg border border-gray-200 shadow-sm">
<div class="p-6">
<div class="text-lg font-medium leading-6 text-gray-900 flex space-x-2">
<div>
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5"
stroke="currentColor" class="w-6 h-6">
<path stroke-linecap="round" stroke-linejoin="round"
d="M2.25 6.75c0 8.284 6.716 15 15 15h2.25a2.25 2.25 0 002.25-2.25v-1.372c0-.516-.351-.966-.852-1.091l-4.423-1.106c-.44-.11-.902.055-1.173.417l-.97 1.293c-.282.376-.769.542-1.21.38a12.035 12.035 0 01-7.143-7.143c-.162-.441.004-.928.38-1.21l1.293-.97c.363-.271.527-.734.417-1.173L6.963 3.102a1.125 1.125 0 00-1.091-.852H4.5A2.25 2.25 0 002.25 4.5v2.25z" />
</svg>
</div>
<div>On-Call &amp; Alerts</div>
</div>
<p class="mt-4 text-sm text-gray-500">Alert your team</p>
</div>
<div class="px-6 pt-6 pb-8">
<h3 class="text-sm font-medium text-gray-900">What's included</h3>
<ul role="list" class="mt-6 space-y-4">
<li class="flex space-x-3">
<!-- Heroicon name: mini/check -->
<%- include('./partials/tick-icon') %>
<span class="text-sm text-gray-500">Phone Alerts</span>
</li>
<li class="flex space-x-3">
<!-- Heroicon name: mini/check -->
<%- include('./partials/tick-icon') %>
<span class="text-sm text-gray-500">SMS Alerts</span>
</li>
<li class="flex space-x-3">
<!-- Heroicon name: mini/check -->
<%- include('./partials/tick-icon') %>
<span class="text-sm text-gray-500">Email Alerts</span>
</li>
<li class="flex space-x-3">
<!-- Heroicon name: mini/check -->
<%- include('./partials/tick-icon') %>
<span class="text-sm text-gray-500">On-Call Escalation</span>
</li>
<li class="flex space-x-3">
<%- include('./partials/tick-icon') %>
<span class="text-sm text-gray-500">Integrates with Slack / Team</span>
</li>
<li class="flex space-x-3">
<%- include('./partials/tick-icon') %>
<span class="text-sm text-gray-500">Advanced Workflows</span>
</li>
<li class="flex space-x-3">
<%- include('./partials/tick-icon') %>
<span class="text-sm text-gray-500">On-Call Logs and Reports</span>
</li>
<h3 class="text-sm font-medium text-gray-900">Coming soon</h3>
<li class="flex space-x-3">
<%- include('./partials/comingsoon-icon') %>
<span class="text-sm text-gray-500">Webhook Alerts</span>
</li>
<li class="flex space-x-3">
<%- include('./partials/comingsoon-icon') %>
<span class="text-sm text-gray-500">On-Call Rotation</span>
</li>
<li class="flex space-x-3">
<%- include('./partials/comingsoon-icon') %>
<span class="text-sm text-gray-500">Vacation and OOO Policy</span>
</li>
<li class="flex space-x-3">
<%- include('./partials/comingsoon-icon') %>
<span class="text-sm text-gray-500">On-Call Pay</span>
</li>
</ul>
</div>
<div class="p-6 border-t-2 border-gray-200">
<h2 class="text-lg font-medium leading-6 text-gray-900">OneUptime will replace</h2>
<p class="mt-4 text-sm text-gray-500">PagerDuty, OpsGenie, Splunk</p>
</div>
</div>
</div>
</div>
</div>
<div class="bg-white">
<div class="mx-auto max-w-7xl py-24 pt-10 px-6 lg:px-8">
<div class="sm:align-center sm:flex sm:flex-col">
<h1 class="text-5xl font-bold tracking-tight text-gray-900 sm:text-center">...and these are coming next year.</h1>
<p class="mt-5 text-xl text-gray-500 sm:text-center">We truly envision to be the best open-source obersibvility
platform out there. All of this to help you build reliable software all of the time. Coming very soon.</p>
</div>
<div
class="mt-12 space-y-4 sm:mt-16 sm:grid sm:grid-cols-2 sm:gap-6 sm:space-y-0 lg:mx-auto lg:max-w-4xl xl:mx-0 xl:max-w-none xl:grid-cols-4">
<div class="divide-y divide-gray-200 rounded-lg border border-gray-200 shadow-sm">
<div class="p-6">
<div class="text-lg font-medium leading-6 text-gray-900 flex space-x-2">
<div>
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5"
stroke="currentColor" class="w-6 h-6">
<path stroke-linecap="round" stroke-linejoin="round"
d="M3.75 12h16.5m-16.5 3.75h16.5M3.75 19.5h16.5M5.625 4.5h12.75a1.875 1.875 0 010 3.75H5.625a1.875 1.875 0 010-3.75z" />
</svg>
</div>
<div>Logs Management</div>
</div>
<p class="mt-4 text-sm text-gray-500">Ingest logs from any source</p>
</div>
<div class="px-6 pt-6 pb-8">
<h3 class="text-sm font-medium text-gray-900">Coming soon</h3>
<ul role="list" class="mt-6 space-y-4">
<li class="flex space-x-3">
<!-- Heroicon name: mini/check -->
<%- include('./partials/comingsoon-icon') %>
<span class="text-sm text-gray-500">Ingest with OpenTelemetry</span>
</li>
<li class="flex space-x-3">
<%- include('./partials/comingsoon-icon') %>
<span class="text-sm text-gray-500">Application Logs</span>
</li>
<li class="flex space-x-3">
<%- include('./partials/comingsoon-icon') %>
<span class="text-sm text-gray-500">Container Logs</span>
</li>
<li class="flex space-x-3">
<!-- Heroicon name: mini/check -->
<%- include('./partials/comingsoon-icon') %>
<span class="text-sm text-gray-500">Custom Queries</span>
</li>
<li class="flex space-x-3">
<!-- Heroicon name: mini/check -->
<%- include('./partials/comingsoon-icon') %>
<span class="text-sm text-gray-500">Log Boards</span>
</li>
<li class="flex space-x-3">
<!-- Heroicon name: mini/check -->
<%- include('./partials/comingsoon-icon') %>
<span class="text-sm text-gray-500">Alerts</span>
</li>
<li class="flex space-x-3">
<!-- Heroicon name: mini/check -->
<%- include('./partials/comingsoon-icon') %>
<span class="text-sm text-gray-500">Security and Compliance</span>
</li>
<li class="flex space-x-3">
<!-- Heroicon name: mini/check -->
<%- include('./partials/comingsoon-icon') %>
<span class="text-sm text-gray-500">Advanced Reports</span>
</li>
<li class="flex space-x-3">
<!-- Heroicon name: mini/check -->
<%- include('./partials/comingsoon-icon') %>
<span class="text-sm text-gray-500">Advanced Workflows</span>
</li>
<li class="flex space-x-3">
<!-- Heroicon name: mini/check -->
<%- include('./partials/comingsoon-icon') %>
<span class="text-sm text-gray-500">Integrate with Slack / Teams</span>
</li>
<li class="flex space-x-3">
<!-- Heroicon name: mini/check -->
<%- include('./partials/comingsoon-icon') %>
<span class="text-sm text-gray-500">Export to Data Warehouse</span>
</li>
</ul>
</div>
<div class="p-6 border-t-2 border-gray-200">
<h2 class="text-lg font-medium leading-6 text-gray-900">OneUptime can replace</h2>
<p class="mt-4 text-sm text-gray-500">Logz.io, Loggly, etc.</p>
</div>
</div>
<div class="divide-y divide-gray-200 rounded-lg border border-gray-200 shadow-sm">
<div class="p-6">
<div class="text-lg font-medium leading-6 text-gray-900 flex space-x-2">
<div>
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5"
stroke="currentColor" class="w-6 h-6">
<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 013 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 01-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 01-1.125-1.125V4.125z" />
</svg>
</div>
<div>APM</div>
</div>
<p class="mt-4 text-sm text-gray-500">Monitor performance of your app</p>
</div>
<div class="px-6 pt-6 pb-8">
<h3 class="text-sm font-medium text-gray-900">Coming soon</h3>
<ul role="list" class="mt-6 space-y-4">
<li class="flex space-x-3">
<!-- Heroicon name: mini/check -->
<%- include('./partials/comingsoon-icon') %>
<span class="text-sm text-gray-500">APM with OpenTelemetry</span>
</li>
<li class="flex space-x-3">
<!-- Heroicon name: mini/check -->
<%- include('./partials/comingsoon-icon') %>
<span class="text-sm text-gray-500">Cross Microservice Visibility</span>
</li>
<li class="flex space-x-3">
<!-- Heroicon name: mini/check -->
<%- include('./partials/comingsoon-icon') %>
<span class="text-sm text-gray-500">Distributed Tracing</span>
</li>
<li class="flex space-x-3">
<!-- Heroicon name: mini/check -->
<%- include('./partials/comingsoon-icon') %>
<span class="text-sm text-gray-500">Deployment Tracking</span>
</li>
<li class="flex space-x-3">
<!-- Heroicon name: mini/check -->
<%- include('./partials/comingsoon-icon') %>
<span class="text-sm text-gray-500">Frontend Monitoring</span>
</li>
<li class="flex space-x-3">
<!-- Heroicon name: mini/check -->
<%- include('./partials/comingsoon-icon') %>
<span class="text-sm text-gray-500">Backend Monitoring</span>
</li>
<li class="flex space-x-3">
<!-- Heroicon name: mini/check -->
<%- include('./partials/comingsoon-icon') %>
<span class="text-sm text-gray-500">Query Monitoring</span>
</li>
<li class="flex space-x-3">
<!-- Heroicon name: mini/check -->
<%- include('./partials/comingsoon-icon') %>
<span class="text-sm text-gray-500">Code Level Tracing</span>
</li>
<li class="flex space-x-3">
<!-- Heroicon name: mini/check -->
<%- include('./partials/comingsoon-icon') %>
<span class="text-sm text-gray-500">Advanced Reports</span>
</li>
<li class="flex space-x-3">
<!-- Heroicon name: mini/check -->
<%- include('./partials/comingsoon-icon') %>
<span class="text-sm text-gray-500">Advanced Workflows</span>
</li>
<li class="flex space-x-3">
<!-- Heroicon name: mini/check -->
<%- include('./partials/comingsoon-icon') %>
<span class="text-sm text-gray-500">Integrate with Slack / Teams</span>
</li>
</ul>
</div>
<div class="p-6 border-t-2 border-gray-200">
<h2 class="text-lg font-medium leading-6 text-gray-900">OneUptime can replace</h2>
<p class="mt-4 text-sm text-gray-500">NewRelic, DataDog, etc.</p>
</div>
</div>
<div class="divide-y divide-gray-200 rounded-lg border border-gray-200 shadow-sm">
<div class="p-6">
<div class="text-lg font-medium leading-6 text-gray-900 flex space-x-2">
<div>
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5"
stroke="currentColor" class="w-6 h-6">
<path stroke-linecap="round" stroke-linejoin="round"
d="M12 9v3.75m9-.75a9 9 0 11-18 0 9 9 0 0118 0zm-9 3.75h.008v.008H12v-.008z" />
</svg>
</div>
<div>Error Tracking</div>
</div>
<p class="mt-4 text-sm text-gray-500">See issues that really matter</p>
</div>
<div class="px-6 pt-6 pb-8">
<h3 class="text-sm font-medium text-gray-900">Coming soon</h3>
<ul role="list" class="mt-6 space-y-4">
<li class="flex space-x-3">
<%- include('./partials/comingsoon-icon') %>
<span class="text-sm text-gray-500">Custom Queries</span>
</li>
<li class="flex space-x-3">
<%- include('./partials/comingsoon-icon') %>
<span class="text-sm text-gray-500">Dashboards and Reports</span>
</li>
<li class="flex space-x-3">
<%- include('./partials/comingsoon-icon') %>
<span class="text-sm text-gray-500">Session Replay</span>
</li>
<li class="flex space-x-3">
<%- include('./partials/comingsoon-icon') %>
<span class="text-sm text-gray-500">Cross Microservice Issues</span>
</li>
<li class="flex space-x-3">
<%- include('./partials/comingsoon-icon') %>
<span class="text-sm text-gray-500">Distributed Tracing</span>
</li>
<li class="flex space-x-3">
<%- include('./partials/comingsoon-icon') %>
<span class="text-sm text-gray-500">Stack Traces</span>
</li>
<li class="flex space-x-3">
<%- include('./partials/comingsoon-icon') %>
<span class="text-sm text-gray-500">Version Management</span>
</li>
<li class="flex space-x-3">
<%- include('./partials/comingsoon-icon') %>
<span class="text-sm text-gray-500">Releases</span>
</li>
<li class="flex space-x-3">
<%- include('./partials/comingsoon-icon') %>
<span class="text-sm text-gray-500">Issue Owners</span>
</li>
<li class="flex space-x-3">
<%- include('./partials/comingsoon-icon') %>
<span class="text-sm text-gray-500">Integrate with Slack / Teams</span>
</li>
<li class="flex space-x-3">
<%- include('./partials/comingsoon-icon') %>
<span class="text-sm text-gray-500">Advanced Workflows</span>
</li>
</ul>
</div>
<div class="p-6 border-t-2 border-gray-200">
<h2 class="text-lg font-medium leading-6 text-gray-900">OneUptime will replace</h2>
<p class="mt-4 text-sm text-gray-500">Sentry, Dynatrace and more. </p>
</div>
</div>
<div class="divide-y divide-gray-200 rounded-lg border border-gray-200 shadow-sm">
<div class="p-6">
<div class="text-lg font-medium leading-6 text-gray-900 flex space-x-2">
<div>
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5"
stroke="currentColor" class="w-6 h-6">
<path stroke-linecap="round" stroke-linejoin="round"
d="M9 12.75L11.25 15 15 9.75m-3-7.036A11.959 11.959 0 013.598 6 11.99 11.99 0 003 9.749c0 5.592 3.824 10.29 9 11.623 5.176-1.332 9-6.03 9-11.622 0-1.31-.21-2.571-.598-3.751h-.152c-3.196 0-6.1-1.248-8.25-3.285z" />
</svg>
</div>
<div> Vulnerability Scanning</div>
</div>
<p class="mt-4 text-sm text-gray-500"> Scan your app for vulnerabilties</p>
</div>
<div class="px-6 pt-6 pb-8">
<h3 class="text-sm font-medium text-gray-900">Coming soon</h3>
<ul role="list" class="mt-6 space-y-4">
<li class="flex space-x-3">
<%- include('./partials/comingsoon-icon') %>
<span class="text-sm text-gray-500">Application Scans</span>
</li>
<li class="flex space-x-3">
<%- include('./partials/comingsoon-icon') %>
<span class="text-sm text-gray-500">Conatiner Scans</span>
</li>
<li class="flex space-x-3">
<%- include('./partials/comingsoon-icon') %>
<span class="text-sm text-gray-500">Cloud Security</span>
</li>
<li class="flex space-x-3">
<%- include('./partials/comingsoon-icon') %>
<span class="text-sm text-gray-500">Compliance Alerts and SLA</span>
</li>
<li class="flex space-x-3">
<%- include('./partials/comingsoon-icon') %>
<span class="text-sm text-gray-500">Compliance Automation</span>
</li>
<li class="flex space-x-3">
<%- include('./partials/comingsoon-icon') %>
<span class="text-sm text-gray-500">Supply Chain Security</span>
</li>
<li class="flex space-x-3">
<%- include('./partials/comingsoon-icon') %>
<span class="text-sm text-gray-500">Knowledge Base</span>
</li>
<li class="flex space-x-3">
<%- include('./partials/comingsoon-icon') %>
<span class="text-sm text-gray-500">Terraform Integration</span>
</li>
<li class="flex space-x-3">
<%- include('./partials/comingsoon-icon') %>
<span class="text-sm text-gray-500">Integrates with Slack / Team</span>
</li>
<li class="flex space-x-3">
<%- include('./partials/comingsoon-icon') %>
<span class="text-sm text-gray-500">Advanced Workflows</span>
</li>
<li class="flex space-x-3">
<%- include('./partials/comingsoon-icon') %>
<span class="text-sm text-gray-500">Reports</span>
</li>
</ul>
</div>
<div class="p-6 border-t-2 border-gray-200">
<h2 class="text-lg font-medium leading-6 text-gray-900">OneUptime will replace</h2>
<p class="mt-4 text-sm text-gray-500">Snyk, OX Security and more.</p>
</div>
</div>
</div>
</div>
</div>