From 020356cb5588c2fd4d12dd91d60fe082eb4c69a2 Mon Sep 17 00:00:00 2001 From: eug-vs Date: Fri, 3 Jul 2020 20:06:57 +0300 Subject: feat: create basic markup --- public/index.html | 1 + public/which-logo-512.png | Bin 0 -> 22412 bytes src/components/Header/Header.tsx | 2 +- src/pages/HomePage/HomePage.tsx | 58 ++++++++++++++++++++++++++++++++++----- 4 files changed, 53 insertions(+), 8 deletions(-) create mode 100644 public/which-logo-512.png diff --git a/public/index.html b/public/index.html index c3d52e2..001cbac 100644 --- a/public/index.html +++ b/public/index.html @@ -2,6 +2,7 @@ + Which diff --git a/public/which-logo-512.png b/public/which-logo-512.png new file mode 100644 index 0000000..ddcbd9f Binary files /dev/null and b/public/which-logo-512.png differ diff --git a/src/components/Header/Header.tsx b/src/components/Header/Header.tsx index 339f322..294c250 100644 --- a/src/components/Header/Header.tsx +++ b/src/components/Header/Header.tsx @@ -69,7 +69,7 @@ const Header: React.FC = () => { { - user?.avatarUrl?.match(/\.(jpeg|jpg|gif|png)$/) + user?.avatarUrl ? : } diff --git a/src/pages/HomePage/HomePage.tsx b/src/pages/HomePage/HomePage.tsx index 6930cc8..d0e29f5 100644 --- a/src/pages/HomePage/HomePage.tsx +++ b/src/pages/HomePage/HomePage.tsx @@ -1,18 +1,62 @@ import React, { useState } from 'react'; -import { Typography } from '@material-ui/core/'; +import { Typography, Divider, Grid, Button } from '@material-ui/core/'; import { makeStyles } from '@material-ui/core/styles'; +import { useNavigate } from '../../hooks/useNavigate'; -const useStyles = makeStyles({ -}); +const useStyles = makeStyles(theme => ({ + logo: { + width: theme.spacing(32), + height: theme.spacing(32) + }, + leftColumn: { + display: 'flex', + justifyContent: 'center' + }, + title: { + fontWeight: 'bold' + } +})); const HomePage: React.FC = () => { const classes = useStyles(); + const { navigate } = useNavigate(); - return ( - <> - Which one to choose? + const handleLetsGo = () => { + navigate('feed'); + }; - + return ( + + + logo + + + + + Which one to choose? + + +

Have you ever found yourself stuck between two options, not being able to choose any? This is exactly the problem we are going to solve!

+

Share your minor everyday uncertainties with the whole world and see what others think!

+ +
+
+ + About the project + +

+ Visit our GitHub +

+
+ + Leave feedback + + +
+
+
); }; -- cgit v1.2.3