Skip to content

Commit b4950d7

Browse files
author
rodriguez-facundo
committed
#147 Stying
1 parent c46fbf5 commit b4950d7

12 files changed

Lines changed: 180 additions & 127 deletions

File tree

‎utilities/install.py‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -71,7 +71,7 @@ def main(argv):
7171
clone_repo(project='openworm',
7272
repo_name='geppetto-client',
7373
folder='geppetto-client',
74-
default_branch='feature/178',
74+
default_branch='development',
7575
cwdp='webapp/',
7676
recursive=False,
7777
)

‎webapp/components/NetPyNE.js‎

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,12 @@ const styles = ({ zIndex, palette, spacing }) => ({
1717
flexDirection: "column"
1818
},
1919
topbar: { position: "relative", zIndex: zIndex.drawer + 1 },
20-
content: { flexGrow:1, display: 'flex', flexDirection: 'row', position: 'relative' }
20+
content: {
21+
flexGrow:1,
22+
display: 'flex',
23+
flexDirection: 'row',
24+
position: 'relative'
25+
}
2126
});
2227

2328
import { EDIT_WIDGETS, PYTHON_CONSOLE_WIDGET, WidgetStatus } from '../constants'

‎webapp/components/definition/populations/Dimensions.js‎

Lines changed: 17 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -11,10 +11,7 @@ import {
1111
} from 'netpyne/components';
1212

1313
const styles = ({ spacing }) => ({
14-
selectField: {
15-
marginTop: spacing(3),
16-
width: '100%'
17-
},
14+
selectField: { width: '100%' },
1815
field:{
1916
width: '95%!important',
2017
marginLeft: spacing(3)
@@ -103,7 +100,7 @@ class DimensionsComponent extends Component {
103100
<div>
104101
<NetPyNEField id="netParams.popParams.numCells" className={classes.selectField}>
105102
<Select
106-
id={"popParamsDimensionsSelect"}
103+
variant="filled"
107104
value={this.state.dimension}
108105
onChange={event => this.setState({ dimension: event.target.value })}
109106
>
@@ -121,20 +118,21 @@ class DimensionsComponent extends Component {
121118
</NetPyNEField>
122119
{
123120
this.state.dimension != undefined && this.state.dimension != ""
124-
? <NetPyNEField id={"netParams.popParams." + this.state.dimension} className={classes.fields}>
125-
<NetPyNETextField
126-
id={"popParamsDimensions"}
127-
variant="filled"
128-
handleChange={this.handleDimValueChange}
129-
model={"netParams.popParams['" + this.state.modelName + "']['" + this.state.dimension + "']"}
130-
modelName={this.state.modelName}
131-
dimensionType={this.state.dimension}
132-
callback={(newValue, oldValue) => {
133-
this.props.updateCards()
134-
}}
135-
/>
136-
</NetPyNEField>
137-
: null
121+
&& (
122+
<NetPyNEField id={"netParams.popParams." + this.state.dimension} className={classes.fields}>
123+
<NetPyNETextField
124+
id={"popParamsDimensions"}
125+
variant="filled"
126+
handleChange={this.handleDimValueChange}
127+
model={"netParams.popParams['" + this.state.modelName + "']['" + this.state.dimension + "']"}
128+
modelName={this.state.modelName}
129+
dimensionType={this.state.dimension}
130+
callback={(newValue, oldValue) => {
131+
this.props.updateCards()
132+
}}
133+
/>
134+
</NetPyNEField>
135+
)
138136
}
139137
</div>
140138
)

‎webapp/components/general/Checkbox.js‎

Lines changed: 18 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,22 +1,32 @@
11
import React, { Component } from 'react'
2+
import Box from '@material-ui/core/Box'
23
import FormGroup from '@material-ui/core/FormGroup';
3-
import FormControlLabel from '@material-ui/core/FormControlLabel';
44
import MuiCheckbox from '@material-ui/core/Checkbox';
5+
import FormControlLabel from '@material-ui/core/FormControlLabel';
6+
7+
import { bgLight } from '../../theme'
58

69
export default class Checkbox extends Component {
710
render () {
811
return (
9-
<FormGroup>
12+
<FormGroup style={{
13+
backgroundColor: bgLight,
14+
borderTopLeftRadius: 4,
15+
borderTopRightRadius: 4,
16+
}}>
1017
<FormControlLabel
1118
disabled={!!this.props.disabled}
1219
label={this.props.label ? this.props.label : ''}
1320
control={
14-
<MuiCheckbox
15-
id={this.props.id}
16-
color="primary"
17-
checked={this.props.checked || false}
18-
onChange={this.props.onChange}
19-
/>
21+
<Box marginLeft={1}>
22+
<MuiCheckbox
23+
id={this.props.id}
24+
color="primary"
25+
checked={this.props.checked || false}
26+
onChange={this.props.onChange}
27+
/>
28+
</Box>
29+
2030
}
2131
/>
2232
</FormGroup>

‎webapp/components/general/List.js‎

Lines changed: 42 additions & 55 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,8 @@ import TextField from '@material-ui/core/TextField';
33
import IconButton from '@material-ui/core/IconButton';
44
import Icon from '@material-ui/core/Icon';
55
import Tooltip from './Tooltip'
6+
import Chip from '@material-ui/core/Chip'
7+
import Grid from '@material-ui/core/Grid'
68
/**
79
* Generic List/Dict Component
810
*/
@@ -31,6 +33,9 @@ export default class ListComponent extends Component {
3133
valid = false;
3234
}
3335
});
36+
if (value.endsWith(',')) {
37+
valid = false;
38+
}
3439
break;
3540
case 'dict':
3641
var valid = (value.match(/:/g) || []).length == 1 && !value.startsWith(':') && !value.endsWith(':');
@@ -208,66 +213,48 @@ export default class ListComponent extends Component {
208213
var value = this.state.children[key];
209214
}
210215
return (
211-
<div
212-
key={key}
213-
style={this.props.realType != 'dict(dict())' ? { marginRight: 30, float: 'left' } : { marginRight: 30 }}
214-
>
215-
<TextField
216-
value={value}
217-
id={this.props.id + index}
218-
disabled
219-
/>
220-
<IconButton
221-
id={this.props.id + index + "RemoveButton"}
222-
className={'listButtonSmall'}
223-
onClick={() => this.removeChild(key)}
224-
tooltip-data='Remove item from the list'
225-
>
226-
<Icon className={'fa fa-minus-circle listIcon'} />
227-
</IconButton>
228-
</div>
216+
<Grid item key={key}>
217+
<Chip key={key}label={value} onDelete={() => this.removeChild(key)} color="primary" />
218+
</Grid>
229219
)
220+
230221
});
231222

232223
return (
233-
<div>
234-
<div style={{ display: 'flex', alignItems: 'baseline' }}>
235-
<TextField
236-
id={this.props.id}
237-
label={this.props.label ? 'Add new ' + this.props.label : 'Add new item'}
238-
onChange={this.handleNewItemChange}
239-
onKeyPress={e => e.key === 'Enter' ? this.addChild() : null }
240-
value={this.state.newItemValue}
241-
style={{ width: '100%' }}
242-
helperText={this.state.newItemErrorText}
243-
/>
244-
{!this.state.newItemErrorText
245-
&& (
246-
<span>
247-
<Tooltip title="Add item to the list" placement="top">
248-
<IconButton
249-
id={this.props.id + "AddButton"}
250-
className={'listButtonLarge'}
251-
onClick={this.addChild}
252-
>
253-
<Icon className={'fa fa-plus-circle listIcon'} />
254-
</IconButton>
255-
</Tooltip>
256-
257-
</span>
258-
)
259-
}
260-
</div>
261-
224+
<Grid container spacing={1}>
225+
<Grid container item xs={12}>
226+
<Grid item xs={11}>
227+
<TextField
228+
variant="filled"
229+
id={this.props.id}
230+
label={this.props.label ? 'Add new ' + this.props.label : 'Add new item'}
231+
onChange={this.handleNewItemChange}
232+
onKeyPress={e => e.key === 'Enter' ? this.addChild() : null }
233+
value={this.state.newItemValue}
234+
style={{ width: '100%' }}
235+
helperText={this.state.newItemErrorText}
236+
/>
237+
</Grid>
262238

263-
{childrenWithExtraProp.length > 0 && (
264-
<div
265-
style={{ marginTop: '15px', marginLeft: '50px', paddingRight: '15px', padding: '0px 5px', float: 'left' }}
266-
>
267-
{childrenWithExtraProp}
268-
</div>
269-
)}
270-
</div>
239+
<Grid item xs={1}>
240+
<Tooltip title="Add item to the list" placement="top">
241+
<IconButton
242+
onClick={this.addChild}
243+
color="primary"
244+
>
245+
<Icon className="fa fa-plus-circle"/>
246+
</IconButton>
247+
</Tooltip>
248+
</Grid>
249+
250+
</Grid>
251+
252+
<Grid container item xs={12} spacing={1}>
253+
{childrenWithExtraProp}
254+
255+
</Grid>
256+
257+
</Grid>
271258
)
272259
}
273260
}

‎webapp/components/general/Select.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ export default class Select extends Component {
1414
value = ''
1515
}
1616
return (
17-
<FormControl >
17+
<FormControl variant="filled">
1818
<InputLabel>{this.props.label}</InputLabel>
1919
<MuiSelect
2020
id={this.props.id}

‎webapp/components/settings/Drawer.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,7 @@ import DrawerIcon from '../general/NetPyNEIcons';
2121
import useStyles from './useStyles';
2222
import Tooltip from '../general/Tooltip'
2323

24-
const drawerOpenWidth = 200;
24+
const drawerOpenWidth = 160;
2525
const drawerCloseWidth = 44;
2626

2727

‎webapp/components/topbar/Topbar.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import Snackbar from '@material-ui/core/Snackbar';
33
import Menu from '@geppettoengine/geppetto-client/js/components/interface/menu/Menu';
44

55
import toolbarConfig from './configuration'
6-
import { bgDark } from '../../theme'
6+
import { bgRegular, bgLight, font } from '../../theme'
77

88
import LoadFileDialog from './dialogs/LoadFile';
99
import SaveFileDialog from './dialogs/SaveFile';
@@ -18,7 +18,7 @@ import { SwitchPageButton } from 'netpyne/components'
1818

1919
const styles = () => ({
2020
topbar: {
21-
backgroundColor: bgDark,
21+
backgroundColor: bgRegular,
2222
display: 'flex',
2323
flexDirection: 'row',
2424
justifyContent: 'space-between'

0 commit comments

Comments
 (0)