Improve laptop image and sections spacing (#1298)

## Description

- Reduce laptop image size so that it does not dominate the page/section
- Fix spacing issues that were introduced when we copy-pasted from different templates
- Also fixes a typo noticed in a previous PR

## Type of change

- [x] 🐛 Bugfix

## Test Plan

- [x] 💪 Manual
This commit is contained in:
Niraj Tolia 2022-10-21 19:52:42 -07:00 committed by GitHub
parent 77446c030a
commit 08ca12ee0c
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 7 additions and 7 deletions

Binary file not shown.

Before

Width:  |  Height:  |  Size: 747 KiB

After

Width:  |  Height:  |  Size: 419 KiB

View File

@ -173,12 +173,12 @@
<div class="container md:mt-24 mt-16"> <div class="container md:mt-24 mt-16">
<div class="container lg mx-auto"> <div class="container lg mx-auto">
<div class="grid grid-cols-1 pb-8 text-center wow animate__animated animate__fadeInUp"> <div class="grid grid-cols-1 pb-2 text-center wow animate__animated animate__fadeInUp">
<h3 class="mb-6 mt-8 md:text-4xl text-3xl md:leading-normal leading-normal font-bold">Why Everyone <span class="after:absolute after:right-0 after:left-0 after:bottom-1 after:lg:h-3 after:h-2 after:w-auto after:rounded-md after:bg-indigo-600/30 relative text-indigo-600">Loves</span> Corso</h3> <h3 class="mb-6 mt-8 md:text-4xl text-3xl md:leading-normal leading-normal font-bold">Why Everyone <span class="after:absolute after:right-0 after:left-0 after:bottom-1 after:lg:h-3 after:h-2 after:w-auto after:rounded-md after:bg-indigo-600/30 relative text-indigo-600">Loves</span> Corso</h3>
</div><!--end grid--> </div><!--end grid-->
</div><!--end container--> </div><!--end container-->
<div class="grid md:grid-cols-2 grid-cols-1 items-center mt-8 gap-[30px]"> <div class="grid md:grid-cols-2 grid-cols-1 items-center gap-[30px]">
<div class="relative wow animate__animated animate__fadeInLeft" data-wow-delay=".3s"> <div class="relative wow animate__animated animate__fadeInLeft" data-wow-delay=".3s">
<img src="assets/images/why/chat.svg" class="rounded-lg" alt=""> <img src="assets/images/why/chat.svg" class="rounded-lg" alt="">
<div class="overflow-hidden absolute lg:h-[400px] h-[320px] lg:w-[400px] w-[320px] bg-indigo-600/5 bottom-0 left-0 rotate-45 -z-1 rounded-3xl"></div> <div class="overflow-hidden absolute lg:h-[400px] h-[320px] lg:w-[400px] w-[320px] bg-indigo-600/5 bottom-0 left-0 rotate-45 -z-1 rounded-3xl"></div>
@ -266,7 +266,7 @@
</div> </div>
</div><!--end container--> </div><!--end container-->
<div class="container md:mt-24 mt-16 wow animate__animated animate__fadeInUp"> <div class="container md:mb-8 mb-4 md:mt-24 mt-16 wow animate__animated animate__fadeInUp">
<div class="grid grid-cols-1 pb-8 text-center"> <div class="grid grid-cols-1 pb-8 text-center">
<h3 class="mb-6 mt-8 md:text-4xl text-3xl md:leading-normal leading-normal font-bold">Frequently Asked Questions</h3> <h3 class="mb-6 mt-8 md:text-4xl text-3xl md:leading-normal leading-normal font-bold">Frequently Asked Questions</h3>
</div><!--end grid--> </div><!--end grid-->
@ -373,7 +373,7 @@
</h2> </h2>
<div id="accordion-collapse-body-6" class="hidden" aria-labelledby="accordion-collapse-heading-6"> <div id="accordion-collapse-body-6" class="hidden" aria-labelledby="accordion-collapse-heading-6">
<div class="p-5"> <div class="p-5">
<p class="text-slate-400 dark:text-gray-400">You can request new features by create a <a href="https://github.com/alcionai/corso/issues" class="text-indigo-600" target="_blank">new GitHub issue</a> and labeling it as an enhancement.</p> <p class="text-slate-400 dark:text-gray-400">You can request new features by creating a <a href="https://github.com/alcionai/corso/issues" class="text-indigo-600" target="_blank">new GitHub issue</a> and labeling it as an enhancement.</p>
</div> </div>
</div> </div>
</div> </div>
@ -385,16 +385,16 @@
<!-- End Section--> <!-- End Section-->
<!-- Start --> <!-- Start -->
<section class="relative md:py-24 py-16 md:pt-0 pt-0"> <section class="relative md:py-16 py-12 md:pt-0 pt-0">
<div class="container"> <div class="container">
<div class="grid grid-cols-1 justify-center wow animate__animated animate__fadeInUp" data-wow-delay=".1s"> <div class="grid grid-cols-1 justify-center wow animate__animated animate__fadeInUp" data-wow-delay=".1s">
<div class="relative z-1"> <div class="relative z-1">
<div class="grid grid-cols-1 md:text-left text-center justify-center"> <div class="grid grid-cols-1 md:text-left text-center justify-center">
<div class="relative"> <div class="relative">
<img src="assets/images/laptop-macbook.png" alt=""> <img src="assets/images/laptop-macbook.png" class ="mx-auto" alt="Laptop image showing Microsoft 365 icons">
</div> </div>
</div> </div>
<div class="content md:mt-8"> <div class="content md:mt-0">
<div class="grid lg:grid-cols-12 grid-cols-1 md:text-left text-center justify-center"> <div class="grid lg:grid-cols-12 grid-cols-1 md:text-left text-center justify-center">
<div class="lg:col-start-2 lg:col-span-10"> <div class="lg:col-start-2 lg:col-span-10">
<div class="grid md:grid-cols-2 grid-cols-1 items-center"> <div class="grid md:grid-cols-2 grid-cols-1 items-center">