code cleanup
This commit is contained in:
timurgordon
parent
3aacf5db67
commit
f1a99b9c99
@ -1,9 +1,18 @@
|
|||||||
/*! purgecss start ignore */
|
/*! purgecss start ignore */
|
||||||
@import 'nav.css';
|
@import "nav.css";
|
||||||
@import 'code.css';
|
@import "code.css";
|
||||||
@import 'tailwindcss/base';
|
@import "tailwindcss/base";
|
||||||
@import 'layout.css';
|
@import "layout.css";
|
||||||
@import 'tailwindcss/components';
|
@import "tailwindcss/components";
|
||||||
@import 'ffoxobliq.css';
|
@import "ffoxobliq.css";
|
||||||
/*! purgecss end ignore */
|
/*! purgecss end ignore */
|
||||||
@import 'tailwindcss/utilities';
|
@import "tailwindcss/utilities";
|
||||||
|
|
||||||
|
/* Custom CSS for header partial */
|
||||||
|
.backdrop-blur {
|
||||||
|
-webkit-backdrop-filter: blur(40px);
|
||||||
|
}
|
||||||
|
|
||||||
|
.bg-semi-white {
|
||||||
|
background-color: rgba(255, 255, 255, 0.75);
|
||||||
|
}
|
||||||
|
|||||||
@ -1,7 +0,0 @@
|
|||||||
.backdrop-blur {
|
|
||||||
-webkit-backdrop-filter: blur(40px);
|
|
||||||
}
|
|
||||||
|
|
||||||
.bg-semi-white {
|
|
||||||
background-color: rgba(255, 255, 255, 0.75);
|
|
||||||
}
|
|
||||||
BIN
static/.DS_Store
vendored
BIN
static/.DS_Store
vendored
Binary file not shown.
@ -1,7 +1,7 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html lang="en" charset="utf-8">
|
<html lang="en" charset="utf-8">
|
||||||
{% include "partials/head.html" %}
|
{% include "partials/head.html" %}
|
||||||
{% include "partials/navbar.html" %}
|
{% include "partials/header.html" %}
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
|
|
||||||
|
|||||||
@ -1,9 +1,9 @@
|
|||||||
{% extends "_default/base.html" %}
|
{% extends "_default/base.html" %}
|
||||||
{% block content %}
|
{% block content %}
|
||||||
|
|
||||||
<!-- Default page template for blog posts and basic informative markdown files -->
|
<!-- Page template for blog posts and basic informative markdown files -->
|
||||||
<h1 class="title">
|
<h1 class="title">
|
||||||
{{ section.title }}
|
{{ section.title }} yooo
|
||||||
</h1>
|
</h1>
|
||||||
<ul>
|
<ul>
|
||||||
{% for page in section.pages %}
|
{% for page in section.pages %}
|
||||||
|
|||||||
@ -1,23 +1,482 @@
|
|||||||
|
<!--
|
||||||
|
Tailwind UI components require Tailwind CSS v1.8 and the @tailwindcss/ui plugin.
|
||||||
|
Read the documentation to get started: https://tailwindui.com/documentation
|
||||||
|
--><!-- This example requires Tailwind CSS v1.4.0+ -->
|
||||||
|
<script type="text/javascript">
|
||||||
|
var inDisplay = "";
|
||||||
|
|
||||||
<header class="flex m-0 items-center justify-between fixed bg-white w-full h-16">
|
function toggleMenu() {
|
||||||
<nav class="text-black font-bold mt-2 pt-1 text-lg ml-4 md:ml-8 lg:ml-10 xb:ml-16 w-full">
|
if (inDisplay === "learn") {
|
||||||
<a href="/" class="font-sans text-black active:text-gray-400 hover:text-gray-400" style="border: 0 !important; text-decoration: none !important;">OurWorld</a>
|
hideMenu();
|
||||||
</nav>
|
inDisplay = "";
|
||||||
<input type="checkbox" id="nav-toggle" class="nav-toggle" aria-hidden="true" />
|
}
|
||||||
<label for="nav-toggle" class="nav__icon" aria-hidden="true">
|
else {
|
||||||
Expand the menu
|
showMenu();
|
||||||
<span class="nav__icon-line"></span>
|
inDisplay = "learn";
|
||||||
<span class="nav__icon-line"></span>
|
}
|
||||||
<span class="nav__icon-line"></span>
|
}
|
||||||
</label>
|
|
||||||
<nav role="navigation" class="nav h-16">
|
function showMenu() {
|
||||||
<ul class="nav__items">
|
document.getElementById('learn').className = "absolute inset-x-0 transform shadow-lg backdrop-blur transition ease-out duration-150 opacity-1 -translate-y-0";
|
||||||
<li class="nav__item">
|
}
|
||||||
<a href="/about" class="text-black" title="About">About</a>
|
|
||||||
</li>
|
function hideMenu() {
|
||||||
<li class="nav__item">
|
document.getElementById('learn').className = "absolute inset-x-0 transform shadow-lg backdrop-blur transition ease-in duration-150 opacity-0 -translate-y-1";
|
||||||
<a href="/blog" class="text-black" title="Posts">Posts</a>
|
}
|
||||||
</li>
|
|
||||||
</ul>
|
window.onload = function(){
|
||||||
</nav>
|
document.getElementById("learn-btn").addEventListener( 'click', toggleMenu);
|
||||||
</header>
|
}
|
||||||
|
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
<div class="z-10 relative bg-semi-white">
|
||||||
|
<div class="relative z-10 shadow">
|
||||||
|
<div class="max-w-7xl mx-auto flex justify-between items-center px-4 py-5 sm:px-6 sm:py-4 lg:px-8 md:justify-start md:space-x-10">
|
||||||
|
<div>
|
||||||
|
<a href="#" class="flex">
|
||||||
|
<img class="w-20 h-auto sm:w-32" src="images/ourworld_logo.png" alt="Workflow" />
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
<div class="-mr-2 -my-2 md:hidden">
|
||||||
|
<button type="button" class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-gray-500 hover:bg-gray-100 focus:outline-none focus:bg-gray-100 focus:text-gray-500 transition duration-150 ease-in-out">
|
||||||
|
<!-- Heroicon name: menu -->
|
||||||
|
<svg class="h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||||||
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
|
||||||
|
</svg>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
<div class="hidden md:flex-1 md:flex md:items-center md:justify-between md:space-x-12">
|
||||||
|
<nav class="flex space-x-10">
|
||||||
|
<div class="relative">
|
||||||
|
<!-- Item active: "text-gray-900", Item inactive: "text-gray-500" -->
|
||||||
|
<button type="button" id="learn-btn" class="text-gray-500 group inline-flex items-center space-x-2 text-sm leading-6 font-normal hover:text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150">
|
||||||
|
<span>Learn</span>
|
||||||
|
<!--
|
||||||
|
Heroicon name: chevron-down
|
||||||
|
|
||||||
|
Item active: "text-gray-600", Item inactive: "text-gray-400"
|
||||||
|
-->
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<a href="#" class="text-sm leading-6 font-normal text-gray-500 hover:text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150">
|
||||||
|
Developers
|
||||||
|
</a>
|
||||||
|
<a href="/blog" class="text-sm leading-6 font-normal text-gray-500 hover:text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150">
|
||||||
|
Founders & Creators
|
||||||
|
</a>
|
||||||
|
<a href="/blog" class="text-sm leading-6 font-normal text-gray-500 hover:text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150">
|
||||||
|
Community
|
||||||
|
</a>
|
||||||
|
<a href="/blog" class="text-sm leading-6 font-normal text-gray-500 hover:text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150">
|
||||||
|
Blog
|
||||||
|
</a>
|
||||||
|
<a href="/blog" class="text-sm leading-6 font-normal text-gray-500 hover:text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150">
|
||||||
|
Career
|
||||||
|
</a>
|
||||||
|
<div class="relative">
|
||||||
|
<!-- Item active: "text-gray-900", Item inactive: "text-gray-500" -->
|
||||||
|
<button type="button" class="text-gray-500 group inline-flex items-center space-x-2 text-sm leading-6 font-normal hover:text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150">
|
||||||
|
<span>Menu</span>
|
||||||
|
<!--
|
||||||
|
Heroicon name: chevron-down
|
||||||
|
|
||||||
|
Item active: "text-gray-600", Item inactive: "text-gray-400"
|
||||||
|
-->
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
<div class="flex items-center space-x-8">
|
||||||
|
<a href="#" class="text-sm leading-6 font-normal text-gray-500 hover:text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150">
|
||||||
|
Sign in
|
||||||
|
</a>
|
||||||
|
<span class="inline-flex rounded-md shadow-sm">
|
||||||
|
<a href="#" class="inline-flex items-center justify-center px-4 py-2 border border-transparent text-sm leading-6 font-normal rounded-md text-white bg-indigo-600 hover:bg-indigo-500 focus:outline-none focus:border-indigo-700 focus:shadow-outline-indigo active:bg-indigo-700 transition ease-in-out duration-150">
|
||||||
|
Sign up
|
||||||
|
</a>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- learn menu -->
|
||||||
|
<!--
|
||||||
|
'learn' flyout menu, show/hide based on flyout menu state.
|
||||||
|
|
||||||
|
Entering: "transition ease-out duration-200"
|
||||||
|
From: "opacity-0 -translate-y-1"
|
||||||
|
To: "opacity-100 translate-y-0"
|
||||||
|
Leaving: "transition ease-in duration-150"
|
||||||
|
From: "opacity-100 translate-y-0"
|
||||||
|
To: "opacity-0 -translate-y-1"
|
||||||
|
md:block or hidden
|
||||||
|
-->
|
||||||
|
<div id="learn" class="opacity-0 -translate-y-1 absolute inset-x-0 transform shadow-lg backdrop-blur">
|
||||||
|
<div class="bg-semi-white">
|
||||||
|
<div class="max-w-7xl mx-auto grid gap-y-6 px-4 py-6 sm:grid-cols-2 sm:gap-8 sm:px-6 sm:py-8 lg:grid-cols-4 lg:px-8 lg:py-12 xl:py-16">
|
||||||
|
<a href="#" class="-m-3 p-3 flex flex-col justify-between space-y-6 rounded-lg transition ease-in-out duration-150">
|
||||||
|
<div class="space-x-4 flex md:h-full lg:flex-col lg:space-x-0 lg:space-y-4">
|
||||||
|
<div class="flex-shrink-0">
|
||||||
|
<span class="inline-flex items-center justify-center h-10 w-10 rounded-md bg-indigo-500 text-white sm:h-12 sm:w-12">
|
||||||
|
<!-- Heroicon name: chart-bar -->
|
||||||
|
<svg class="h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||||||
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z" />
|
||||||
|
</svg>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
<div class="space-y-2 md:flex-1 md:flex md:flex-col md:justify-between lg:space-y-4">
|
||||||
|
<div class="space-y-1">
|
||||||
|
<p class="text-sm leading-6 font-normal text-gray-900">
|
||||||
|
Analytics
|
||||||
|
</p>
|
||||||
|
<p class="text-sm leading-5 text-gray-500">
|
||||||
|
Get a better understanding of where your traffic is coming from.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="space-y-2 md:flex-1 md:flex md:flex-col md:justify-between lg:space-y-4">
|
||||||
|
<div class="space-y-1">
|
||||||
|
<p class="text-sm leading-6 font-normal text-gray-900">
|
||||||
|
Analytics
|
||||||
|
</p>
|
||||||
|
<p class="text-sm leading-5 text-gray-500">
|
||||||
|
Get a better understanding of where your traffic is coming from.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
<a href="#" class="-m-3 p-3 flex flex-col justify-between space-y-6 rounded-lg transition ease-in-out duration-150">
|
||||||
|
<div class="space-x-4 flex md:h-full lg:flex-col lg:space-x-0 lg:space-y-4">
|
||||||
|
<div class="flex-shrink-0">
|
||||||
|
<span class="inline-flex items-center justify-center h-10 w-10 rounded-md bg-indigo-500 text-white sm:h-12 sm:w-12">
|
||||||
|
<!-- Heroicon name: cursor-click -->
|
||||||
|
<svg class="h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||||||
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 15l-2 5L9 9l11 4-5 2zm0 0l5 5M7.188 2.239l.777 2.897M5.136 7.965l-2.898-.777M13.95 4.05l-2.122 2.122m-5.657 5.656l-2.12 2.122" />
|
||||||
|
</svg>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
<div class="space-y-2 md:flex-1 md:flex md:flex-col md:justify-between lg:space-y-4">
|
||||||
|
<div class="space-y-1">
|
||||||
|
<p class="text-sm leading-6 font-normal text-gray-900">
|
||||||
|
Engagement
|
||||||
|
</p>
|
||||||
|
<p class="text-sm leading-5 text-gray-500">
|
||||||
|
Speak directly to your customers in a more meaningful way.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
<a href="#" class="-m-3 p-3 flex flex-col justify-between space-y-6 rounded-lg transition ease-in-out duration-150">
|
||||||
|
<div class="space-x-4 flex md:h-full lg:flex-col lg:space-x-0 lg:space-y-4">
|
||||||
|
<div class="flex-shrink-0">
|
||||||
|
<span class="inline-flex items-center justify-center h-10 w-10 rounded-md bg-indigo-500 text-white sm:h-12 sm:w-12">
|
||||||
|
<!-- Heroicon name: shield-check -->
|
||||||
|
<svg class="h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||||||
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m5.618-4.016A11.955 11.955 0 0112 2.944a11.955 11.955 0 01-8.618 3.04A12.02 12.02 0 003 9c0 5.591 3.824 10.29 9 11.622 5.176-1.332 9-6.03 9-11.622 0-1.042-.133-2.052-.382-3.016z" />
|
||||||
|
</svg>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
<div class="space-y-2 md:flex-1 md:flex md:flex-col md:justify-between lg:space-y-4">
|
||||||
|
<div class="space-y-1">
|
||||||
|
<p class="text-sm leading-6 font-normal text-gray-900">
|
||||||
|
Security
|
||||||
|
</p>
|
||||||
|
<p class="text-sm leading-5 text-gray-500">
|
||||||
|
Your customer data will be safe and secure.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
<a href="#" class="-m-3 p-3 flex flex-col justify-between space-y-6 rounded-lg transition ease-in-out duration-150">
|
||||||
|
<div class="space-x-4 flex md:h-full lg:flex-col lg:space-x-0 lg:space-y-4">
|
||||||
|
<div class="flex-shrink-0">
|
||||||
|
<span class="inline-flex items-center justify-center h-10 w-10 rounded-md bg-indigo-500 text-white sm:h-12 sm:w-12">
|
||||||
|
<!-- Heroicon name: view-grid -->
|
||||||
|
<svg class="h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||||||
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2H6a2 2 0 01-2-2V6zM14 6a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2h-2a2 2 0 01-2-2V6zM4 16a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2H6a2 2 0 01-2-2v-2zM14 16a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2h-2a2 2 0 01-2-2v-2z" />
|
||||||
|
</svg>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
<div class="space-y-2 md:flex-1 md:flex md:flex-col md:justify-between lg:space-y-4">
|
||||||
|
<div class="space-y-1">
|
||||||
|
<p class="text-sm leading-6 font-normal text-gray-900">
|
||||||
|
Integrations
|
||||||
|
</p>
|
||||||
|
<p class="text-sm leading-5 text-gray-500">
|
||||||
|
Connect with third-party tools that you're already using.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- More menu -->
|
||||||
|
<!--
|
||||||
|
'More' flyout menu, show/hide based on flyout menu state.
|
||||||
|
|
||||||
|
Entering: "transition ease-out duration-200"
|
||||||
|
From: "opacity-0 -translate-y-1"
|
||||||
|
To: "opacity-100 translate-y-0"
|
||||||
|
Leaving: "transition ease-in duration-150"
|
||||||
|
From: "opacity-100 translate-y-0"
|
||||||
|
To: "opacity-0 -translate-y-1"
|
||||||
|
-->
|
||||||
|
|
||||||
|
<!--
|
||||||
|
Tailwind UI components require Tailwind CSS v1.8 and the @tailwindcss/ui plugin.
|
||||||
|
Read the documentation to get started: https://tailwindui.com/documentation
|
||||||
|
--><!-- This example requires Tailwind CSS v1.4.0+ -->
|
||||||
|
|
||||||
|
|
||||||
|
<!--
|
||||||
|
Flyout menu, show/hide based on flyout menu state.
|
||||||
|
|
||||||
|
Entering: "transition ease-out duration-200"
|
||||||
|
From: "opacity-0 -translate-y-1"
|
||||||
|
To: "opacity-100 translate-y-0"
|
||||||
|
Leaving: "transition ease-in duration-150"
|
||||||
|
From: "opacity-100 translate-y-0"
|
||||||
|
To: "opacity-0 -translate-y-1"
|
||||||
|
-->
|
||||||
|
<div id="menu" class="hidden absolute inset-x-0 transform shadow-lg">
|
||||||
|
<div class="bg-semi-white">
|
||||||
|
<div class="max-w-7xl mx-auto grid gap-y-6 px-4 py-6 sm:grid-cols-2 sm:gap-8 sm:px-6 sm:py-8 lg:grid-cols-4 lg:px-8 lg:py-12 xl:py-16">
|
||||||
|
<a href="#" class="-m-3 p-3 flex flex-col justify-between space-y-6 rounded-lg transition ease-in-out duration-150">
|
||||||
|
<div class="space-x-4 flex md:h-full lg:flex-col lg:space-x-0 lg:space-y-4">
|
||||||
|
<div class="flex-shrink-0">
|
||||||
|
<span class="inline-flex items-center justify-center h-10 w-10 rounded-md bg-indigo-500 text-white sm:h-12 sm:w-12">
|
||||||
|
<!-- Heroicon name: chart-bar -->
|
||||||
|
<svg class="h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||||||
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z" />
|
||||||
|
</svg>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
<div class="space-y-2 md:flex-1 md:flex md:flex-col md:justify-between lg:space-y-4">
|
||||||
|
<div class="space-y-1">
|
||||||
|
<p class="text-sm leading-6 font-normal text-gray-900">
|
||||||
|
Analytics
|
||||||
|
</p>
|
||||||
|
<p class="text-sm leading-5 text-gray-500">
|
||||||
|
Get a better understanding of where your traffic is coming from.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<p class="text-sm leading-5 font-normal text-indigo-600">
|
||||||
|
learn more →
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
<a href="#" class="-m-3 p-3 flex flex-col justify-between space-y-6 rounded-lg transition ease-in-out duration-150">
|
||||||
|
<div class="space-x-4 flex md:h-full lg:flex-col lg:space-x-0 lg:space-y-4">
|
||||||
|
<div class="flex-shrink-0">
|
||||||
|
<span class="inline-flex items-center justify-center h-10 w-10 rounded-md bg-indigo-500 text-white sm:h-12 sm:w-12">
|
||||||
|
<!-- Heroicon name: cursor-click -->
|
||||||
|
<svg class="h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||||||
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 15l-2 5L9 9l11 4-5 2zm0 0l5 5M7.188 2.239l.777 2.897M5.136 7.965l-2.898-.777M13.95 4.05l-2.122 2.122m-5.657 5.656l-2.12 2.122" />
|
||||||
|
</svg>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
<div class="space-y-2 md:flex-1 md:flex md:flex-col md:justify-between lg:space-y-4">
|
||||||
|
<div class="space-y-1">
|
||||||
|
<p class="text-sm leading-6 font-normal text-gray-900">
|
||||||
|
Engagement
|
||||||
|
</p>
|
||||||
|
<p class="text-sm leading-5 text-gray-500">
|
||||||
|
Speak directly to your customers in a more meaningful way.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<p class="text-sm leading-5 font-normal text-indigo-600">
|
||||||
|
learn more →
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
<a href="#" class="-m-3 p-3 flex flex-col justify-between space-y-6 rounded-lg transition ease-in-out duration-150">
|
||||||
|
<div class="space-x-4 flex md:h-full lg:flex-col lg:space-x-0 lg:space-y-4">
|
||||||
|
<div class="flex-shrink-0">
|
||||||
|
<span class="inline-flex items-center justify-center h-10 w-10 rounded-md bg-indigo-500 text-white sm:h-12 sm:w-12">
|
||||||
|
<!-- Heroicon name: shield-check -->
|
||||||
|
<svg class="h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||||||
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m5.618-4.016A11.955 11.955 0 0112 2.944a11.955 11.955 0 01-8.618 3.04A12.02 12.02 0 003 9c0 5.591 3.824 10.29 9 11.622 5.176-1.332 9-6.03 9-11.622 0-1.042-.133-2.052-.382-3.016z" />
|
||||||
|
</svg>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
<div class="space-y-2 md:flex-1 md:flex md:flex-col md:justify-between lg:space-y-4">
|
||||||
|
<div class="space-y-1">
|
||||||
|
<p class="text-sm leading-6 font-normal text-gray-900">
|
||||||
|
Security
|
||||||
|
</p>
|
||||||
|
<p class="text-sm leading-5 text-gray-500">
|
||||||
|
Your customer data will be safe and secure.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<p class="text-sm leading-5 font-normal text-indigo-600">
|
||||||
|
learn more →
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
<a href="#" class="-m-3 p-3 flex flex-col justify-between space-y-6 rounded-lg hover:bg-gray-50 transition ease-in-out duration-150">
|
||||||
|
<div class="space-x-4 flex md:h-full lg:flex-col lg:space-x-0 lg:space-y-4">
|
||||||
|
<div class="flex-shrink-0">
|
||||||
|
<span class="inline-flex items-center justify-center h-10 w-10 rounded-md bg-indigo-500 text-white sm:h-12 sm:w-12">
|
||||||
|
<!-- Heroicon name: view-grid -->
|
||||||
|
<svg class="h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||||||
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2H6a2 2 0 01-2-2V6zM14 6a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2h-2a2 2 0 01-2-2V6zM4 16a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2H6a2 2 0 01-2-2v-2zM14 16a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2h-2a2 2 0 01-2-2v-2z" />
|
||||||
|
</svg>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
<div class="space-y-2 md:flex-1 md:flex md:flex-col md:justify-between lg:space-y-4">
|
||||||
|
<div class="space-y-1">
|
||||||
|
<p class="text-sm leading-6 font-normal text-gray-900">
|
||||||
|
Integrations
|
||||||
|
</p>
|
||||||
|
<p class="text-sm leading-5 text-gray-500">
|
||||||
|
Connect with third-party tools that you're already using.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<p class="text-sm leading-5 font-normal text-indigo-600">
|
||||||
|
learn more →
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!--
|
||||||
|
Mobile menu, show/hide based on mobile menu state.
|
||||||
|
|
||||||
|
Entering: "duration-200 ease-out"
|
||||||
|
From: "opacity-0 scale-95"
|
||||||
|
To: "opacity-100 scale-100"
|
||||||
|
Leaving: "duration-100 ease-in"
|
||||||
|
From: "opacity-100 scale-100"
|
||||||
|
To: "opacity-0 scale-95"
|
||||||
|
-->
|
||||||
|
<div class="absolute z-20 top-0 inset-x-0 p-2 transition transform origin-top-right md:hidden">
|
||||||
|
<div class="rounded-lg shadow-lg">
|
||||||
|
<div class="rounded-lg shadow-xs bg-white divide-y-2 divide-gray-50">
|
||||||
|
<div class="pt-5 pb-6 px-5 space-y-6 sm:space-y-8 sm:pb-8">
|
||||||
|
<div class="flex items-center justify-between">
|
||||||
|
<div>
|
||||||
|
<img class="h-8 w-auto" src="https://tailwindui.com/img/logos/v1/workflow-mark-on-white.svg" alt="Workflow" />
|
||||||
|
</div>
|
||||||
|
<div class="-mr-2">
|
||||||
|
<button type="button" class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-gray-500 hover:bg-gray-100 focus:outline-none focus:bg-gray-100 focus:text-gray-500 transition duration-150 ease-in-out">
|
||||||
|
<!-- Heroicon name: x -->
|
||||||
|
<svg class="h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||||||
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
|
||||||
|
</svg>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<nav class="space-y-8">
|
||||||
|
<div class="grid gap-7 sm:grid-cols-2 sm:gap-y-8 sm:gap-x-4">
|
||||||
|
<a href="#" class="-m-3 space-x-4 flex items-center p-3 rounded-lg hover:bg-gray-50 transition ease-in-out duration-150">
|
||||||
|
<div class="flex-shrink-0 flex items-center justify-center h-10 w-10 rounded-md bg-indigo-500 text-white sm:h-12 sm:w-12">
|
||||||
|
<!-- Heroicon name: chart-bar -->
|
||||||
|
<svg class="h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||||||
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z" />
|
||||||
|
</svg>
|
||||||
|
</div>
|
||||||
|
<div class="text-sm leading-6 font-normal text-gray-900">
|
||||||
|
Analytics
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
<a href="#" class="-m-3 space-x-4 flex items-center p-3 rounded-lg hover:bg-gray-50 transition ease-in-out duration-150">
|
||||||
|
<div class="flex-shrink-0 flex items-center justify-center h-10 w-10 rounded-md bg-indigo-500 text-white sm:h-12 sm:w-12">
|
||||||
|
<!-- Heroicon name: cursor-click -->
|
||||||
|
<svg class="h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||||||
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 15l-2 5L9 9l11 4-5 2zm0 0l5 5M7.188 2.239l.777 2.897M5.136 7.965l-2.898-.777M13.95 4.05l-2.122 2.122m-5.657 5.656l-2.12 2.122" />
|
||||||
|
</svg>
|
||||||
|
</div>
|
||||||
|
<div class="text-sm leading-6 font-normal text-gray-900">
|
||||||
|
Engagement
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
<a href="#" class="-m-3 space-x-4 flex items-center p-3 rounded-lg hover:bg-gray-50 transition ease-in-out duration-150">
|
||||||
|
<div class="flex-shrink-0 flex items-center justify-center h-10 w-10 rounded-md bg-indigo-500 text-white sm:h-12 sm:w-12">
|
||||||
|
<!-- Heroicon name: shield-check -->
|
||||||
|
<svg class="h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||||||
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m5.618-4.016A11.955 11.955 0 0112 2.944a11.955 11.955 0 01-8.618 3.04A12.02 12.02 0 003 9c0 5.591 3.824 10.29 9 11.622 5.176-1.332 9-6.03 9-11.622 0-1.042-.133-2.052-.382-3.016z" />
|
||||||
|
</svg>
|
||||||
|
</div>
|
||||||
|
<div class="text-sm leading-6 font-normal text-gray-900">
|
||||||
|
Security
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
<a href="#" class="-m-3 space-x-4 flex items-center p-3 rounded-lg hover:bg-gray-50 transition ease-in-out duration-150">
|
||||||
|
<div class="flex-shrink-0 flex items-center justify-center h-10 w-10 rounded-md bg-indigo-500 text-white sm:h-12 sm:w-12">
|
||||||
|
<!-- Heroicon name: view-grid -->
|
||||||
|
<svg class="h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||||||
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2H6a2 2 0 01-2-2V6zM14 6a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2h-2a2 2 0 01-2-2V6zM4 16a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2H6a2 2 0 01-2-2v-2zM14 16a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2h-2a2 2 0 01-2-2v-2z" />
|
||||||
|
</svg>
|
||||||
|
</div>
|
||||||
|
<div class="text-sm leading-6 font-normal text-gray-900">
|
||||||
|
Integrations
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
<div class="text-sm leading-6">
|
||||||
|
<a href="#" class="font-normal text-indigo-600 hover:text-indigo-500 transition ease-in-out duration-150">
|
||||||
|
View all products →
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="py-6 px-5 space-y-6">
|
||||||
|
<div class="grid grid-cols-2 gap-4">
|
||||||
|
<a href="#" class="rounded-md text-sm leading-6 font-normal text-gray-900 hover:text-gray-700 transition ease-in-out duration-150">
|
||||||
|
Pricing
|
||||||
|
</a>
|
||||||
|
<a href="#" class="rounded-md text-sm leading-6 font-normal text-gray-900 hover:text-gray-700 transition ease-in-out duration-150">
|
||||||
|
Docs
|
||||||
|
</a>
|
||||||
|
<a href="#" class="rounded-md text-sm leading-6 font-normal text-gray-900 hover:text-gray-700 transition ease-in-out duration-150">
|
||||||
|
Company
|
||||||
|
</a>
|
||||||
|
<a href="#" class="rounded-md text-sm leading-6 font-normal text-gray-900 hover:text-gray-600 transition ease-in-out duration-150">
|
||||||
|
Resources
|
||||||
|
</a>
|
||||||
|
<a href="#" class="rounded-md text-sm leading-6 font-normal text-gray-900 hover:text-gray-600 transition ease-in-out duration-150">
|
||||||
|
Blog
|
||||||
|
</a>
|
||||||
|
<a href="#" class="rounded-md text-sm leading-6 font-normal text-gray-900 hover:text-gray-600 transition ease-in-out duration-150">
|
||||||
|
Contact Sales
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
<div class="space-y-6">
|
||||||
|
<span class="w-full flex rounded-md shadow-sm">
|
||||||
|
<a href="#" class="w-full flex items-center justify-center px-4 py-2 border border-transparent text-sm leading-6 font-normal rounded-md text-white bg-indigo-600 hover:bg-indigo-500 focus:outline-none focus:border-indigo-700 focus:shadow-outline-indigo active:bg-indigo-700 transition ease-in-out duration-150">
|
||||||
|
Sign up
|
||||||
|
</a>
|
||||||
|
</span>
|
||||||
|
<p class="text-center text-sm leading-6 font-normal text-gray-500">
|
||||||
|
Existing customer?
|
||||||
|
<a href="#" class="text-indigo-600 hover:text-indigo-500 transition ease-in-out duration-150">
|
||||||
|
Sign in
|
||||||
|
</a>
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
|||||||
@ -1,493 +0,0 @@
|
|||||||
<!--
|
|
||||||
Tailwind UI components require Tailwind CSS v1.8 and the @tailwindcss/ui plugin.
|
|
||||||
Read the documentation to get started: https://tailwindui.com/documentation
|
|
||||||
--><!-- This example requires Tailwind CSS v1.4.0+ -->
|
|
||||||
<script type="text/javascript">
|
|
||||||
var inDisplay = "";
|
|
||||||
|
|
||||||
function toggleMenu() {
|
|
||||||
if (inDisplay === "learn") {
|
|
||||||
hideMenu();
|
|
||||||
inDisplay = "";
|
|
||||||
}
|
|
||||||
else {
|
|
||||||
showMenu();
|
|
||||||
inDisplay = "learn";
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function showMenu() {
|
|
||||||
document.getElementById('learn').className = "absolute inset-x-0 transform shadow-lg backdrop-blur transition ease-out duration-150 opacity-1 -translate-y-0";
|
|
||||||
}
|
|
||||||
|
|
||||||
function hideMenu() {
|
|
||||||
document.getElementById('learn').className = "absolute inset-x-0 transform shadow-lg backdrop-blur transition ease-in duration-150 opacity-0 -translate-y-1";
|
|
||||||
}
|
|
||||||
|
|
||||||
window.onload = function(){
|
|
||||||
document.getElementById("learn-btn").addEventListener( 'click', toggleMenu);
|
|
||||||
}
|
|
||||||
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<body>
|
|
||||||
<div class="z-10 relative bg-semi-white">
|
|
||||||
<div class="relative z-10 shadow">
|
|
||||||
<div class="max-w-7xl mx-auto flex justify-between items-center px-4 py-5 sm:px-6 sm:py-4 lg:px-8 md:justify-start md:space-x-10">
|
|
||||||
<div>
|
|
||||||
<a href="#" class="flex">
|
|
||||||
<img class="w-20 h-auto sm:w-32" src="images/ourworld_logo.png" alt="Workflow" />
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
<div class="-mr-2 -my-2 md:hidden">
|
|
||||||
<button type="button" class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-gray-500 hover:bg-gray-100 focus:outline-none focus:bg-gray-100 focus:text-gray-500 transition duration-150 ease-in-out">
|
|
||||||
<!-- Heroicon name: menu -->
|
|
||||||
<svg class="h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
|
||||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
|
|
||||||
</svg>
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
<div class="hidden md:flex-1 md:flex md:items-center md:justify-between md:space-x-12">
|
|
||||||
<nav class="flex space-x-10">
|
|
||||||
<div class="relative">
|
|
||||||
<!-- Item active: "text-gray-900", Item inactive: "text-gray-500" -->
|
|
||||||
<button type="button" id="learn-btn" class="text-gray-500 group inline-flex items-center space-x-2 text-sm leading-6 font-normal hover:text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150">
|
|
||||||
<span>Learn</span>
|
|
||||||
<!--
|
|
||||||
Heroicon name: chevron-down
|
|
||||||
|
|
||||||
Item active: "text-gray-600", Item inactive: "text-gray-400"
|
|
||||||
-->
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
<div class="relative">
|
|
||||||
<!-- Item active: "text-gray-900", Item inactive: "text-gray-500" -->
|
|
||||||
<button type="button" id="learn-btn" class="text-gray-500 group inline-flex items-center space-x-2 text-sm leading-6 font-normal hover:text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150">
|
|
||||||
<span>Learn</span>
|
|
||||||
<!--
|
|
||||||
Heroicon name: chevron-down
|
|
||||||
|
|
||||||
Item active: "text-gray-600", Item inactive: "text-gray-400"
|
|
||||||
-->
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<a href="#" class="text-sm leading-6 font-normal text-gray-500 hover:text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150">
|
|
||||||
Developers
|
|
||||||
</a>
|
|
||||||
<a href="blog" class="text-sm leading-6 font-normal text-gray-500 hover:text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150">
|
|
||||||
Founders & Creators
|
|
||||||
</a>
|
|
||||||
<a href="blog" class="text-sm leading-6 font-normal text-gray-500 hover:text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150">
|
|
||||||
Community
|
|
||||||
</a>
|
|
||||||
<a href="blog" class="text-sm leading-6 font-normal text-gray-500 hover:text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150">
|
|
||||||
Blog
|
|
||||||
</a>
|
|
||||||
<a href="blog" class="text-sm leading-6 font-normal text-gray-500 hover:text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150">
|
|
||||||
Career
|
|
||||||
</a>
|
|
||||||
<div class="relative">
|
|
||||||
<!-- Item active: "text-gray-900", Item inactive: "text-gray-500" -->
|
|
||||||
<button type="button" class="text-gray-500 group inline-flex items-center space-x-2 text-sm leading-6 font-normal hover:text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150">
|
|
||||||
<span>Menu</span>
|
|
||||||
<!--
|
|
||||||
Heroicon name: chevron-down
|
|
||||||
|
|
||||||
Item active: "text-gray-600", Item inactive: "text-gray-400"
|
|
||||||
-->
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</nav>
|
|
||||||
<div class="flex items-center space-x-8">
|
|
||||||
<a href="#" class="text-sm leading-6 font-normal text-gray-500 hover:text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150">
|
|
||||||
Sign in
|
|
||||||
</a>
|
|
||||||
<span class="inline-flex rounded-md shadow-sm">
|
|
||||||
<a href="#" class="inline-flex items-center justify-center px-4 py-2 border border-transparent text-sm leading-6 font-normal rounded-md text-white bg-indigo-600 hover:bg-indigo-500 focus:outline-none focus:border-indigo-700 focus:shadow-outline-indigo active:bg-indigo-700 transition ease-in-out duration-150">
|
|
||||||
Sign up
|
|
||||||
</a>
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- learn menu -->
|
|
||||||
<!--
|
|
||||||
'learn' flyout menu, show/hide based on flyout menu state.
|
|
||||||
|
|
||||||
Entering: "transition ease-out duration-200"
|
|
||||||
From: "opacity-0 -translate-y-1"
|
|
||||||
To: "opacity-100 translate-y-0"
|
|
||||||
Leaving: "transition ease-in duration-150"
|
|
||||||
From: "opacity-100 translate-y-0"
|
|
||||||
To: "opacity-0 -translate-y-1"
|
|
||||||
md:block or hidden
|
|
||||||
-->
|
|
||||||
<div id="learn" class="opacity-0 -translate-y-1 absolute inset-x-0 transform shadow-lg backdrop-blur">
|
|
||||||
<div class="bg-semi-white">
|
|
||||||
<div class="max-w-7xl mx-auto grid gap-y-6 px-4 py-6 sm:grid-cols-2 sm:gap-8 sm:px-6 sm:py-8 lg:grid-cols-4 lg:px-8 lg:py-12 xl:py-16">
|
|
||||||
<a href="#" class="-m-3 p-3 flex flex-col justify-between space-y-6 rounded-lg transition ease-in-out duration-150">
|
|
||||||
<div class="space-x-4 flex md:h-full lg:flex-col lg:space-x-0 lg:space-y-4">
|
|
||||||
<div class="flex-shrink-0">
|
|
||||||
<span class="inline-flex items-center justify-center h-10 w-10 rounded-md bg-indigo-500 text-white sm:h-12 sm:w-12">
|
|
||||||
<!-- Heroicon name: chart-bar -->
|
|
||||||
<svg class="h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
|
||||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z" />
|
|
||||||
</svg>
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
<div class="space-y-2 md:flex-1 md:flex md:flex-col md:justify-between lg:space-y-4">
|
|
||||||
<div class="space-y-1">
|
|
||||||
<p class="text-sm leading-6 font-normal text-gray-900">
|
|
||||||
Analytics
|
|
||||||
</p>
|
|
||||||
<p class="text-sm leading-5 text-gray-500">
|
|
||||||
Get a better understanding of where your traffic is coming from.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="space-y-2 md:flex-1 md:flex md:flex-col md:justify-between lg:space-y-4">
|
|
||||||
<div class="space-y-1">
|
|
||||||
<p class="text-sm leading-6 font-normal text-gray-900">
|
|
||||||
Analytics
|
|
||||||
</p>
|
|
||||||
<p class="text-sm leading-5 text-gray-500">
|
|
||||||
Get a better understanding of where your traffic is coming from.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</a>
|
|
||||||
<a href="#" class="-m-3 p-3 flex flex-col justify-between space-y-6 rounded-lg transition ease-in-out duration-150">
|
|
||||||
<div class="space-x-4 flex md:h-full lg:flex-col lg:space-x-0 lg:space-y-4">
|
|
||||||
<div class="flex-shrink-0">
|
|
||||||
<span class="inline-flex items-center justify-center h-10 w-10 rounded-md bg-indigo-500 text-white sm:h-12 sm:w-12">
|
|
||||||
<!-- Heroicon name: cursor-click -->
|
|
||||||
<svg class="h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
|
||||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 15l-2 5L9 9l11 4-5 2zm0 0l5 5M7.188 2.239l.777 2.897M5.136 7.965l-2.898-.777M13.95 4.05l-2.122 2.122m-5.657 5.656l-2.12 2.122" />
|
|
||||||
</svg>
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
<div class="space-y-2 md:flex-1 md:flex md:flex-col md:justify-between lg:space-y-4">
|
|
||||||
<div class="space-y-1">
|
|
||||||
<p class="text-sm leading-6 font-normal text-gray-900">
|
|
||||||
Engagement
|
|
||||||
</p>
|
|
||||||
<p class="text-sm leading-5 text-gray-500">
|
|
||||||
Speak directly to your customers in a more meaningful way.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</a>
|
|
||||||
<a href="#" class="-m-3 p-3 flex flex-col justify-between space-y-6 rounded-lg transition ease-in-out duration-150">
|
|
||||||
<div class="space-x-4 flex md:h-full lg:flex-col lg:space-x-0 lg:space-y-4">
|
|
||||||
<div class="flex-shrink-0">
|
|
||||||
<span class="inline-flex items-center justify-center h-10 w-10 rounded-md bg-indigo-500 text-white sm:h-12 sm:w-12">
|
|
||||||
<!-- Heroicon name: shield-check -->
|
|
||||||
<svg class="h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
|
||||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m5.618-4.016A11.955 11.955 0 0112 2.944a11.955 11.955 0 01-8.618 3.04A12.02 12.02 0 003 9c0 5.591 3.824 10.29 9 11.622 5.176-1.332 9-6.03 9-11.622 0-1.042-.133-2.052-.382-3.016z" />
|
|
||||||
</svg>
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
<div class="space-y-2 md:flex-1 md:flex md:flex-col md:justify-between lg:space-y-4">
|
|
||||||
<div class="space-y-1">
|
|
||||||
<p class="text-sm leading-6 font-normal text-gray-900">
|
|
||||||
Security
|
|
||||||
</p>
|
|
||||||
<p class="text-sm leading-5 text-gray-500">
|
|
||||||
Your customer data will be safe and secure.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</a>
|
|
||||||
<a href="#" class="-m-3 p-3 flex flex-col justify-between space-y-6 rounded-lg transition ease-in-out duration-150">
|
|
||||||
<div class="space-x-4 flex md:h-full lg:flex-col lg:space-x-0 lg:space-y-4">
|
|
||||||
<div class="flex-shrink-0">
|
|
||||||
<span class="inline-flex items-center justify-center h-10 w-10 rounded-md bg-indigo-500 text-white sm:h-12 sm:w-12">
|
|
||||||
<!-- Heroicon name: view-grid -->
|
|
||||||
<svg class="h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
|
||||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2H6a2 2 0 01-2-2V6zM14 6a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2h-2a2 2 0 01-2-2V6zM4 16a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2H6a2 2 0 01-2-2v-2zM14 16a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2h-2a2 2 0 01-2-2v-2z" />
|
|
||||||
</svg>
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
<div class="space-y-2 md:flex-1 md:flex md:flex-col md:justify-between lg:space-y-4">
|
|
||||||
<div class="space-y-1">
|
|
||||||
<p class="text-sm leading-6 font-normal text-gray-900">
|
|
||||||
Integrations
|
|
||||||
</p>
|
|
||||||
<p class="text-sm leading-5 text-gray-500">
|
|
||||||
Connect with third-party tools that you're already using.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- More menu -->
|
|
||||||
<!--
|
|
||||||
'More' flyout menu, show/hide based on flyout menu state.
|
|
||||||
|
|
||||||
Entering: "transition ease-out duration-200"
|
|
||||||
From: "opacity-0 -translate-y-1"
|
|
||||||
To: "opacity-100 translate-y-0"
|
|
||||||
Leaving: "transition ease-in duration-150"
|
|
||||||
From: "opacity-100 translate-y-0"
|
|
||||||
To: "opacity-0 -translate-y-1"
|
|
||||||
-->
|
|
||||||
|
|
||||||
<!--
|
|
||||||
Tailwind UI components require Tailwind CSS v1.8 and the @tailwindcss/ui plugin.
|
|
||||||
Read the documentation to get started: https://tailwindui.com/documentation
|
|
||||||
--><!-- This example requires Tailwind CSS v1.4.0+ -->
|
|
||||||
|
|
||||||
|
|
||||||
<!--
|
|
||||||
Flyout menu, show/hide based on flyout menu state.
|
|
||||||
|
|
||||||
Entering: "transition ease-out duration-200"
|
|
||||||
From: "opacity-0 -translate-y-1"
|
|
||||||
To: "opacity-100 translate-y-0"
|
|
||||||
Leaving: "transition ease-in duration-150"
|
|
||||||
From: "opacity-100 translate-y-0"
|
|
||||||
To: "opacity-0 -translate-y-1"
|
|
||||||
-->
|
|
||||||
<div id="menu" class="hidden absolute inset-x-0 transform shadow-lg">
|
|
||||||
<div class="bg-semi-white">
|
|
||||||
<div class="max-w-7xl mx-auto grid gap-y-6 px-4 py-6 sm:grid-cols-2 sm:gap-8 sm:px-6 sm:py-8 lg:grid-cols-4 lg:px-8 lg:py-12 xl:py-16">
|
|
||||||
<a href="#" class="-m-3 p-3 flex flex-col justify-between space-y-6 rounded-lg transition ease-in-out duration-150">
|
|
||||||
<div class="space-x-4 flex md:h-full lg:flex-col lg:space-x-0 lg:space-y-4">
|
|
||||||
<div class="flex-shrink-0">
|
|
||||||
<span class="inline-flex items-center justify-center h-10 w-10 rounded-md bg-indigo-500 text-white sm:h-12 sm:w-12">
|
|
||||||
<!-- Heroicon name: chart-bar -->
|
|
||||||
<svg class="h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
|
||||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z" />
|
|
||||||
</svg>
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
<div class="space-y-2 md:flex-1 md:flex md:flex-col md:justify-between lg:space-y-4">
|
|
||||||
<div class="space-y-1">
|
|
||||||
<p class="text-sm leading-6 font-normal text-gray-900">
|
|
||||||
Analytics
|
|
||||||
</p>
|
|
||||||
<p class="text-sm leading-5 text-gray-500">
|
|
||||||
Get a better understanding of where your traffic is coming from.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
<p class="text-sm leading-5 font-normal text-indigo-600">
|
|
||||||
learn more →
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</a>
|
|
||||||
<a href="#" class="-m-3 p-3 flex flex-col justify-between space-y-6 rounded-lg transition ease-in-out duration-150">
|
|
||||||
<div class="space-x-4 flex md:h-full lg:flex-col lg:space-x-0 lg:space-y-4">
|
|
||||||
<div class="flex-shrink-0">
|
|
||||||
<span class="inline-flex items-center justify-center h-10 w-10 rounded-md bg-indigo-500 text-white sm:h-12 sm:w-12">
|
|
||||||
<!-- Heroicon name: cursor-click -->
|
|
||||||
<svg class="h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
|
||||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 15l-2 5L9 9l11 4-5 2zm0 0l5 5M7.188 2.239l.777 2.897M5.136 7.965l-2.898-.777M13.95 4.05l-2.122 2.122m-5.657 5.656l-2.12 2.122" />
|
|
||||||
</svg>
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
<div class="space-y-2 md:flex-1 md:flex md:flex-col md:justify-between lg:space-y-4">
|
|
||||||
<div class="space-y-1">
|
|
||||||
<p class="text-sm leading-6 font-normal text-gray-900">
|
|
||||||
Engagement
|
|
||||||
</p>
|
|
||||||
<p class="text-sm leading-5 text-gray-500">
|
|
||||||
Speak directly to your customers in a more meaningful way.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
<p class="text-sm leading-5 font-normal text-indigo-600">
|
|
||||||
learn more →
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</a>
|
|
||||||
<a href="#" class="-m-3 p-3 flex flex-col justify-between space-y-6 rounded-lg transition ease-in-out duration-150">
|
|
||||||
<div class="space-x-4 flex md:h-full lg:flex-col lg:space-x-0 lg:space-y-4">
|
|
||||||
<div class="flex-shrink-0">
|
|
||||||
<span class="inline-flex items-center justify-center h-10 w-10 rounded-md bg-indigo-500 text-white sm:h-12 sm:w-12">
|
|
||||||
<!-- Heroicon name: shield-check -->
|
|
||||||
<svg class="h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
|
||||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m5.618-4.016A11.955 11.955 0 0112 2.944a11.955 11.955 0 01-8.618 3.04A12.02 12.02 0 003 9c0 5.591 3.824 10.29 9 11.622 5.176-1.332 9-6.03 9-11.622 0-1.042-.133-2.052-.382-3.016z" />
|
|
||||||
</svg>
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
<div class="space-y-2 md:flex-1 md:flex md:flex-col md:justify-between lg:space-y-4">
|
|
||||||
<div class="space-y-1">
|
|
||||||
<p class="text-sm leading-6 font-normal text-gray-900">
|
|
||||||
Security
|
|
||||||
</p>
|
|
||||||
<p class="text-sm leading-5 text-gray-500">
|
|
||||||
Your customer data will be safe and secure.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
<p class="text-sm leading-5 font-normal text-indigo-600">
|
|
||||||
learn more →
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</a>
|
|
||||||
<a href="#" class="-m-3 p-3 flex flex-col justify-between space-y-6 rounded-lg hover:bg-gray-50 transition ease-in-out duration-150">
|
|
||||||
<div class="space-x-4 flex md:h-full lg:flex-col lg:space-x-0 lg:space-y-4">
|
|
||||||
<div class="flex-shrink-0">
|
|
||||||
<span class="inline-flex items-center justify-center h-10 w-10 rounded-md bg-indigo-500 text-white sm:h-12 sm:w-12">
|
|
||||||
<!-- Heroicon name: view-grid -->
|
|
||||||
<svg class="h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
|
||||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2H6a2 2 0 01-2-2V6zM14 6a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2h-2a2 2 0 01-2-2V6zM4 16a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2H6a2 2 0 01-2-2v-2zM14 16a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2h-2a2 2 0 01-2-2v-2z" />
|
|
||||||
</svg>
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
<div class="space-y-2 md:flex-1 md:flex md:flex-col md:justify-between lg:space-y-4">
|
|
||||||
<div class="space-y-1">
|
|
||||||
<p class="text-sm leading-6 font-normal text-gray-900">
|
|
||||||
Integrations
|
|
||||||
</p>
|
|
||||||
<p class="text-sm leading-5 text-gray-500">
|
|
||||||
Connect with third-party tools that you're already using.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
<p class="text-sm leading-5 font-normal text-indigo-600">
|
|
||||||
learn more →
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<!--
|
|
||||||
Mobile menu, show/hide based on mobile menu state.
|
|
||||||
|
|
||||||
Entering: "duration-200 ease-out"
|
|
||||||
From: "opacity-0 scale-95"
|
|
||||||
To: "opacity-100 scale-100"
|
|
||||||
Leaving: "duration-100 ease-in"
|
|
||||||
From: "opacity-100 scale-100"
|
|
||||||
To: "opacity-0 scale-95"
|
|
||||||
-->
|
|
||||||
<div class="absolute z-20 top-0 inset-x-0 p-2 transition transform origin-top-right md:hidden">
|
|
||||||
<div class="rounded-lg shadow-lg">
|
|
||||||
<div class="rounded-lg shadow-xs bg-white divide-y-2 divide-gray-50">
|
|
||||||
<div class="pt-5 pb-6 px-5 space-y-6 sm:space-y-8 sm:pb-8">
|
|
||||||
<div class="flex items-center justify-between">
|
|
||||||
<div>
|
|
||||||
<img class="h-8 w-auto" src="https://tailwindui.com/img/logos/v1/workflow-mark-on-white.svg" alt="Workflow" />
|
|
||||||
</div>
|
|
||||||
<div class="-mr-2">
|
|
||||||
<button type="button" class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-gray-500 hover:bg-gray-100 focus:outline-none focus:bg-gray-100 focus:text-gray-500 transition duration-150 ease-in-out">
|
|
||||||
<!-- Heroicon name: x -->
|
|
||||||
<svg class="h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
|
||||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
|
|
||||||
</svg>
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<nav class="space-y-8">
|
|
||||||
<div class="grid gap-7 sm:grid-cols-2 sm:gap-y-8 sm:gap-x-4">
|
|
||||||
<a href="#" class="-m-3 space-x-4 flex items-center p-3 rounded-lg hover:bg-gray-50 transition ease-in-out duration-150">
|
|
||||||
<div class="flex-shrink-0 flex items-center justify-center h-10 w-10 rounded-md bg-indigo-500 text-white sm:h-12 sm:w-12">
|
|
||||||
<!-- Heroicon name: chart-bar -->
|
|
||||||
<svg class="h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
|
||||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z" />
|
|
||||||
</svg>
|
|
||||||
</div>
|
|
||||||
<div class="text-sm leading-6 font-normal text-gray-900">
|
|
||||||
Analytics
|
|
||||||
</div>
|
|
||||||
</a>
|
|
||||||
<a href="#" class="-m-3 space-x-4 flex items-center p-3 rounded-lg hover:bg-gray-50 transition ease-in-out duration-150">
|
|
||||||
<div class="flex-shrink-0 flex items-center justify-center h-10 w-10 rounded-md bg-indigo-500 text-white sm:h-12 sm:w-12">
|
|
||||||
<!-- Heroicon name: cursor-click -->
|
|
||||||
<svg class="h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
|
||||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 15l-2 5L9 9l11 4-5 2zm0 0l5 5M7.188 2.239l.777 2.897M5.136 7.965l-2.898-.777M13.95 4.05l-2.122 2.122m-5.657 5.656l-2.12 2.122" />
|
|
||||||
</svg>
|
|
||||||
</div>
|
|
||||||
<div class="text-sm leading-6 font-normal text-gray-900">
|
|
||||||
Engagement
|
|
||||||
</div>
|
|
||||||
</a>
|
|
||||||
<a href="#" class="-m-3 space-x-4 flex items-center p-3 rounded-lg hover:bg-gray-50 transition ease-in-out duration-150">
|
|
||||||
<div class="flex-shrink-0 flex items-center justify-center h-10 w-10 rounded-md bg-indigo-500 text-white sm:h-12 sm:w-12">
|
|
||||||
<!-- Heroicon name: shield-check -->
|
|
||||||
<svg class="h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
|
||||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m5.618-4.016A11.955 11.955 0 0112 2.944a11.955 11.955 0 01-8.618 3.04A12.02 12.02 0 003 9c0 5.591 3.824 10.29 9 11.622 5.176-1.332 9-6.03 9-11.622 0-1.042-.133-2.052-.382-3.016z" />
|
|
||||||
</svg>
|
|
||||||
</div>
|
|
||||||
<div class="text-sm leading-6 font-normal text-gray-900">
|
|
||||||
Security
|
|
||||||
</div>
|
|
||||||
</a>
|
|
||||||
<a href="#" class="-m-3 space-x-4 flex items-center p-3 rounded-lg hover:bg-gray-50 transition ease-in-out duration-150">
|
|
||||||
<div class="flex-shrink-0 flex items-center justify-center h-10 w-10 rounded-md bg-indigo-500 text-white sm:h-12 sm:w-12">
|
|
||||||
<!-- Heroicon name: view-grid -->
|
|
||||||
<svg class="h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
|
||||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2H6a2 2 0 01-2-2V6zM14 6a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2h-2a2 2 0 01-2-2V6zM4 16a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2H6a2 2 0 01-2-2v-2zM14 16a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2h-2a2 2 0 01-2-2v-2z" />
|
|
||||||
</svg>
|
|
||||||
</div>
|
|
||||||
<div class="text-sm leading-6 font-normal text-gray-900">
|
|
||||||
Integrations
|
|
||||||
</div>
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
<div class="text-sm leading-6">
|
|
||||||
<a href="#" class="font-normal text-indigo-600 hover:text-indigo-500 transition ease-in-out duration-150">
|
|
||||||
View all products →
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
</nav>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="py-6 px-5 space-y-6">
|
|
||||||
<div class="grid grid-cols-2 gap-4">
|
|
||||||
<a href="#" class="rounded-md text-sm leading-6 font-normal text-gray-900 hover:text-gray-700 transition ease-in-out duration-150">
|
|
||||||
Pricing
|
|
||||||
</a>
|
|
||||||
<a href="#" class="rounded-md text-sm leading-6 font-normal text-gray-900 hover:text-gray-700 transition ease-in-out duration-150">
|
|
||||||
Docs
|
|
||||||
</a>
|
|
||||||
<a href="#" class="rounded-md text-sm leading-6 font-normal text-gray-900 hover:text-gray-700 transition ease-in-out duration-150">
|
|
||||||
Company
|
|
||||||
</a>
|
|
||||||
<a href="#" class="rounded-md text-sm leading-6 font-normal text-gray-900 hover:text-gray-600 transition ease-in-out duration-150">
|
|
||||||
Resources
|
|
||||||
</a>
|
|
||||||
<a href="#" class="rounded-md text-sm leading-6 font-normal text-gray-900 hover:text-gray-600 transition ease-in-out duration-150">
|
|
||||||
Blog
|
|
||||||
</a>
|
|
||||||
<a href="#" class="rounded-md text-sm leading-6 font-normal text-gray-900 hover:text-gray-600 transition ease-in-out duration-150">
|
|
||||||
Contact Sales
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
<div class="space-y-6">
|
|
||||||
<span class="w-full flex rounded-md shadow-sm">
|
|
||||||
<a href="#" class="w-full flex items-center justify-center px-4 py-2 border border-transparent text-sm leading-6 font-normal rounded-md text-white bg-indigo-600 hover:bg-indigo-500 focus:outline-none focus:border-indigo-700 focus:shadow-outline-indigo active:bg-indigo-700 transition ease-in-out duration-150">
|
|
||||||
Sign up
|
|
||||||
</a>
|
|
||||||
</span>
|
|
||||||
<p class="text-center text-sm leading-6 font-normal text-gray-500">
|
|
||||||
Existing customer?
|
|
||||||
<a href="#" class="text-indigo-600 hover:text-indigo-500 transition ease-in-out duration-150">
|
|
||||||
Sign in
|
|
||||||
</a>
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</body>
|
|
||||||
@ -1,3 +0,0 @@
|
|||||||
<div class="blueBox">
|
|
||||||
{{ body | markdown | safe }}
|
|
||||||
</div>
|
|
||||||
@ -1,3 +0,0 @@
|
|||||||
<figcaption>
|
|
||||||
{{ body | markdown | safe }}
|
|
||||||
</figcaption>
|
|
||||||
@ -1,13 +0,0 @@
|
|||||||
|
|
||||||
<div class="relative mt-12 lg:mt-24 lg:grid lg:grid-cols-2 lg:gap-8 lg:items-center">
|
|
||||||
<div class="relative">
|
|
||||||
{{body}}
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="mt-10 -mx-4 relative lg:mt-0">
|
|
||||||
<img src={{imgUrl}} alt="">
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
@ -1,3 +0,0 @@
|
|||||||
<div class="yellowBox">
|
|
||||||
{{ body | markdown | safe }}
|
|
||||||
</div>
|
|
||||||
Loading…
Reference in New Issue
Block a user