From 5744923265ff51e392575edfd6a8182589105dc6 Mon Sep 17 00:00:00 2001
From: eug-vs <eug-vs@keemail.me>
Date: Wed, 12 Aug 2020 01:59:27 +0300
Subject: feat: PollCreation page and Fab component
---
src/components/Fab/Fab.tsx | 55 ++++++++++++++++++++++++++++++++++++++++++++++
1 file changed, 55 insertions(+)
create mode 100644 src/components/Fab/Fab.tsx
(limited to 'src/components/Fab')
diff --git a/src/components/Fab/Fab.tsx b/src/components/Fab/Fab.tsx
new file mode 100644
index 0000000..335fcba
--- /dev/null
+++ b/src/components/Fab/Fab.tsx
@@ -0,0 +1,55 @@
+import React from 'react';
+import { useHistory } from 'react-router-dom'
+import {
+ Fab as FabBase,
+ useMediaQuery,
+ Slide,
+ useScrollTrigger
+} from '@material-ui/core/';
+import { makeStyles } from '@material-ui/core/styles';
+import PlusIcon from '@material-ui/icons/Add';
+
+interface PropTypes {
+ hideOnScroll?: boolean;
+}
+
+const useStyles = makeStyles(theme => ({
+ root: {
+ zIndex: 1200,
+ position: 'fixed',
+
+ [theme.breakpoints.down('sm')]: {
+ right: theme.spacing(2),
+ bottom: theme.spacing(8)
+ },
+ [theme.breakpoints.up('md')]: {
+ right: theme.spacing(5),
+ bottom: theme.spacing(5)
+ }
+ }
+}));
+
+const Fab: React.FC<PropTypes> = ({ hideOnScroll=false }) => {
+ const classes = useStyles();
+ const history = useHistory();
+ const trigger = useScrollTrigger();
+
+ const handleClick = () => {
+ history.push('/new');
+ };
+
+ return (
+ <Slide appear={false} direction="up" in={(!hideOnScroll) || !trigger}>
+ <FabBase
+ onClick={handleClick}
+ className={classes.root}
+ color="secondary"
+ >
+ <PlusIcon />
+ </FabBase>
+ </Slide>
+ );
+};
+
+export default Fab;
+
--
cgit v1.2.3
From c65923480118e90675c81782b9e3bc653e8e3b40 Mon Sep 17 00:00:00 2001
From: eug-vs <eug-vs@keemail.me>
Date: Thu, 13 Aug 2020 17:20:28 +0300
Subject: fix: resolve eslint errors
---
src/components/Fab/Fab.tsx | 15 +++++----------
1 file changed, 5 insertions(+), 10 deletions(-)
(limited to 'src/components/Fab')
diff --git a/src/components/Fab/Fab.tsx b/src/components/Fab/Fab.tsx
index 335fcba..7ca2893 100644
--- a/src/components/Fab/Fab.tsx
+++ b/src/components/Fab/Fab.tsx
@@ -1,11 +1,6 @@
import React from 'react';
-import { useHistory } from 'react-router-dom'
-import {
- Fab as FabBase,
- useMediaQuery,
- Slide,
- useScrollTrigger
-} from '@material-ui/core/';
+import { useHistory } from 'react-router-dom';
+import { Fab as FabBase, Slide, useScrollTrigger } from '@material-ui/core/';
import { makeStyles } from '@material-ui/core/styles';
import PlusIcon from '@material-ui/icons/Add';
@@ -15,7 +10,7 @@ interface PropTypes {
const useStyles = makeStyles(theme => ({
root: {
- zIndex: 1200,
+ zIndex: 1000,
position: 'fixed',
[theme.breakpoints.down('sm')]: {
@@ -29,7 +24,7 @@ const useStyles = makeStyles(theme => ({
}
}));
-const Fab: React.FC<PropTypes> = ({ hideOnScroll=false }) => {
+const Fab: React.FC<PropTypes> = ({ hideOnScroll = false }) => {
const classes = useStyles();
const history = useHistory();
const trigger = useScrollTrigger();
@@ -40,7 +35,7 @@ const Fab: React.FC<PropTypes> = ({ hideOnScroll=false }) => {
return (
<Slide appear={false} direction="up" in={(!hideOnScroll) || !trigger}>
- <FabBase
+ <FabBase
onClick={handleClick}
className={classes.root}
color="secondary"
--
cgit v1.2.3