-
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
39 changed files
with
6,290 additions
and
2,634 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,27 +1,46 @@ | ||
| <div> <section class="py-16 bg-gray-50"> | ||
| <div class="container px-4 mx-auto"> | ||
| <div class="flex flex-wrap items-center -mx-4"> | ||
| <div class="w-full lg:w-1/2 px-4 mt-16 lg:mt-0 order-last lg:order-first"> | ||
| <img class="block max-w-md mx-auto" src="acros-assets/images/applications/double-mobile.png" alt=""> | ||
| </div> | ||
| <div class="w-full lg:w-1/2 px-4"> | ||
| <div class="max-w-md mx-auto"> | ||
| <span class="text-sm font-semibold uppercase"> | ||
| <span>Develop your</span> | ||
| <span class="text-green-500">skills</span> | ||
| </span> | ||
| <h2 class="font-heading text-3xl sm:text-4xl mt-2 mb-6">See what this extension tool looks like</h2> | ||
| <p class="max-w-xl mx-auto text-lg leading-8 mb-10">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque massa nibh, pulvinar vitae aliquet nec.</p> | ||
| <div class="flex items-center"> | ||
| <a class="inline-block mr-4" href="#"> | ||
| <img class="h-14 w-36" src="acros-assets/buttons/app-store.svg" alt=""> | ||
| </a> | ||
| <a class="inline-block" href="#"> | ||
| <img class="h-14 w-36" src="acros-assets/buttons/google-play.svg" alt=""> | ||
| </a> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </section></div> | ||
| <div> | ||
| <section class="py-16 bg-gray-50"> | ||
| <div class="container px-4 mx-auto"> | ||
| <div class="flex flex-wrap items-center -mx-4"> | ||
| <div class="w-full lg:w-1/2 px-4 mt-16 lg:mt-0 order-last lg:order-first"> | ||
| <img | ||
| class="block max-w-md mx-auto" | ||
| src="https://shuffle.dev/acros-assets/images/applications/double-mobile.png" | ||
| alt="" | ||
| /> | ||
| </div> | ||
| <div class="w-full lg:w-1/2 px-4"> | ||
| <div class="max-w-md mx-auto"> | ||
| <span class="text-sm font-semibold uppercase"> | ||
| <span>Develop your</span> | ||
| <span class="text-green-500">skills</span> | ||
| </span> | ||
| <h2 class="font-heading text-3xl sm:text-4xl mt-2 mb-6"> | ||
| See what this extension tool looks like | ||
| </h2> | ||
| <p class="max-w-xl mx-auto text-lg leading-8 mb-10"> | ||
| Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque massa | ||
| nibh, pulvinar vitae aliquet nec. | ||
| </p> | ||
| <div class="flex items-center"> | ||
| <a class="inline-block mr-4" href="#"> | ||
| <img | ||
| class="h-14 w-36" | ||
| src="https://shuffle.dev/acros-assets/buttons/app-store.svg" | ||
| alt="" | ||
| /> | ||
| </a> | ||
| <a class="inline-block" href="#"> | ||
| <img | ||
| class="h-14 w-36" | ||
| src="https://shuffle.dev/acros-assets/buttons/google-play.svg" | ||
| alt="" | ||
| /> | ||
| </a> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </section> | ||
| </div> |
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,83 +1,191 @@ | ||
| <div><section> | ||
| <nav class="py-4 bg-white"> | ||
| <div class="container mx-auto px-4"> | ||
| <div class="relative flex items-center justify-between"> | ||
| <div class="w-auto"> | ||
| <a class="inline-block" href="#"> | ||
| <img src="acros-assets/logo/logo-acros-black.svg" alt=""> | ||
| </a> | ||
| </div> | ||
| <div class="absolute top-1/2 left-1/2 transform -translate-x-1/2 -translate-y-1/2 hidden lg:block"> | ||
| <ul class="flex items-center"> | ||
| <li class="font-heading mr-12 text-base"><a class="hover:text-black" href="#">About</a></li> | ||
| <li class="font-heading mr-12 text-base"><a class="hover:text-black" href="#">Company</a></li> | ||
| <li class="font-heading mr-12 text-base"><a class="hover:text-black" href="#">Services</a></li> | ||
| <li class="font-heading mr-12 text-base"><a class="hover:text-black" href="#">Testimonials</a></li> | ||
| </ul> | ||
| </div> | ||
| <div class="w-auto hidden lg:block"><a class="inline-block py-4 px-8 font-heading font-medium text-base text-white bg-green-500 hover:bg-green-600 border border-green-500 hover:border-green-600 rounded-sm transition duration-200" href="#">Contact</a></div> | ||
| <div class="w-auto lg:hidden"> | ||
| <a class="navbar-burger inline-flex w-14 h-14 justify-center items-center bg-gray-500 hover:bg-gray-600 rounded-full" href="#"> | ||
| <svg width="20" height="10" viewbox="0 0 20 10" fill="none" xmlns="http://www.w3.org/2000/svg"> | ||
| <path d="M19 9H1M19 1H1" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path> | ||
| </svg> | ||
| </a> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </nav> | ||
| <div class="container px-4 mx-auto"> | ||
| <div class="flex flex-wrap -mx-4 pt-10 pb-16 items-end"> | ||
| <div class="w-full lg:w-2/3 px-4 mb-12 lg:mb-0"> | ||
| <div class="max-w-lg md:max-w-2xl"> | ||
| <h1 class="font-heading text-4xl sm:text-5xl mb-10"> | ||
| <span>Take care of your</span> | ||
| <span class="text-green-500">performance</span> | ||
| <span>every day</span> | ||
| </h1> | ||
| <p class="text-lg leading-8">Build a well-presented brand that everyone will love. Take care to develop resources continually and integrity them with previous projects.</p> | ||
| </div> | ||
| </div> | ||
| <div class="w-full lg:w-auto px-4 ml-auto text-right"> | ||
| <a class="inline-block text-gray-900" href="#"> | ||
| <svg width="26" height="30" viewbox="0 0 26 30" fill="none" xmlns="http://www.w3.org/2000/svg"> | ||
| <path d="M13 1V29M13 29L25 17M13 29L1 17" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path> | ||
| </svg> | ||
| </a> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| <div class="relative h-140 w-full"> | ||
| <a class="absolute top-1/2 left-1/2 transform -translate-y-1/2 -translate-x-1/2 group flex items-center justify-center w-24 h-24 rounded-full overflow-hidden" href="#"> | ||
| <div class="absolute top-0 left-0 w-full h-full backdrop-blur backdrop-filter bg-gray-900 bg-opacity-50 group-hover:bg-opacity-40 group-hover:bg-gray-800 transition duration-150"></div> | ||
| <span class="relative"> | ||
| <svg width="17" height="21" viewbox="0 0 17 21" fill="none" xmlns="http://www.w3.org/2000/svg"> | ||
| <path fill-rule="evenodd" clip-rule="evenodd" d="M15.1336 12.2449C13.1896 14.3409 7.89891 17.8875 5.19224 19.0262C4.76024 19.2075 3.65891 19.5915 3.42158 19.5969C2.91758 19.6129 2.43224 19.3302 2.19758 18.8769C2.10691 18.7009 1.84024 17.5515 1.75491 17.0395C1.50158 15.4822 1.37091 13.0635 1.37358 10.6315C1.37091 8.07955 1.51224 5.54621 1.79491 4.00488C1.86958 3.58888 2.08824 2.63155 2.15224 2.47688C2.27224 2.18888 2.49091 1.96221 2.75491 1.82088C2.95758 1.71155 3.18958 1.65288 3.42158 1.66088C3.65891 1.66621 4.62424 2.00488 4.95491 2.13555C7.56291 3.14888 13.0802 6.82355 15.1069 8.98355C15.2882 9.17821 15.7869 9.70088 15.8696 9.80755C16.0589 10.0475 16.1522 10.3382 16.1522 10.6315C16.1522 10.9035 16.0696 11.1809 15.8989 11.4129C15.8109 11.5329 15.3016 12.0662 15.1336 12.2449Z" fill="white" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path> | ||
| </svg> | ||
| </span> | ||
| </a> | ||
| <img class="block h-full w-full object-cover" src="acros-assets/images/headers/header-3-data.jpg" alt=""> | ||
| </div> | ||
| <div class="hidden navbar-menu fixed top-0 left-0 bottom-0 w-5/6 max-w-sm z-50"> | ||
| <div class="navbar-backdrop fixed inset-0 backdrop-blur-xl backdrop-filter bg-gray-900 bg-opacity-80"></div> | ||
| <nav class="relative pt-7 pb-8 bg-white h-full overflow-y-auto"> | ||
| <div class="flex flex-col px-6 h-full"> | ||
| <a class="inline-block ml-4 mb-7" href="#"> | ||
| <img src="acros-assets/logo/logo-acros-black.svg" alt=""> | ||
| </a> | ||
| <ul class="w-full mb-auto pb-16"> | ||
| <li><a class="font-heading block text-base font-medium py-4 px-6 hover:bg-green-50 rounded-sm" href="#">Home</a></li> | ||
| <li><a class="font-heading block text-base py-4 px-6 hover:bg-green-50 rounded-sm" href="#">About</a></li> | ||
| <li><a class="font-heading block text-base py-4 px-6 hover:bg-green-50 rounded-sm" href="#">Company</a></li> | ||
| <li><a class="font-heading block text-base py-4 px-6 hover:bg-green-50 rounded-sm" href="#">Services</a></li> | ||
| <li><a class="font-heading block text-base py-4 px-6 hover:bg-green-50 rounded-sm" href="#">Testimonials</a></li> | ||
| <li><a class="font-heading block text-base py-4 px-6 hover:bg-green-50 rounded-sm" href="#">Contact</a></li> | ||
| </ul> | ||
| <div class="w-full"> | ||
| <a class="block w-full py-4 px-4 mb-4 text-center font-heading font-medium text-base hover:text-green-500 border border-gray-900 hover:border-green-500 rounded-sm transition duration-200" href="#">Log in</a><a class="block w-full py-4 px-4 mb-8 text-center font-heading font-medium text-base text-white bg-green-500 hover:bg-green-600 border border-green-500 hover:border-green-600 rounded-sm transition duration-200" href="#">Sign up</a> | ||
| <p class="pl-2 text-sm">2022 © Shuffle</p> | ||
| </div> | ||
| </div> | ||
| </nav> | ||
| </div> | ||
| </section> </div> | ||
| <div> | ||
| <section> | ||
| <nav class="py-4 bg-white"> | ||
| <div class="container mx-auto px-4"> | ||
| <div class="relative flex items-center justify-between"> | ||
| <div class="w-auto"> | ||
| <a class="inline-block" href="#"> | ||
| <img src="https://shuffle.dev/acros-assets/logo/logo-acros-black.svg" alt="" /> | ||
| </a> | ||
| </div> | ||
| <div class="absolute top-1/2 left-1/2 transform -translate-x-1/2 -translate-y-1/2 hidden lg:block"> | ||
| <ul class="flex items-center"> | ||
| <li class="font-heading mr-12 text-base"> | ||
| <a class="hover:text-black" href="#">About</a> | ||
| </li> | ||
| <li class="font-heading mr-12 text-base"> | ||
| <a class="hover:text-black" href="#">Company</a> | ||
| </li> | ||
| <li class="font-heading mr-12 text-base"> | ||
| <a class="hover:text-black" href="#">Services</a> | ||
| </li> | ||
| <li class="font-heading mr-12 text-base"> | ||
| <a class="hover:text-black" href="#">Testimonials</a> | ||
| </li> | ||
| </ul> | ||
| </div> | ||
| <div class="w-auto hidden lg:block"> | ||
| <a | ||
| class="inline-block py-4 px-8 font-heading font-medium text-base text-white bg-green-500 hover:bg-green-600 border border-green-500 hover:border-green-600 rounded-sm transition duration-200" | ||
| href="#" | ||
| >Contact</a | ||
| > | ||
| </div> | ||
| <div class="w-auto lg:hidden"> | ||
| <a | ||
| class="navbar-burger inline-flex w-14 h-14 justify-center items-center bg-gray-500 hover:bg-gray-600 rounded-full" | ||
| href="#" | ||
| > | ||
| <svg | ||
| width="20" | ||
| height="10" | ||
| viewbox="0 0 20 10" | ||
| fill="none" | ||
| xmlns="http://www.w3.org/2000/svg" | ||
| > | ||
| <path | ||
| d="M19 9H1M19 1H1" | ||
| stroke="white" | ||
| stroke-width="1.5" | ||
| stroke-linecap="round" | ||
| stroke-linejoin="round" | ||
| ></path> | ||
| </svg> | ||
| </a> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </nav> | ||
| <div class="container px-4 mx-auto"> | ||
| <div class="flex flex-wrap -mx-4 pt-10 pb-16 items-end"> | ||
| <div class="w-full lg:w-2/3 px-4 mb-12 lg:mb-0"> | ||
| <div class="max-w-lg md:max-w-2xl"> | ||
| <h1 class="font-heading text-4xl sm:text-5xl mb-10"> | ||
| <span>Take care of your</span> | ||
| <span class="text-green-500">performance</span> | ||
| <span>every day</span> | ||
| </h1> | ||
| <p class="text-lg leading-8"> | ||
| Build a well-presented brand that everyone will love. Take care to develop | ||
| resources continually and integrity them with previous projects. | ||
| </p> | ||
| </div> | ||
| </div> | ||
| <div class="w-full lg:w-auto px-4 ml-auto text-right"> | ||
| <a class="inline-block text-gray-900" href="#"> | ||
| <svg | ||
| width="26" | ||
| height="30" | ||
| viewbox="0 0 26 30" | ||
| fill="none" | ||
| xmlns="http://www.w3.org/2000/svg" | ||
| > | ||
| <path | ||
| d="M13 1V29M13 29L25 17M13 29L1 17" | ||
| stroke="currentColor" | ||
| stroke-width="1.5" | ||
| stroke-linecap="round" | ||
| stroke-linejoin="round" | ||
| ></path> | ||
| </svg> | ||
| </a> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| <div class="relative h-140 w-full"> | ||
| <a | ||
| class="absolute top-1/2 left-1/2 transform -translate-y-1/2 -translate-x-1/2 group flex items-center justify-center w-24 h-24 rounded-full overflow-hidden" | ||
| href="#" | ||
| > | ||
| <div | ||
| class="absolute top-0 left-0 w-full h-full backdrop-blur backdrop-filter bg-gray-900 bg-opacity-50 group-hover:bg-opacity-40 group-hover:bg-gray-800 transition duration-150" | ||
| ></div> | ||
| <span class="relative"> | ||
| <svg width="17" height="21" viewbox="0 0 17 21" fill="none" xmlns="http://www.w3.org/2000/svg"> | ||
| <path | ||
| fill-rule="evenodd" | ||
| clip-rule="evenodd" | ||
| d="M15.1336 12.2449C13.1896 14.3409 7.89891 17.8875 5.19224 19.0262C4.76024 19.2075 3.65891 19.5915 3.42158 19.5969C2.91758 19.6129 2.43224 19.3302 2.19758 18.8769C2.10691 18.7009 1.84024 17.5515 1.75491 17.0395C1.50158 15.4822 1.37091 13.0635 1.37358 10.6315C1.37091 8.07955 1.51224 5.54621 1.79491 4.00488C1.86958 3.58888 2.08824 2.63155 2.15224 2.47688C2.27224 2.18888 2.49091 1.96221 2.75491 1.82088C2.95758 1.71155 3.18958 1.65288 3.42158 1.66088C3.65891 1.66621 4.62424 2.00488 4.95491 2.13555C7.56291 3.14888 13.0802 6.82355 15.1069 8.98355C15.2882 9.17821 15.7869 9.70088 15.8696 9.80755C16.0589 10.0475 16.1522 10.3382 16.1522 10.6315C16.1522 10.9035 16.0696 11.1809 15.8989 11.4129C15.8109 11.5329 15.3016 12.0662 15.1336 12.2449Z" | ||
| fill="white" | ||
| stroke="white" | ||
| stroke-width="1.5" | ||
| stroke-linecap="round" | ||
| stroke-linejoin="round" | ||
| ></path> | ||
| </svg> | ||
| </span> | ||
| </a> | ||
| <img | ||
| class="block h-full w-full object-cover" | ||
| src="https://shuffle.dev/acros-assets/images/headers/header-3-data.jpg" | ||
| alt="" | ||
| /> | ||
| </div> | ||
| <div class="hidden navbar-menu fixed top-0 left-0 bottom-0 w-5/6 max-w-sm z-50"> | ||
| <div class="navbar-backdrop fixed inset-0 backdrop-blur-xl backdrop-filter bg-gray-900 bg-opacity-80"></div> | ||
| <nav class="relative pt-7 pb-8 bg-white h-full overflow-y-auto"> | ||
| <div class="flex flex-col px-6 h-full"> | ||
| <a class="inline-block ml-4 mb-7" href="#"> | ||
| <img src="https://shuffle.dev/acros-assets/logo/logo-acros-black.svg" alt="" /> | ||
| </a> | ||
| <ul class="w-full mb-auto pb-16"> | ||
| <li> | ||
| <a | ||
| class="font-heading block text-base font-medium py-4 px-6 hover:bg-green-50 rounded-sm" | ||
| href="#" | ||
| >Home</a | ||
| > | ||
| </li> | ||
| <li> | ||
| <a | ||
| class="font-heading block text-base py-4 px-6 hover:bg-green-50 rounded-sm" | ||
| href="#" | ||
| >About</a | ||
| > | ||
| </li> | ||
| <li> | ||
| <a | ||
| class="font-heading block text-base py-4 px-6 hover:bg-green-50 rounded-sm" | ||
| href="#" | ||
| >Company</a | ||
| > | ||
| </li> | ||
| <li> | ||
| <a | ||
| class="font-heading block text-base py-4 px-6 hover:bg-green-50 rounded-sm" | ||
| href="#" | ||
| >Services</a | ||
| > | ||
| </li> | ||
| <li> | ||
| <a | ||
| class="font-heading block text-base py-4 px-6 hover:bg-green-50 rounded-sm" | ||
| href="#" | ||
| >Testimonials</a | ||
| > | ||
| </li> | ||
| <li> | ||
| <a | ||
| class="font-heading block text-base py-4 px-6 hover:bg-green-50 rounded-sm" | ||
| href="#" | ||
| >Contact</a | ||
| > | ||
| </li> | ||
| </ul> | ||
| <div class="w-full"> | ||
| <a | ||
| class="block w-full py-4 px-4 mb-4 text-center font-heading font-medium text-base hover:text-green-500 border border-gray-900 hover:border-green-500 rounded-sm transition duration-200" | ||
| href="#" | ||
| >Log in</a | ||
| ><a | ||
| class="block w-full py-4 px-4 mb-8 text-center font-heading font-medium text-base text-white bg-green-500 hover:bg-green-600 border border-green-500 hover:border-green-600 rounded-sm transition duration-200" | ||
| href="#" | ||
| >Sign up</a | ||
| > | ||
| <p class="pl-2 text-sm">2022 © Shuffle</p> | ||
| </div> | ||
| </div> | ||
| </nav> | ||
| </div> | ||
| </section> | ||
| </div> |
Oops, something went wrong.