diff --git a/package.json b/package.json
index ebb484476..866d7a301 100644
--- a/package.json
+++ b/package.json
@@ -11,16 +11,13 @@
"@testing-library/react": "^11.1.0",
"@testing-library/user-event": "^12.1.10",
"date-fns": "^2.19.0",
- "formik": "^2.2.6",
"framer-motion": "^4",
"react": "^17.0.1",
- "react-datepicker": "^3.6.0",
"react-dom": "^17.0.1",
"react-router": "^5.2.0",
"react-router-dom": "^5.2.0",
"react-scripts": "4.0.3",
- "web-vitals": "^1.0.1",
- "yup": "^0.32.9"
+ "web-vitals": "^1.0.1"
},
"scripts": {
"start": "react-scripts start",
diff --git a/src/App.js b/src/App.js
index 969ccfd3d..3d780f0c3 100644
--- a/src/App.js
+++ b/src/App.js
@@ -10,16 +10,12 @@ function App() {
return (
-
-
-
-
);
diff --git a/src/common/components/smallTimer/SmallTimer.jsx b/src/common/components/smallTimer/SmallTimer.jsx
index 4ba7a710c..57a573f36 100644
--- a/src/common/components/smallTimer/SmallTimer.jsx
+++ b/src/common/components/smallTimer/SmallTimer.jsx
@@ -1,6 +1,6 @@
import styles from './SmallTimer.module.css';
-export default function SmallTimer({label, time}) {
+export default function SmallTimer({ label, time }) {
return (
{label}
diff --git a/src/common/input/ChakraInput.jsx b/src/common/input/ChakraInput.jsx
index 9fec5bccf..c282b2f65 100644
--- a/src/common/input/ChakraInput.jsx
+++ b/src/common/input/ChakraInput.jsx
@@ -19,4 +19,4 @@ export default function ChakraInput(props) {
}}
);
-}
\ No newline at end of file
+}
diff --git a/src/common/input/ChakraNumberInput.jsx b/src/common/input/ChakraNumberInput.jsx
deleted file mode 100644
index 887797233..000000000
--- a/src/common/input/ChakraNumberInput.jsx
+++ /dev/null
@@ -1,38 +0,0 @@
-import { FormErrorMessage } from '@chakra-ui/form-control';
-import { FormLabel } from '@chakra-ui/form-control';
-import { FormControl } from '@chakra-ui/form-control';
-import { NumberInputStepper } from '@chakra-ui/number-input';
-import { NumberInputField } from '@chakra-ui/number-input';
-import { NumberDecrementStepper } from '@chakra-ui/number-input';
-import { NumberIncrementStepper } from '@chakra-ui/number-input';
-import { NumberInput } from '@chakra-ui/number-input';
-import { Field } from 'formik';
-
-export default function ChakraNumberInput(props) {
- const { label, name, ...rest } = props;
-
- return (
-
- {({ field, form }) => {
- return (
-
- {label}
- form.setFieldValue(field.name, val)}
- >
-
-
-
-
-
-
-
- {form.errors[name]}
-
- );
- }}
-
- );
-}
diff --git a/src/common/input/SingleTimeInput.jsx b/src/common/input/SingleTimeInput.jsx
deleted file mode 100644
index 2f0b21870..000000000
--- a/src/common/input/SingleTimeInput.jsx
+++ /dev/null
@@ -1,28 +0,0 @@
-import { FormLabel } from '@chakra-ui/form-control';
-import { Text } from '@chakra-ui/layout';
-import {
- NumberDecrementStepper,
- NumberIncrementStepper,
- NumberInput,
- NumberInputField,
- NumberInputStepper,
-} from '@chakra-ui/number-input';
-import styles from './TimeInput.module.css';
-
-export default function SingleTimeInput(props) {
- return (
-
-
{props.label}
-
min
-
-
-
-
-
-
-
-
-
-
- );
-}
diff --git a/src/common/input/TimeInput.jsx b/src/common/input/TimeInput.jsx
deleted file mode 100644
index 2edd9dc17..000000000
--- a/src/common/input/TimeInput.jsx
+++ /dev/null
@@ -1,36 +0,0 @@
-import { FormErrorMessage } from '@chakra-ui/form-control';
-import { FormLabel } from '@chakra-ui/form-control';
-import { FormControl } from '@chakra-ui/form-control';
-import DatePicker from 'react-datepicker';
-import { Field } from 'formik';
-import 'react-datepicker/dist/react-datepicker.css';
-import './timeInput.css';
-
-export default function TimeInput(props) {
- const { label, name, ...rest } = props;
- return (
-
- {({ field, form }) => {
- const { setFieldValue } = form;
- const { value } = field;
- return (
-
- {label}
- setFieldValue(name, val)}
- />
- {form.errors[name]}
-
- );
- }}
-
- );
-}
diff --git a/src/common/input/TimeInput.module.css b/src/common/input/TimeInput.module.css
deleted file mode 100644
index a0ba4d93e..000000000
--- a/src/common/input/TimeInput.module.css
+++ /dev/null
@@ -1,17 +0,0 @@
-.container {
- padding-right: 1em;
- padding-top: 2em;
-}
-
-.timeInput {
- display: flex;
-}
-
-.label {
- font-size: 0.9em;
- color: #666;
-}
-
-.spacer {
- width: 0.25em
-}
\ No newline at end of file
diff --git a/src/common/input/timeInput.css b/src/common/input/timeInput.css
deleted file mode 100644
index a3804360a..000000000
--- a/src/common/input/timeInput.css
+++ /dev/null
@@ -1,122 +0,0 @@
-.react-datepicker {
- font-family: unset;
- font-size: 0.9rem;
-}
-
-.react-datepicker-wrapper,
-.react-datepicker__input-container {
- display: block;
-}
-
-.react-datepicker-popper {
- background-color: white;
-}
-.react-datepicker__input-container {
- font-size: 1rem;
- padding-left: 1rem;
- padding-right: 1rem;
- height: 2.5rem;
- border-radius: 0.25rem;
- border: 1px solid;
- border-color: hsl(0,0%,80%);
-}
-
-.react-datepicker__input-container:hover {
- border-color: hsl(0,0%,70%);
-}
-.react-datepicker__input-container:focus-within {
- z-index: 1;
- border-color: #3182ce;
- box-shadow: 0 0 0 1px #3182ce;
-}
-
-.react-datepicker__input-container > input {
- width: 100%;
- height: 100%;
- outline: 0;
-}
-
-.react-datepicker__navigation--next--with-time:not(.react-datepicker__navigation--next--with-today-button) {
- right: 90px;
-}
-
-.react-datepicker__navigation--previous,
-.react-datepicker__navigation--next {
- height: 8px;
-}
-
-.react-datepicker__navigation--previous {
- border-right-color: #cbd5e0;
-}
-
-.react-datepicker__navigation--previous:hover {
- border-right-color: #a0aec0;
-}
-
-.react-datepicker__navigation--next {
- border-left-color: #cbd5e0;
-
-}
-
-.react-datepicker__navigation--next:hover {
- border-left-color: #a0aec0;
-}
-
-.react-datepicker__header {
- background: #f7fafc;
-}
-
-.react-datepicker__header,
-.react-datepicker__time-container {
- border-color: #E2E8F0;
-}
-
-.react-datepicker__current-month,
-.react-datepicker-time__header,
-.react-datepicker-year-header {
- font-size: inherit;
- font-weight: 600;
-}
-
-.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item {
- margin: 0 1px 0 0;
- height: auto;
- padding: 7px 10px;
-}
-
-.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item:hover {
- background: #edf2f7;
-}
-
-.react-datepicker__day:hover {
- background: #edf2f7;
-}
-
-.react-datepicker__day--selected,
-.react-datepicker__day--in-selecting-range,
-.react-datepicker__day--in-range,
-.react-datepicker__month-text--selected,
-.react-datepicker__month-text--in-selecting-range,
-.react-datepicker__month-text--in-range,
-.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--selected {
- background: #3182ce;
- font-weight: normal;
-}
-
-.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--selected:hover {
- background: #2a69ac;
-}
-
-.react-datepicker__close-icon::after {
- background-color: unset;
- border-radius: unset;
- font-size: 1.5rem;
- font-weight: bold;
- color: hsl(0,0%,80%);
- height: 20px;
- width: 20px;
-}
-
-.react-datepicker__close-icon::after:hover {
- color: hsl(0,0%,70%)
-}
\ No newline at end of file
diff --git a/src/features/control/PlaybackControl.jsx b/src/features/control/PlaybackControl.jsx
index 6be4f3cd0..f8db0fa8d 100644
--- a/src/features/control/PlaybackControl.jsx
+++ b/src/features/control/PlaybackControl.jsx
@@ -2,25 +2,17 @@ import { Button } from '@chakra-ui/button';
import style from './PlaybackControl.module.css';
import Countdown from '../../common/components/countdown/Countdown';
import { useState } from 'react';
-import { clamp } from '../../app/utils';
import { ArrowBackIcon, ArrowForwardIcon } from '@chakra-ui/icons';
export default function PlaybackControl() {
- const [time, setTime] = useState(15);
+ const [time] = useState(15);
const [roll, setRoll] = useState(false);
- const incrementTimer = (amount = 1) => {
- const t = clamp(time + amount * 60, 0, 3600);
- setTime(t);
- };
-
const defProps = {
colorScheme: 'blackAlpha',
variant: 'outline',
};
- const smallSize = 50;
- const midSize = 100;
const bigSize = 120;
return (
@@ -29,44 +21,7 @@ export default function PlaybackControl() {
- {/*
-
-
-
*/}
-