2d2bada884
The div HTML tags in various components of the project have been replaced with more appropriate section tags for better semantic structure. This affects the TestimonialsSection, Products, FeaturesStats, and several other components. Options for minifying JavaScript in the process-html file have also been updated. In the MainLayout, a main tag has been added to wrap page content for better accessibility and semantics.
131 lines
3.9 KiB
Text
131 lines
3.9 KiB
Text
---
|
|
// Import the necessary dependencies
|
|
import GithubBtn from "./ui/buttons/GithubBtn.astro";
|
|
|
|
// Define the variables that will be used in this component
|
|
const title: string = "Let's Build Together";
|
|
const subTitle: string =
|
|
"ScrewFast is an open-source template, meticulously crafted with Astro, Tailwind CSS, and Preline UI frameworks.";
|
|
---
|
|
|
|
<section class="relative mx-auto max-w-[85rem] px-4 pb-24 pt-10 sm:px-6 lg:px-8">
|
|
<!-- Decorating SVG elements -->
|
|
<div
|
|
class="absolute left-0 top-[55%] scale-90 md:top-[20%] xl:left-[10%] xl:top-[25%]"
|
|
>
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
width="64"
|
|
height="64"
|
|
fill="none"
|
|
stroke-width="1.5"
|
|
color="#ea580c"
|
|
viewBox="0 0 24 24"
|
|
>
|
|
<path
|
|
fill="#ea580c"
|
|
stroke="#ea580c"
|
|
stroke-linecap="round"
|
|
stroke-linejoin="round"
|
|
d="M12 23a1 1 0 1 0 0-2 1 1 0 0 0 0 2ZM3 8a1 1 0 1 0 0-2 1 1 0 0 0 0 2ZM3 18a1 1 0 1 0 0-2 1 1 0 0 0 0 2Z"
|
|
></path>
|
|
<path
|
|
stroke="#ea580c"
|
|
stroke-linecap="round"
|
|
stroke-linejoin="round"
|
|
d="M21 7.353v9.294a.6.6 0 0 1-.309.525l-8.4 4.666a.6.6 0 0 1-.582 0l-8.4-4.666A.6.6 0 0 1 3 16.647V7.353a.6.6 0 0 1 .309-.524l8.4-4.667a.6.6 0 0 1 .582 0l8.4 4.667a.6.6 0 0 1 .309.524Z"
|
|
></path>
|
|
<path
|
|
stroke="#ea580c"
|
|
stroke-linecap="round"
|
|
stroke-linejoin="round"
|
|
d="m3.528 7.294 8.18 4.544a.6.6 0 0 0 .583 0l8.209-4.56M12 21v-9"
|
|
></path>
|
|
</svg>
|
|
</div>
|
|
<div class="absolute left-[85%] top-0 scale-75">
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
width="64"
|
|
height="64"
|
|
fill="none"
|
|
stroke-width="1.5"
|
|
color="#fbbf24"
|
|
viewBox="0 0 24 24"
|
|
>
|
|
<path
|
|
stroke="#fbbf24"
|
|
stroke-linecap="round"
|
|
stroke-linejoin="round"
|
|
d="M12 22c5.523 0 10-4.477 10-10S17.523 2 12 2 2 6.477 2 12s4.477 10 10 10Z"
|
|
></path>
|
|
<path
|
|
fill="#fbbf24"
|
|
stroke="#fbbf24"
|
|
stroke-linecap="round"
|
|
stroke-linejoin="round"
|
|
d="M5 6a1 1 0 1 0 0-2 1 1 0 0 0 0 2Z"></path>
|
|
<path
|
|
stroke="#fbbf24"
|
|
stroke-linecap="round"
|
|
stroke-linejoin="round"
|
|
d="M5 10.5V9M5 15v-1.5"></path>
|
|
<path
|
|
fill="#fbbf24"
|
|
stroke="#fbbf24"
|
|
stroke-linecap="round"
|
|
stroke-linejoin="round"
|
|
d="M5 20a1 1 0 1 0 0-2 1 1 0 0 0 0 2ZM19 20a1 1 0 1 0 0-2 1 1 0 0 0 0 2Z"
|
|
></path>
|
|
<path
|
|
stroke="#fbbf24"
|
|
stroke-linecap="round"
|
|
stroke-linejoin="round"
|
|
d="M10.5 19H9M15 19h-1.5"></path>
|
|
</svg>
|
|
</div>
|
|
<div
|
|
class="absolute bottom-[5%] left-[60%] scale-[.6] xl:bottom-[15%] xl:left-[35%]"
|
|
>
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
width="64"
|
|
height="64"
|
|
fill="none"
|
|
stroke-width="1.5"
|
|
color="#a3a3a3"
|
|
viewBox="0 0 24 24"
|
|
>
|
|
<path
|
|
stroke="#a3a3a3"
|
|
stroke-linecap="round"
|
|
stroke-linejoin="round"
|
|
d="M5.164 17c.29-1.049.67-2.052 1.132-3M11.5 7.794A16.838 16.838 0 0 1 14 6.296M4.5 22a2.5 2.5 0 1 1 0-5 2.5 2.5 0 0 1 0 5Z"
|
|
></path>
|
|
<path
|
|
stroke="#a3a3a3"
|
|
stroke-linecap="round"
|
|
stroke-linejoin="round"
|
|
d="M9.5 12a2.5 2.5 0 1 1 0-5 2.5 2.5 0 0 1 0 5ZM19.5 7a2.5 2.5 0 1 1 0-5 2.5 2.5 0 0 1 0 5Z"
|
|
></path>
|
|
</svg>
|
|
</div>
|
|
<!-- Hero Section Heading -->
|
|
<div class="mx-auto mt-5 max-w-xl text-center">
|
|
<h2
|
|
class="block text-balance text-4xl font-bold leading-tight tracking-tight text-neutral-800 dark:text-neutral-200 md:text-5xl lg:text-6xl"
|
|
>
|
|
{title}
|
|
</h2>
|
|
</div>
|
|
<!-- Hero Section Sub-heading -->
|
|
<div class="mx-auto mt-5 max-w-3xl text-center">
|
|
<p class="text-pretty text-lg text-neutral-600 dark:text-neutral-400">
|
|
{subTitle}
|
|
</p>
|
|
</div>
|
|
<!-- Github Button -->
|
|
<div class="mt-8 flex justify-center gap-3">
|
|
<GithubBtn url="https://github.com/mearashadowfax/ScrewFast" />
|
|
</div>
|
|
</section>
|