Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Added more sections to the homepage #183

Merged
merged 5 commits into from
Jun 26, 2024
Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
100 changes: 76 additions & 24 deletions pages/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@ import { BsGearFill } from "react-icons/bs";
import ClientAPI from "@/lib/client/ClientAPI";
import { IoPhonePortrait, IoPhonePortraitOutline } from "react-icons/io5";
import useIsVisible from "@/lib/client/useIsVisible";
import SignIn from "./signin";

const api = new ClientAPI("gearboxiscool");

Expand Down Expand Up @@ -214,6 +215,24 @@ export default function Homepage() {
<span className="text-accent">pre-generated forms</span> for
every aspect of play
</li>
<li>
Get a headstart over the competition with <span className="text-accent">pit scouting</span>
</li>
<li>
Analyze your data and <span className="text-accent">build your picklist</span> with our <span className="text-accent">stats page</span>
</li>
<li>
Ensure your scouters are doing their job with <span className="text-accent">scouter management</span>
</li>
<li>
See who&apos;s ready to scout with <span className="text-accent">automatic check-in</span>
</li>
<li>
Harness the power of extra scouters with <span className="text-accent">subjective scouting</span>
</li>
<li>
Own your data with <span className="text-accent">CSV export</span>
</li>
</ul>
<div className="divider translate-y-6"></div>
</div>
Expand Down Expand Up @@ -244,7 +263,48 @@ export default function Homepage() {
</div>
</div>
</div>

<div className="hero w-full py-12 bg-base-100">
<div className="hero-content flex-col">
<h1 className="text-4xl max-sm:text-3xl font-bold leading-relaxed text-center">
No Scouters? <span className="text-secondary">No worries.</span>
</h1>
<div className="text-xl w-2/3 text-center">
With Gearbox, you can access a trove of <span className="text-accent">publicly available data</span> found nowhere else.
Gearbox enables you to utilize shared data, so every team - no matter the size - can develop a
{" "}<span className="text-accent">data-backed picklist</span>.
</div>
</div>
</div>

<div className="hero w-full py-12 bg-base-300 mt-12">
<div className="hero-content flex-col sm:flex-row-reverse">
<iframe
className="max-sm:hidden rounded-md"
src="https://discord.com/widget?id=1219401473042157718&theme=dark"
width="350"
height="500"
allowTransparency={true}
sandbox="allow-popups allow-popups-to-escape-sandbox allow-same-origin allow-scripts"
></iframe>
<div className="w-2/3 flex flex-row">
<div>
<h1 className="text-5xl font-bold">Realtime Support</h1>
<p className="mt-2">
Join our Discord server for live support with our support staff.
</p>
<a
href="https://discord.gg/ha7AnqxFDD"
className="btn btn-primary mt-4"
>
<FaDiscord size={35} /> Join today
</a>
</div>
</div>
</div>
</div>


<div
ref={thirdSection}
className={`hero py-6 sm:py-8 bg-base-100 w-full transition-transform ease-in duration-300 ${
Expand Down Expand Up @@ -291,31 +351,23 @@ export default function Homepage() {
</div>
</div>
</div>

<div className="hero w-full py-12 bg-base-300 mt-12">
<div className="hero-content flex-col sm:flex-row-reverse">
<iframe
className="max-sm:hidden rounded-md"
src="https://discord.com/widget?id=1219401473042157718&theme=dark"
width="350"
height="500"
allowTransparency={true}
sandbox="allow-popups allow-popups-to-escape-sandbox allow-same-origin allow-scripts"
></iframe>
<div className="w-2/3 flex flex-row">
<div>
<h1 className="text-5xl font-bold">Realtime Support</h1>
<p className="mt-2">
Join our Discord server for live support with our support staff.
</p>
<a
href="https://discord.gg/ha7AnqxFDD"
className="btn btn-primary mt-4"
>
<FaDiscord size={35} /> Join today
</a>

<div className="hero w-full py-12 bg-base-300">
<div className="hero-content flex-col">
<h1 className="text-4xl max-sm:text-3xl font-bold leading-relaxed text-center">
Get started today in <span className="text-secondary">under 5 minutes</span>.
</h1>
<div className="text-lg w-2/3 text-center">
The future of scouting is waiting - all you need is to sign in. Our interactive
onboarding will get your team ready to scout in less than five minutes.
</div>
</div>
<a
href={"/api/auth/signin"}
rel="noopener noreferrer"
target="_blank"
>
<button className="btn btn-primary text-2xl">Sign In</button>
</a>
</div>
</div>
</Container>
Expand Down
Loading