Skip to content

Instantly share code, notes, and snippets.

@ram4git

ram4git/index.html

Created December 3, 2020 05:30
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save ram4git/c483eee062a44ecff1e4698489ab9c67 to your computer and use it in GitHub Desktop.
Save ram4git/c483eee062a44ecff1e4698489ab9c67 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
index.html
<!DOCTYPE html>
<html>
<head>
<link rel="preconnect" href="https://fonts.gstatic.com" />
<link
href="https://fonts.googleapis.com/css2?family=Poppins:wght@200&display=swap"
rel="stylesheet"
/>
<link
href="https://unpkg.com/tailwindcss@^1.0/dist/tailwind.min.css"
rel="stylesheet"
/>
<style>
body {
background-color: powderblue;
font-family: "Poppins", sans-serif;
}
h1 {
color: blue;
}
p {
color: red;
}
</style>
</head>
<body>
<div
class="min-h-screen bg-gray-100 py-6 flex flex-col justify-center sm:py-12 font-Poppins"
>
<div
class="relative my-3 w-full sm:max-w-2xl mx-auto bg-gray-500 shadow-lg rounded-sm overflow-hidden"
>
<div class="bg-gray-200">
<img class="mx-auto" src="https://i.imgur.com/7SoBgvU.png" />
<div class="text-center text-blue-600 py-2">www.wishu-app.com</div>
</div>
<div class="bg-white sm:p-5">
<img class="mx-auto" src="https://i.imgur.com/lt2JBEu.png" />
<div class="max-w-md mx-auto">
<div class="text-center font-semibold py-2">
Welcome to WishU App!
</div>
<div class="mt-6">
We are delighted to have you onboard. You now have access to all
the exciting features to make a celebratory video!
</div>
<div class="block_1 mt-10"></div>
<hr />
<div class="mt-9 text-center font-semibold">How to Get Started</div>
<div
class="py-8 text-base leading-6 space-y-4 text-gray-700 sm:text-lg sm:leading-7"
>
<ul class="list-disc space-y-2">
<li class="flex items-start justify-center">
<img
src="https://i.imgur.com/ewhGWCC.png"
class="h-7 sm:h-8 m-auto"
/>
<p class="ml-2">
Choose an occasion and specify a date to create an event.
</p>
</li>
<li class="flex items-start">
<img
src="https://i.imgur.com/ysgWZjj.png"
class="h-7 sm:h-8 m-auto"
/>
<p class="ml-2">
Invite any number of contributors to gather videos.
</p>
</li>
<li class="flex items-start">
<img
src="https://i.imgur.com/XOTienk.png"
class="h-7 sm:h- m-auto"
/>
<p class="ml-2">
Once you get all the videos, rearrange, finalize and share.
</p>
</li>
</ul>
<div class="w-full">
<button
class="w-full mx-auto bg-pink-600 text-white px-28 py-1 rounded-xl"
>
Create Your First Video
</button>
</div>
</div>
<p class="ml-2 text-sm text-center mx-auto w-full">
<span class="font-bold text-gray-900"
>© Copyright Spicyfy Ventures LLC.</span
>
All Rights Reserved
</p>
<div class="text-center mx-auto w-full">
<a
href="https://tailwindcss.com/docs"
class="text-cyan-600 hover:text-cyan-700"
target="_blank"
>
Terms & Conditions
</a>
|
<a
href="https://tailwindcss.com/docs"
class="text-cyan-600 hover:text-cyan-700"
target="_blank"
>
Privacy Policy
</a>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment