Refactor Index page

choutkamartin · Jan 15, 2022 · 2b08f26 · 2b08f26
1 parent 73f78dc
commit 2b08f26
Showing 1 changed file with 21 additions and 21 deletions.
diff --git a/pages/index.jsx b/pages/index.jsx
@@ -6,30 +6,30 @@ import {
   faSpotify,
   faWordpress,
 } from "@fortawesome/free-brands-svg-icons";
-import Container from "components/layout/Container";
-import Title from "components/Title";
-import Anchor from "components/links/Anchor";
-import Brand from "components/logos/Brand";
+import Container from "components/Container";
+import Heading from "components/Heading";
+import Anchor from "components/Anchor";
+import IconBrand from "components/icons/IconBrand";
 import Paragraph from "components/Paragraph";
 import path from "utils/path";
 
-const Index = () => {
+function Index() {
   return (
     <div className="flex flex-col gap-y-36 py-8 lg:py-24">
       <Container variant="box">
         <div className="bg-hero w-full bg-cover bg-gray-700 bg-blend-multiply bg-center rounded-xl text-gray-100 px-8 lg:px-48 py-24 flex flex-col items-center text-center">
-          <Title headingLevel="h1" className="mb-4">
+          <Heading headingLevel="h1" className="mb-4">
             Get labeled data
             <br />
             <span className="text-indigo-300">fast and easily</span>
-          </Title>
+          </Heading>
           <Paragraph className="mb-3">
             Datapick is a data labelling tool, used for labelling various sorts
             of data, such as images or text. With those data, you can train your
             ML model.
           </Paragraph>
           <div className="flex flex-wrap gap-4">
-            <Anchor to="/" type="button" variant="primary">
+            <Anchor to={path.auth.signUp} type="button" variant="primary">
               Get started
             </Anchor>
             <Anchor to="/" type="button">
@@ -40,24 +40,24 @@ const Index = () => {
       </Container>
       <Container variant="box">
         <div className="flex flex-col w-full items-center">
-          <Title headingLevel="h2" className="mb-4 uppercase">
+          <Heading headingLevel="h2" className="mb-4 uppercase">
             Our Partners
-          </Title>
+          </Heading>
           <div className="flex flex-wrap gap-4">
-            <Brand icon={faFacebookF} />
-            <Brand icon={faSpotify} />
-            <Brand icon={faAws} />
-            <Brand icon={faGoogle} />
-            <Brand icon={faWordpress} />
-            <Brand icon={faDhl} />
+            <IconBrand icon={faFacebookF} />
+            <IconBrand icon={faSpotify} />
+            <IconBrand icon={faAws} />
+            <IconBrand icon={faGoogle} />
+            <IconBrand icon={faWordpress} />
+            <IconBrand icon={faDhl} />
           </div>
         </div>
       </Container>
       <Container variant="box">
         <div className="flex flex-col gap-y-4 items-center w-full text-center">
-          <Title headingLevel="h2" className="uppercase">
+          <Heading headingLevel="h2" className="uppercase">
             Ready to get started?
-          </Title>
+          </Heading>
           <div className="flex gap-x-8">
             <Anchor
               to={path.auth.signUp}
@@ -67,15 +67,15 @@ const Index = () => {
             >
               Sign Up
             </Anchor>
-            <Anchor to={path.company.company} type="button" className="w-full">
-              Contact Us
+            <Anchor to={path.auth.signIn} type="button" className="w-full">
+              Sign In
             </Anchor>
           </div>
         </div>
       </Container>
     </div>
   );
-};
+}
 
 Index.layout = "Public";
 export default Index;