diff options
Diffstat (limited to 'src/Settings.tsx')
-rw-r--r-- | src/Settings.tsx | 30 |
1 files changed, 17 insertions, 13 deletions
diff --git a/src/Settings.tsx b/src/Settings.tsx index 3537894..d5ca681 100644 --- a/src/Settings.tsx +++ b/src/Settings.tsx @@ -20,7 +20,9 @@ import Checkbox from '@material-ui/core/Checkbox'; import TextField from '@material-ui/core/TextField'; import MenuItem from '@material-ui/core/MenuItem'; import Select from '@material-ui/core/Select'; -import { getColorFamily } from 'materialcolorize' +import { getColorFamily } from 'materialcolorize'; +import { SlideDown } from 'react-slidedown'; +import 'react-slidedown/lib/slidedown.css'; import PatternTable from './PatternTable'; import Snackbar, { SnackbarVariant } from './Snackbar'; @@ -463,19 +465,21 @@ class Settings extends React.Component<SettingsProps> { <STableCell className={classes.tableContent} style={{paddingRight: 0}}> {(this.state.isLoggedIn && <div className={classNames(classes.calendarList, classes.list)}> - <List disablePadding> + <SlideDown className={'my-dropdown-slidedown'}> + <List disablePadding> {Object.keys(this.state.calendars).sort().map(id => - <CompactListItem - key={id} - onClick={() => this.toggleCalendar(id)} - disableGutters - dense button > - <Checkbox - checked={this.state.calendars[id].enabled} - disableRipple /> - <ListItemText primary={this.state.calendars[id].name} /> - </CompactListItem>)} - </List></div>) || 'Please Login.'} + <CompactListItem + key={id} + onClick={() => this.toggleCalendar(id)} + disableGutters + dense button > + <Checkbox + checked={this.state.calendars[id].enabled} + disableRipple /> + <ListItemText primary={this.state.calendars[id].name} /> + </CompactListItem>)} + </List> + </SlideDown></div>) || 'Please Login.'} </STableCell> </TableRow> <TableRow> |