- integrating sign in with google

- set up dark mode context and other services
This commit is contained in:
Amruth Pillai
2020-07-03 18:59:25 +05:30
parent 336fd22150
commit 3a1d42025f
17 changed files with 405 additions and 115 deletions

View File

@ -1,71 +1,49 @@
import React, { useState } from "react";
import { graphql } from "gatsby";
import GatsbyImage from "gatsby-image";
import Button from "../components/shared/Button";
import AuthModal from "../modals/AuthModal";
const Home = ({ data }) => {
const [isAuthModalOpen, setAuthModalOpen] = useState(false);
const handleLogin = () => setAuthModalOpen(true);
import React from "react";
import Wrapper from "../components/shared/Wrapper";
import Hero from "../components/landing/Hero";
const Home = () => {
return (
<div className="container mt-24">
<div className="flex items-center">
<GatsbyImage
className="shadow-md rounded"
fixed={data.file.childImageSharp.fixed}
/>
<Wrapper>
<div className="container mt-24">
<Hero />
<div className="ml-12">
<h1 className="text-5xl font-bold">Reactive Resume</h1>
<h2 className="mt-1 text-3xl text-gray-500">
A free and open-source resume builder.
</h2>
<div className="pt-8">
<Feature title="Create a resume thats worthy of who you are.">
Keep up with the latest trends in resume design without having to
start from scratch. With new templates being designed every week and
having made it that easy to design your own templates and submit
them to the community, youll never have to copy and edit your
friends resume again.
</Feature>
<div className="mt-12 flex">
<Button title="Login" onClick={handleLogin} />
<AuthModal state={[isAuthModalOpen, setAuthModalOpen]} />
<Button className="ml-8" outline title="Source Code" />
</div>
<Feature title="Updating your resume shouldnt be a chore.">
The biggest problem Ive faced was when I had to update my resume
when I learned a new skill or found a new job. The ever-shifting
layouts and inconsistency with design over a number of years made it
difficult to update your own resume, but Reactive Resume makes it as
easy as few clicks.
</Feature>
<Feature title="Kickstarting your career shouldnt come at a cost.">
There are brilliant alternatives to this app like{" "}
<a href="/">Novoresume</a> and <a href="/">Zety</a>, but they come
at a cost, mainly because of the time the developers and the
marketing they had to incur to make the product. This app might not
be better than them, but it does cater to people who are just not in
a position to pay hundreds of dollars to create a resume to
bootstrap their career.
</Feature>
</div>
<footer className="my-24">
<p className="font-medium text-gray-500">
Licensed under <a href="/">MIT</a> | Made with love by{" "}
<a href="https://www.amruthpillai.com/">Amruth Pillai</a>
</p>
</footer>
</div>
<div className="pt-8">
<Feature title="Create a resume thats worthy of who you are.">
Keep up with the latest trends in resume design without having to
start from scratch. With new templates being designed every week and
having made it that easy to design your own templates and submit them
to the community, youll never have to copy and edit your friends
resume again.
</Feature>
<Feature title="Updating your resume shouldnt be a chore.">
The biggest problem Ive faced was when I had to update my resume when
I learned a new skill or found a new job. The ever-shifting layouts
and inconsistency with design over a number of years made it difficult
to update your own resume, but Reactive Resume makes it as easy as few
clicks.
</Feature>
<Feature title="Kickstarting your career shouldnt come at a cost.">
There are brilliant alternatives to this app like{" "}
<a href="/">Novoresume</a> and <a href="/">Zety</a>, but they come at
a cost, mainly because of the time the developers and the marketing
they had to incur to make the product. This app might not be better
than them, but it does cater to people who are just not in a position
to pay hundreds of dollars to create a resume to bootstrap their
career.
</Feature>
</div>
<footer className="my-24">
<p className="font-medium text-gray-500">
Licensed under <a href="/">MIT</a> | Made with love by{" "}
<a href="https://www.amruthpillai.com/">Amruth Pillai</a>
</p>
</footer>
</div>
</Wrapper>
);
};
@ -78,16 +56,4 @@ const Feature = ({ title, children }) => {
);
};
export const query = graphql`
query {
file(relativePath: { eq: "logo.png" }) {
childImageSharp {
fixed(width: 256, height: 256) {
...GatsbyImageSharpFixed
}
}
}
}
`;
export default Home;