Files
ax3Client/src/Components/Home/HomePage.js
Kenneth Jannette 4778e42e1a more
2024-03-20 03:22:00 -05:00

317 lines
12 KiB
JavaScript
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
import { useEffect } from "react";
import { collection, setDoc, doc } from "firebase/firestore";
import { db } from "../../firebase";
import Button from "../../pageElements/Button";
import { v4 as uuidv4 } from "uuid";
import arrow from "../../Assets/Images/Arrow.png";
import { useNavigate } from "react-router-dom";
import "../../styles/homepage.scss";
const HomePage = () => {
const navigate = useNavigate();
async function saveData(data) {
const id = uuidv4();
const visitRef = collection(db, "homevisitors");
await setDoc(doc(visitRef, `${id}`), data);
}
function getPosition() {
return new Promise((res, rej) => {
navigator.geolocation.getCurrentPosition(res, rej);
});
}
useEffect(() => {
if (window.location.href === "http://localhost:3000/") {
return;
}
const userAgent = window?.navigator.userAgent;
getPosition().then((data) => {
const dateTime = new Date();
const currentLat = data.coords.latitude;
const currentLong = data.coords.longitude;
const values = {};
values["userAgent"] = userAgent;
values["latitude"] = currentLat;
values["longitude"] = currentLong;
values["dateTime"] = String(dateTime);
saveData(values);
});
}, []);
const handleNavigate = () => {
navigate("/signup");
};
const handleLogin = () => {
navigate("/login");
};
const handleDemo = () => {
const supReq = null;
navigate("/requestpage/supReq");
};
return (
<>
<div className="homepage-container">
<section
className="section-1"
style={{
backgroundImage: `url(https://imagedelivery.net/OvFc3s8IYmBw7-_bogeTLg/ee5222a0-7480-43ba-0f14-0ea482f31300/public)`,
backgroundSize: "cover",
}}
>
<div className="first-section-subcontainer">
<div className="row upper-row-one">
<div className="col-md-12 mobile-col-up">
<div className="heading-one-container">
<h1 className="heading-1">Novodraft: Legal AI.</h1>
<h1 className="heading-1-mobile">Novodraft</h1>
<h1 className="heading-2-mobile">
AI-Assisted Legal Drafting
</h1>
<h1 className="heading-2">
Draft documents faster <i>and </i> smarter.
</h1>
</div>
<div className="mobile-lower-header-1">
<div className="mobile-lower-header-top">
<div className="mobile-sw-deck">Discovery requests</div>
<div className="mobile-sw-deck"> dramatically fast</div>
<div className="mobile-sw-reptwo">
<div className="ex-arca-two">Draft responses to</div>
<div className="ex-arca-two">demands in minutes</div>
</div>
</div>
<div className="mobile-lower-header-bottom">
<div className="mobile-lower-header-bottom-up"></div>
<div className="mobile-lower-header-bottom-down">
<Button
className="primary-button homepage-button"
labelText="Try It For Free"
onClick={handleNavigate}
/>
</div>
</div>
</div>
<p className="text-block-1">
Discovery requests done dramatically fast discovery
responses ready in minutes
</p>
<p className="text-block-two">
Reclaim hours every week. Spend time growing your practice, or
just get home by dinner.
</p>
<div className="try-it-button-box">
<Button
className="primary-button homepage-button"
labelText="Try It For Free"
onClick={handleNavigate}
/>
</div>
</div>
</div>
</div>
</section>
{/* Section 2 */}
<section className="section-2">
<div className="home-row">
<div className="home-col-50">
<div className="heading-2-mobile-box">
<h2 className="heading-2-mobile">
Made by Attorneys, for Attorneys
</h2>
</div>
<div className="pad-2">
<img
src="https://imagedelivery.net/OvFc3s8IYmBw7-_bogeTLg/5f0f6f11-bb56-4f03-b05e-189d4f1a5600/public"
alt="image of a laptop computer"
className="img-2"
/>
</div>
</div>
<div className="home-col-50">
<div className="pad-2">
<h2 className="heading-2">Made by Attorneys, for Attorneys</h2>
<div className="text-block-2-box">
<p className="text-block-2">
Legal tech built by people that get it.
</p>
</div>
<p className="section-two-body">
Novodraft understands the demands on your time. For example,
that discovery request on your desk. With a few clicks, and
Novodraft's AI assistant on the task, you can draft a
ready-to-serve response in minutes. It's as easy as uploading
a .pdf file.
</p>
<p className="section-two-body">
Novodraft cuts through a mire of rote tasks, but does much
more than automate.
</p>
<p className="section-two-body">
Intellidraft AI technology powers persuasive arguments and
boosts bland, boilerplate objections. Configurable for level
of authoritative citation and for infering factual context
from pleadings and briefs. Use it to augment your drafting as
much or as little as you prefer.
</p>
<div className="home-link-box">
<a className="link">
Explore Novodraft
<img src={arrow} className="img-1" alt="" />
</a>
</div>
</div>
</div>
</div>
</section>
{/* Section 3 */}
<section className="section-3">
<div className="section-three-header-box">
<h2 className="section-three-header">
AI-Powered Legal Drafting Technology{" "}
</h2>
<h2 className="section-three-header-mobile">
Novo Drafting Technology
</h2>
<p className="section-three-subhead">
Created by litigators to give you an edge.
</p>
</div>
<div className="card-section-container">
{/*********** CARD ONE *********** */}
<div className="home-card">
<div className="card-image-container">
<img
src="https://imagedelivery.net/OvFc3s8IYmBw7-_bogeTLg/5ff0ba9e-298f-4ee1-88d4-e19a44a00900/public"
alt="ai hand"
width="100%"
className="card-image"
/>
</div>
<div className="card-body">
<div className="card-upper-box">
<div className="home-card-title">
<h3 className="foo-card-title">Discovery Requests</h3>
<div className="home-card-divider"></div>
</div>
</div>
<div className="home-card-text-box">
<p className="card-texts">
Generate discovery requests with AI at your service, edit or
add special language with tags. Concise yet comprehensive
demands, done in minutes and downloadable as .docx.
</p>
</div>
</div>
</div>
{/*********** CARD TWO *********** */}
<div className="home-card">
<div className="card-image-container">
<img
src="https://imagedelivery.net/OvFc3s8IYmBw7-_bogeTLg/7a6dd50e-4d8f-4068-61b2-634dc5603f00/public"
alt="scales image"
width="100%"
className="card-image"
/>
</div>
<div className="card-body">
<div className="card-upper-box">
<div className="home-card-title">
<h3 className="foo-card-title">Discovery Responses</h3>
<div className="home-card-divider"></div>
</div>
</div>
<div className="home-card-text-box">
<p className="card-texts">
Novodraft's AI powers responses with compelling arguments
about what you choose to disclose and withhold. You'll
finish in minutes with a downloadable .docx file.
</p>
</div>
</div>
</div>
{/*********** CARD THREE *********** */}
<div className="home-card">
<div className="card-image-container">
<img
src="https://imagedelivery.net/OvFc3s8IYmBw7-_bogeTLg/00667aa1-f847-430c-7a5e-d96abeed3300/public"
alt=""
className="card-image"
/>
</div>
<div className="card-body">
<div className="card-upper-box">
<div className="home-card-title">
<h3 className="foo-card-title">Proactive Alerts</h3>
<div className="home-card-divider"></div>
</div>
</div>
<div className="home-card-text-box">
<p className="card-texts">
Your dashboard displays important deadlines, alerts, and can
configure to auto-draft documents and remind you to serve
them.
</p>
</div>
</div>
</div>
</div>
</section>
<section className="section-5 py-5">
<div
className="home-test-container"
style={{
backgroundImage: `url(https://imagedelivery.net/OvFc3s8IYmBw7-_bogeTLg/209dcf14-c086-42b4-ca72-f058d9ad1b00/public)`,
backgroundSize: "cover",
}}
>
<div className="row">
<div className="col-md-6">
<div className="bottom-header-box">
<h4 className="heading-6">
Questions about our services? <br></br>
We're here to answer!
</h4>
<h4 className="heading-6-mobile">
Questions about our products and services?
</h4>
<h4 className="heading-6-mobile">We're here to answer!</h4>
</div>
<h6 className="join-heading">
Novodraft will revolutionize your practice.
</h6>
<h6 className="join-heading">
Request a demo - let us show you how.
</h6>
<h6 className="join-heading-mobile">
Revolutionize your practice.
</h6>
<h6 className="join-heading-mobile">Let us show you how.</h6>
</div>
<div className="col-md-6 d-flex">
<button className="button-2" onClick={handleDemo}>
Request a demo
</button>
<button className="button-2" onClick={handleLogin}>
Go to login
</button>
</div>
</div>
</div>
</section>
</div>
</>
);
};
export default HomePage;