-
Notifications
You must be signed in to change notification settings - Fork 3
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
3 changed files
with
79 additions
and
69 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,30 +1,33 @@ | ||
| <section class="relative py-20"> | ||
| <div class="absolute left-0 top-0 h-96 w-full bg-indigo-500 lg:bottom-0 lg:h-auto lg:w-8/12"></div> | ||
| <div class="container relative mx-auto px-4"> | ||
| <div class="-mx-4 flex flex-wrap items-center"> | ||
| <div class="mb-12 w-full px-4 lg:mb-0 lg:w-1/2"> | ||
| <div class="max-w-lg"> | ||
| <h2 class="font-heading mb-6 text-3xl font-bold leading-tight text-white md:text-4xl md:leading-tight lg:text-5xl lg:leading-tight">Lorem ipsum dolor sit amet consectutar domor at elis</h2> | ||
| <p class="text-base leading-relaxed text-indigo-50 lg:text-xl lg:leading-relaxed">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque massa nibh, pulvinar vitae aliquet nec, accumsan aliquet orci.</p> | ||
| </div> | ||
| <div class="absolute left-0 top-0 h-96 w-full bg-indigo-500 lg:bottom-0 lg:h-auto lg:w-8/12"></div> | ||
| <div class="container relative mx-auto px-4"> | ||
| <div class="-mx-4 flex flex-wrap items-center"> | ||
| <div class="mb-12 w-full px-4 lg:mb-0 lg:w-1/2"> | ||
| <div class="max-w-lg"> | ||
| <h2 class="font-heading mb-6 text-3xl font-bold leading-tight text-white md:text-4xl md:leading-tight lg:text-5xl lg:leading-tight">Lorem ipsum dolor sit amet consectutar domor at elis</h2> | ||
| <p class="text-base leading-relaxed text-indigo-50 lg:text-xl lg:leading-relaxed">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque massa nibh, pulvinar vitae aliquet nec, accumsan aliquet orci.</p> | ||
| </div> | ||
| <div class="w-full px-4 lg:w-1/2"> | ||
| <div class="rounded-lg bg-gray-50 p-6 text-center lg:max-w-md"> | ||
| <form action="#"> | ||
| <span class="text-sm font-semibold uppercase text-gray-500">Sign Up</span> | ||
| <h3 class="font-heading mb-8 text-2xl font-bold">Create new account</h3> | ||
| <input class="mb-4 w-full rounded-lg bg-white py-3 pl-3" type="email" placeholder="E-mail address" /> | ||
| <input class="mb-4 w-full rounded-lg bg-white py-3 pl-3" type="password" placeholder="Password" /> | ||
| <input class="mb-4 w-full rounded-lg bg-white py-3 pl-3" type="password" placeholder="Repeat password" /> | ||
| <label class="mb-4 inline-block"> | ||
| <input class="mr-1" type="checkbox" name="terms" value="1" /> | ||
| <span class="text-sm text-gray-500">By signing up, you agree to our <a class="font-bold hover:underline" href="#">Terms, Data Policy</a> and <a class="font-bold hover:underline" href="#">Cookies Policy</a>.</span> | ||
| </label> | ||
| <button class="block w-full rounded border border-indigo-500 bg-indigo-500 px-5 py-3 text-sm font-semibold text-white transition duration-200 hover:border-indigo-600 hover:bg-indigo-600">Get Started</button> | ||
| </form> | ||
| </div> | ||
| </div> | ||
| <div class="w-full px-4 lg:w-1/2"> | ||
| <div class="rounded-lg bg-gray-50 p-6 text-center lg:max-w-md"> | ||
| <form action="#"> | ||
| <span class="text-sm font-semibold uppercase text-gray-500">Sign In</span> | ||
| <h3 class="font-heading mb-8 text-2xl font-bold">Join our community</h3> | ||
| <input class="mb-4 w-full rounded-lg bg-white py-3 pl-3" type="email" placeholder="E-mail address" /> | ||
| <input class="mb-4 w-full rounded-lg bg-white py-3 pl-3" type="password" placeholder="Password" /> | ||
| <button class="mb-4 block w-full rounded border border-indigo-500 bg-indigo-500 px-5 py-3 text-sm font-semibold text-white transition duration-200 hover:border-indigo-600 hover:bg-indigo-600">Get Started</button> | ||
| <a class="text-sm text-gray-500 hover:underline" href="#">Forgot password?</a> | ||
| <a class="mb-4 mt-4 block flex w-full items-center justify-center rounded border border-white bg-white px-5 py-3 text-sm font-semibold transition duration-200 hover:border-indigo-50 hover:bg-indigo-50" href="#"> | ||
| <img class="mr-2 h-5 w-5" src="https://shuffle.dev/plain-assets/socials/facebook.svg" alt="" /> | ||
| <span class="text-sm font-semibold">Sign in with Facebook</span> | ||
| </a> | ||
| <a class="flex items-center justify-center rounded border border-white bg-white px-5 py-3 text-sm font-semibold transition duration-200 hover:border-indigo-50 hover:bg-indigo-50" href="#"> | ||
| <img class="mr-2 h-5 w-5" src="https://shuffle.dev/plain-assets/socials/twitter.svg" alt="" /> | ||
| <span class="text-sm font-semibold">Sign in with Twitter</span> | ||
| </a> | ||
| </form> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </section> | ||
| </div> | ||
| </section> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,25 +1,27 @@ | ||
| <section class="py-20"> | ||
| <div class="container px-4 mx-auto"> | ||
| <div class="max-w-md mx-auto py-12 px-8 bg-gray-50 rounded-lg text-center"> | ||
| <span class="text-sm text-gray-500 font-semibold uppercase">Sign Up</span> | ||
| <h3 class="mb-8 text-3xl font-bold font-heading">Create new account</h3> | ||
| <form action="#"> | ||
| <div class="flex flex-wrap md:flex-nowrap"> | ||
| <input class="w-full md:w-1/2 md:mr-2 py-3 pl-3 mb-4 bg-white rounded-lg" type="text" placeholder="First Name"> | ||
| <input class="w-full md:w-1/2 py-3 pl-3 mb-4 bg-white rounded-lg" type="text" placeholder="Last Name"> | ||
| </div> | ||
| <input class="w-full py-3 pl-3 mb-4 bg-white rounded-lg" type="email" placeholder="E-mail address"> | ||
| <input class="w-full py-3 pl-3 mb-4 bg-white rounded-lg" type="password" placeholder="Password"> | ||
| <label class="inline-block mb-4"> | ||
| <input class="mr-1" type="checkbox" name="terms" value="1"> | ||
| <span class="text-sm text-gray-500">By signing up, you agree to our <a class="font-bold hover:underline" href="#">Terms, Data Policy</a> and <a class="font-bold hover:underline" href="#">Cookies Policy</a>.</span> | ||
| </label> | ||
| <button class="block w-full mb-4 px-5 py-3 text-sm bg-indigo-500 hover:bg-indigo-600 text-white font-semibold border border-indigo-500 hover:border-indigo-600 rounded transition duration-200">Sign Up</button> | ||
| </form> | ||
| <p class="text-sm text-gray-500"> | ||
| <span>Already have an account?</span> | ||
| <a class="font-bold hover:underline" href="#">Sign In</a> | ||
| </p> | ||
| <section class="relative py-20"> | ||
| <div class="container px-4 mx-auto"> | ||
| <div class="w-full lg:w-1/2 mb-12"> | ||
| <div class="lg:max-w-md"> | ||
| <div class="max-w-md mx-auto text-center py-10"> | ||
| <form action="#"> | ||
| <span class="text-sm text-gray-500 font-semibold uppercase">Sign In</span> | ||
| <h3 class="mb-8 text-2xl font-bold font-heading">Join our community</h3> | ||
| <input class="w-full py-3 pl-3 mb-4 bg-white border rounded" type="email" placeholder="E-mail address"> | ||
| <input class="w-full py-3 pl-3 mb-4 bg-white border rounded" type="password" placeholder="Password"> | ||
| <button class="block w-full mb-4 px-5 py-3 text-sm bg-indigo-500 hover:bg-indigo-600 text-white font-semibold border border-indigo-500 hover:border-indigo-600 rounded transition duration-200">Get Started</button> | ||
| <a class="text-sm text-gray-500 hover:underline" href="#">Forgot password?</a> | ||
| <a class="flex items-center justify-center mt-4 mb-4 block w-full px-5 py-3 text-sm bg-white hover:bg-indigo-50 font-semibold border border-white hover:border-indigo-50 rounded transition duration-200" href="#"> | ||
| <img class="w-5 h-5 mr-2" src="plain-assets/socials/facebook.svg" alt=""> | ||
| <span class="text-sm font-semibold">Sign in with Facebook</span> | ||
| </a> | ||
| <a class="flex items-center justify-center px-5 py-3 text-sm bg-white hover:bg-indigo-50 font-semibold border border-white hover:border-indigo-50 rounded transition duration-200" href="#"> | ||
| <img class="w-5 h-5 mr-2" src="plain-assets/socials/twitter.svg" alt=""> | ||
| <span class="text-sm font-semibold">Sign in with Twitter</span> | ||
| </a> | ||
| </form> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </section> | ||
| </div> | ||
| <div class="h-96 lg:h-auto lg:absolute top-0 right-0 bottom-0 lg:w-1/2 bg-no-repeat bg-cover" style="background-image: url('plain-assets/images/indigo-600-square.png');"></div> | ||
| </section> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,23 +1,28 @@ | ||
| <section class="py-20"> | ||
| <div class="container mx-auto px-4"> | ||
| <div class="mx-auto max-w-md rounded-lg bg-gray-50 px-8 py-12 text-center"> | ||
| <span class="text-sm font-semibold uppercase text-gray-500">Sign In</span> | ||
| <h3 class="font-heading mb-8 text-3xl font-bold">Join our community</h3> | ||
| <form action="#"> | ||
| <input class="mb-4 w-full rounded-lg bg-white py-3 pl-3" type="email" placeholder="E-mail address" /> | ||
| <input class="mb-4 w-full rounded-lg bg-white py-3 pl-3" type="password" placeholder="Password" /> | ||
| <button class="mb-4 block w-full rounded border border-indigo-500 bg-indigo-500 px-5 py-3 text-sm font-semibold text-white transition duration-200 hover:border-indigo-600 hover:bg-indigo-600">Get Started</button> | ||
| <a class="text-sm text-gray-500 hover:underline" href="#">Forgot password?</a> | ||
| <a class="mb-4 mt-4 block flex w-full items-center justify-center rounded border border-white bg-white px-5 py-3 text-sm font-semibold transition duration-200 hover:border-indigo-50 hover:bg-indigo-50" href="#"> | ||
| <img class="mr-2 h-5 w-5" src="https://shuffle.dev/plain-assets/socials/facebook.svg" alt="" /> | ||
| <span class="text-sm font-semibold">Sign in with Facebook</span> | ||
| </a> | ||
| <a class="flex items-center justify-center rounded border border-white bg-white px-5 py-3 text-sm font-semibold transition duration-200 hover:border-indigo-50 hover:bg-indigo-50" href="#"> | ||
| <img class="mr-2 h-5 w-5" src="https://shuffle.dev/plain-assets/socials/twitter.svg" alt="" /> | ||
| <span class="text-sm font-semibold">Sign in with Twitter</span> | ||
| </a> | ||
| </form> | ||
| <section class="relative py-20"> | ||
| <div class="container px-4 mx-auto"> | ||
| <div class="w-full lg:w-1/2 mb-12"> | ||
| <div class="lg:max-w-md"> | ||
| <div class="max-w-md mx-auto text-center py-10"> | ||
| <span class="text-sm text-gray-500 font-semibold uppercase">Sign Up</span> | ||
| <h3 class="mb-8 text-2xl font-bold font-heading">Create new account</h3> | ||
| <div class="flex"> | ||
| <input class="w-1/2 mr-2 py-3 pl-3 mb-4 bg-white border rounded" type="text" placeholder="First Name"> | ||
| <input class="w-1/2 py-3 pl-3 mb-4 bg-white border rounded" type="text" placeholder="Last Name"> | ||
| </div> | ||
| <input class="w-full py-3 pl-3 mb-4 bg-white border rounded" type="email" placeholder="E-mail address"> | ||
| <input class="w-full py-3 pl-3 mb-4 bg-white border rounded" type="password" placeholder="Password"> | ||
| <label class="inline-block mb-4"> | ||
| <input class="mr-1" type="checkbox" name="terms" value="1"> | ||
| <span class="text-sm text-gray-500">By signing up, you agree to our <a class="font-bold hover:underline" href="#">Terms, Data Policy</a> and <a class="font-bold hover:underline" href="#">Cookies Policy</a>.</span> | ||
| </label> | ||
| <button class="block w-full mb-4 px-5 py-3 text-sm bg-indigo-500 hover:bg-indigo-600 text-white font-semibold border border-indigo-500 hover:border-indigo-600 rounded transition duration-200">Sign Up</button> | ||
| <p class="text-sm text-gray-500"> | ||
| <span>Already have an account?</span> | ||
| <a class="font-bold hover:underline" href="#">Sign In</a> | ||
| </p> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </section> | ||
|
|
||
| </div> | ||
| <div class="h-96 lg:h-auto lg:absolute top-0 right-0 bottom-0 lg:w-1/2 bg-no-repeat bg-cover" style="background-image: url('plain-assets/images/indigo-600-square.png');"></div> | ||
| </section> |