diff --git a/react/src/components/lists/ListActions.js b/react/src/components/lists/ListActions.js index d003de1..9449021 100644 --- a/react/src/components/lists/ListActions.js +++ b/react/src/components/lists/ListActions.js @@ -87,7 +87,7 @@ export default function ListActions({ config={config.stiff} keys={actions.map(action => action({}).key)} from={{ opacity: 0, height: 0, margin: 0, padding: 0 }} - enter={{ opacity: 1, height: 30 }} + enter={{ opacity: 1, height: 30, margin: 0, padding: 0 }} leave={{ opacity: 0, height: 0, margin: 0, padding: 0 }} > {actions} diff --git a/react/src/components/lists/Selector.css b/react/src/components/lists/Selector.css index 136fa4a..654672d 100644 --- a/react/src/components/lists/Selector.css +++ b/react/src/components/lists/Selector.css @@ -5,6 +5,8 @@ align-self: center; background-color: #fbfbfb; flex-grow: 1; + margin-top: 1rem; + margin-bottom: 1rem; } #listselector input { @@ -17,7 +19,6 @@ background-color: #fbfbfb; border-bottom: 1px solid #888888; width: 80%; - margin: 1rem 0; } #listselector button { diff --git a/react/src/components/lists/Selector.js b/react/src/components/lists/Selector.js index 74d6c2e..6a26348 100644 --- a/react/src/components/lists/Selector.js +++ b/react/src/components/lists/Selector.js @@ -3,7 +3,7 @@ import PropTypes from 'prop-types'; import { Select, MenuItem } from '@material-ui/core'; import AddIcon from '@material-ui/icons/Add'; import CheckIcon from '@material-ui/icons/Check'; -import { animated, Transition } from 'react-spring'; +import { Transition, config } from 'react-spring'; import './Selector.css'; @@ -31,6 +31,7 @@ export default function Selector({
)} - input.value.trim() && addList(input.value)} > - +
); } @@ -65,7 +67,7 @@ export default function Selector({ return (
)} - input.value.trim() && editList(input.value)} > - +
); }