Skip to content
This repository was archived by the owner on Apr 29, 2022. It is now read-only.

Commit d88c6e7

Browse files
quanglam2807quanglam2807
authored
Upgrade to material-ui@1.0.0-beta.36 (#20)
1 parent 590a509 commit d88c6e7

16 files changed

+462
-239
lines changed

‎package.json

+7-7
Original file line numberDiff line numberDiff line change
@@ -32,22 +32,22 @@
3232
"babel-preset-env": "1.6.1",
3333
"classnames": "2.2.5",
3434
"concurrently": "3.5.1",
35-
"cross-env": "5.1.3",
35+
"cross-env": "5.1.4",
3636
"del": "3.0.0",
37-
"electron": "1.8.2",
38-
"electron-builder": "20.2.0",
39-
"eslint": "4.18.1",
37+
"electron": "1.8.3",
38+
"electron-builder": "20.4.1",
39+
"eslint": "4.18.2",
4040
"eslint-config-airbnb": "16.1.0",
4141
"eslint-plugin-import": "2.9.0",
4242
"eslint-plugin-jsx-a11y": "6.0.3",
4343
"eslint-plugin-react": "7.7.0",
4444
"glob": "7.1.2",
4545
"history": "4.7.2",
46-
"material-ui": "1.0.0-beta.18",
47-
"material-ui-icons": "1.0.0-beta.35",
46+
"material-ui": "1.0.0-beta.36",
47+
"material-ui-icons": "1.0.0-beta.36",
4848
"mousetrap": "1.6.1",
4949
"pouchdb-browser": "6.4.3",
50-
"prop-types": "15.6.0",
50+
"prop-types": "15.6.1",
5151
"react": "16.2.0",
5252
"react-dom": "16.2.0",
5353
"react-redux": "5.0.7",

‎src/components/app.js

+14-14
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ import { replace, goBack } from 'react-router-redux';
55
import { CircularProgress } from 'material-ui/Progress';
66
import ActionHome from 'material-ui-icons/Home';
77
import ActionSettings from 'material-ui-icons/Settings';
8-
import BottomNavigation, { BottomNavigationButton } from 'material-ui/BottomNavigation';
8+
import BottomNavigation, { BottomNavigationAction } from 'material-ui/BottomNavigation';
99
import Button from 'material-ui/Button';
1010
import Paper from 'material-ui/Paper';
1111
import Snackbar from 'material-ui/Snackbar';
@@ -28,7 +28,7 @@ const styles = theme => ({
2828
height: '100vh',
2929
width: '100vw',
3030
overflow: 'hidden',
31-
backgroundColor: theme.palette.background.contentFrame,
31+
backgroundColor: theme.palette.background.default,
3232
position: 'relative',
3333
display: 'flex',
3434
flexDirection: 'column',
@@ -48,7 +48,7 @@ const styles = theme => ({
4848
fakeTitleBar: {
4949
flexBasis: 22,
5050
height: 22,
51-
backgroundColor: theme.palette.primary[700],
51+
backgroundColor: theme.palette.primary.dark,
5252
color: '#fff',
5353
textAlign: 'center',
5454
fontSize: 13,
@@ -106,7 +106,7 @@ class App extends React.Component {
106106
}
107107

108108
setAppTitleBar(primaryColorId) {
109-
const color = colorPairs[primaryColorId][700];
109+
const color = colorPairs[primaryColorId].dark;
110110

111111
if (getPlatform() === 'windows') {
112112
/* global Windows */
@@ -149,7 +149,7 @@ class App extends React.Component {
149149
children,
150150
classes,
151151
fullPageLoading,
152-
onBottomNavigationButtonClick,
152+
onBottomNavigationActionClick,
153153
onRequestCloseSnackbar,
154154
shouldShowBottomNav,
155155
snackbarMessage,
@@ -177,7 +177,7 @@ class App extends React.Component {
177177
autoHideDuration={4000}
178178
onRequestClose={onRequestCloseSnackbar}
179179
action={(
180-
<Button color="accent" dense onClick={onRequestCloseSnackbar}>
180+
<Button color="secondary" size="small" onClick={onRequestCloseSnackbar}>
181181
{strings.close}
182182
</Button>
183183
)}
@@ -186,20 +186,20 @@ class App extends React.Component {
186186
{bottomNavigationSelectedIndex > -1 && shouldShowBottomNav && (
187187
<Paper elevation={2} style={{ zIndex: 1000 }}>
188188
<BottomNavigation value={bottomNavigationSelectedIndex} showLabels>
189-
<BottomNavigationButton
189+
<BottomNavigationAction
190190
label={strings.home}
191191
icon={<ActionHome className={classes.icon} />}
192-
onClick={() => onBottomNavigationButtonClick('/')}
192+
onClick={() => onBottomNavigationActionClick('/')}
193193
/>
194-
<BottomNavigationButton
194+
<BottomNavigationAction
195195
label={strings.phrasebook}
196196
icon={<ToggleStar className={classes.icon} />}
197-
onClick={() => onBottomNavigationButtonClick('/phrasebook')}
197+
onClick={() => onBottomNavigationActionClick('/phrasebook')}
198198
/>
199-
<BottomNavigationButton
199+
<BottomNavigationAction
200200
label={strings.settings}
201201
icon={<ActionSettings className={classes.icon} />}
202-
onClick={() => onBottomNavigationButtonClick('/settings')}
202+
onClick={() => onBottomNavigationActionClick('/settings')}
203203
/>
204204
</BottomNavigation>
205205
</Paper>
@@ -216,7 +216,7 @@ App.propTypes = {
216216
classes: PropTypes.object.isRequired,
217217
fullPageLoading: PropTypes.bool,
218218
onBackClick: PropTypes.func.isRequired,
219-
onBottomNavigationButtonClick: PropTypes.func.isRequired,
219+
onBottomNavigationActionClick: PropTypes.func.isRequired,
220220
onRequestCloseSnackbar: PropTypes.func.isRequired,
221221
onResize: PropTypes.func.isRequired,
222222
primaryColorId: PropTypes.string,
@@ -263,7 +263,7 @@ const mapDispatchToProps = dispatch => ({
263263
dispatch(screenResize(window.innerWidth));
264264
dispatch(updateImeMode(null));
265265
},
266-
onBottomNavigationButtonClick: pathname => dispatch(replace(pathname)),
266+
onBottomNavigationActionClick: pathname => dispatch(replace(pathname)),
267267
onBackClick: () => dispatch(goBack()),
268268
onRequestCloseSnackbar: () => dispatch(closeSnackbar()),
269269
});

‎src/components/pages/bigger-text.js

+6-6
Original file line numberDiff line numberDiff line change
@@ -55,16 +55,16 @@ const BiggerText = (props) => {
5555
return (
5656
<div className={classes.container}>
5757
<Button
58-
fab
59-
dense
58+
variant="fab"
59+
size="small"
6060
className={classes.closeButton}
6161
onClick={onCloseClick}
6262
>
6363
<CloseIcon />
6464
</Button>
6565
<Button
66-
fab
67-
dense
66+
variant="fab"
67+
size="small"
6868
className={classes.minusButton}
6969
onClick={() => {
7070
if (biggerTextFontSize < 10) return;
@@ -74,8 +74,8 @@ const BiggerText = (props) => {
7474
<ZoomOutIcon />
7575
</Button>
7676
<Button
77-
fab
78-
dense
77+
variant="fab"
78+
size="small"
7979
className={classes.plusButton}
8080
onClick={() => onUpdateBiggerTextFontSize(biggerTextFontSize + 5)}
8181
>

‎src/components/pages/home/dictionary.js

+14-14
Original file line numberDiff line numberDiff line change
@@ -44,17 +44,17 @@ const Dictionary = ({
4444
<div>
4545
{output.inputDict[1] && (
4646
<div key="definitions">
47-
<Typography type="title" align="left" className={classes.title}>
47+
<Typography variant="title" align="left" className={classes.title}>
4848
{strings.definitions}
4949
</Typography>
5050
{output.inputDict[1].map(x => (
5151
<div key={`definition_section_${x[0]}`}>
52-
<Typography type="subheading" align="left" className={classes.subheading}>
52+
<Typography variant="subheading" align="left" className={classes.subheading}>
5353
{strings[x[0]]}
5454
</Typography>
5555
{x[1].map((y, v) => (
5656
<div key={`definition_${y[0]}`}>
57-
<Typography type="body1" align="left">
57+
<Typography variant="body1" align="left">
5858
<span>{v + 1}. </span>
5959
<a
6060
role="button"
@@ -86,19 +86,19 @@ const Dictionary = ({
8686
)}
8787
{output.inputDict[0] && (
8888
<div key="synonyms">
89-
<Typography type="title" align="left" className={classes.title}>
89+
<Typography variant="title" align="left" className={classes.title}>
9090
{strings.synonyms}
9191
</Typography>
9292
{output.inputDict[0].map(x => (
9393
<div key={`synonyms_section_${x[0]}`}>
94-
<Typography type="subheading" align="left" className={classes.subheading}>
94+
<Typography variant="subheading" align="left" className={classes.subheading}>
9595
{strings[x[0]]}
9696
</Typography>
9797
<ul>
9898
{x[1].map(wl => (
9999
<li key={`synonyms_line_${wl.join('-')}`}>
100100
{wl[0].map((word, k) => (
101-
<Typography type="body1" align="left" key={`synonyms_word_${word}`} className={classes.inline}>
101+
<Typography variant="body1" align="left" key={`synonyms_word_${word}`} className={classes.inline}>
102102
{(k > 0) && (<span>, </span>)}
103103
<a
104104
role="button"
@@ -119,15 +119,15 @@ const Dictionary = ({
119119
)}
120120
{output.inputDict[2] && (
121121
<div key="examples">
122-
<Typography type="title" align="left" className={classes.title}>
122+
<Typography variant="title" align="left" className={classes.title}>
123123
{strings.examples}
124124
</Typography>
125125
<div>
126126
{output.inputDict[2][0].map((x, i) => {
127127
const text = x[0].replace(/(<([^>]+)>)/ig, '');
128128
return (
129129
<div key={`example_${text}`}>
130-
<Typography type="body1" align="left">
130+
<Typography variant="body1" align="left">
131131
<span>{i + 1}. </span>
132132
<a
133133
role="button"
@@ -146,13 +146,13 @@ const Dictionary = ({
146146
)}
147147
{output.inputDict[3] && (
148148
<div key="seeAlso">
149-
<Typography type="title" align="left" className={classes.title}>
149+
<Typography variant="title" align="left" className={classes.title}>
150150
{strings.seeAlso}
151151
</Typography>
152152
<div>
153153
{output.inputDict[3].map(x => (
154154
<div key={x.join('')}>
155-
<Typography type="body1" align="left">
155+
<Typography variant="body1" align="left">
156156
{x.map((y, j) => {
157157
const text = y.replace(/(<([^>]+)>)/ig, '');
158158
return (
@@ -180,17 +180,17 @@ const Dictionary = ({
180180
{output.outputDict && (
181181
<div>
182182
<Divider className={classes.divider} />
183-
<Typography type="title" align="left" className={classes.title}>
183+
<Typography variant="title" align="left" className={classes.title}>
184184
{strings.translations}
185185
</Typography>
186186
{output.outputDict.map(x => (
187187
<div key={x[0]}>
188-
<Typography type="subheading" align="left" className={classes.subheading}>
188+
<Typography variant="subheading" align="left" className={classes.subheading}>
189189
{strings[x[0]]}
190190
</Typography>
191191
{x[2].map((y, j) => (
192192
<div key={y[0]}>
193-
<Typography type="body1" align="left">
193+
<Typography variant="body1" align="left">
194194
<span>{j + 1}. </span>
195195
{y[4] && (<span>{y[4]} </span>)}
196196
<a
@@ -202,7 +202,7 @@ const Dictionary = ({
202202
</a>
203203
</Typography>
204204
{y[1] && (
205-
<Typography type="body2" align="left" className={classes.inline}>
205+
<Typography variant="body2" align="left" className={classes.inline}>
206206
{y[1].map((meaning, k) => (
207207
<span key={meaning}>
208208
{(k > 0) && (<span>, </span>)}

‎src/components/pages/home/handwriting.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -302,7 +302,7 @@ class Handwriting extends React.Component {
302302
onTouchMove={onMouseMove}
303303
/>
304304
<div className={classes.wrapper}>
305-
<Button color="accent" onClick={onDeleteButtonClick}>
305+
<Button color="secondary" onClick={onDeleteButtonClick}>
306306
{strings.delete}
307307
</Button>
308308
<Button onClick={onSpaceBarButtonClick}>

‎src/components/pages/home/history.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -105,7 +105,7 @@ class History extends React.Component {
105105
), <Divider inset={false} key="divider" />])}
106106
</List>
107107
{historyLoading && (
108-
<LinearProgress mode="indeterminate" className={classes.progress} />
108+
<LinearProgress variant="indeterminate" className={classes.progress} />
109109
)}
110110
</div>
111111
);

‎src/components/pages/home/index.js

+16-14
Original file line numberDiff line numberDiff line change
@@ -432,7 +432,7 @@ class Home extends React.Component {
432432
>
433433
{output.inputRoman && (
434434
<Typography
435-
type="body1"
435+
variant="body1"
436436
className={classNames('text-selectable', classes.inputRoman)}
437437
>
438438
{output.inputRoman}
@@ -441,7 +441,7 @@ class Home extends React.Component {
441441

442442
{output.suggestedInputLang && (
443443
<Typography
444-
type="body1"
444+
variant="body1"
445445
align="left"
446446
className={classes.suggestion}
447447
>
@@ -460,7 +460,7 @@ class Home extends React.Component {
460460

461461
{output.suggestedInputText && (
462462
<Typography
463-
type="body1"
463+
variant="body1"
464464
align="left"
465465
className={classes.suggestion}
466466
>
@@ -480,15 +480,15 @@ class Home extends React.Component {
480480
<Card className={classes.outputCard}>
481481
<CardContent className="text-selectable">
482482
<Typography
483-
type="headline"
483+
variant="headline"
484484
lang={toCountryRemovedLanguage(output.outputLang)}
485485
className="text-selectable"
486486
>
487487
{output.outputText}
488488
</Typography>
489489

490490
{output.outputRoman && (
491-
<Typography type="body1" className={classNames('text-selectable', classes.pos)}>
491+
<Typography variant="body1" className={classNames('text-selectable', classes.pos)}>
492492
{output.outputRoman}
493493
</Typography>
494494
)}
@@ -531,7 +531,7 @@ class Home extends React.Component {
531531
</Card>
532532
{hasDict && <Dictionary output={output} />}
533533
<Typography
534-
type="body2"
534+
variant="body2"
535535
align="right"
536536
className={classes.googleCopyright}
537537
>
@@ -662,13 +662,15 @@ class Home extends React.Component {
662662
{strings[inputLang]}
663663
</Button>
664664
<Tooltip title={strings.swap} placement="bottom">
665-
<IconButton
666-
color={isOutput(inputLang) ? 'contrast' : 'default'}
667-
disabled={!isOutput(inputLang)}
668-
onClick={onSwapButtonClick}
669-
>
670-
<ActionSwapHoriz />
671-
</IconButton>
665+
<div>
666+
<IconButton
667+
color={isOutput(inputLang) ? 'contrast' : 'default'}
668+
disabled={!isOutput(inputLang)}
669+
onClick={onSwapButtonClick}
670+
>
671+
<ActionSwapHoriz />
672+
</IconButton>
673+
</div>
672674
</Tooltip>
673675
<Button
674676
color="inherit"
@@ -739,7 +741,7 @@ class Home extends React.Component {
739741
</div>
740742
<div className={classes.controllerContainerRight}>
741743
<Tooltip title={strings.andSaveToHistory} placement={fullscreenInputBox ? 'top' : 'bottom'}>
742-
<Button raised color="primary" onClick={onTranslateButtonClick}>
744+
<Button variant="raised" color="primary" onClick={onTranslateButtonClick}>
743745
{strings.translate}
744746
</Button>
745747
</Tooltip>

‎src/components/pages/home/speech.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -99,7 +99,7 @@ class Speech extends React.Component {
9999
(
100100
<div>
101101
<Button
102-
fab
102+
variant="fab"
103103
color="primary"
104104
onClick={() => onControlButtonClick(speechStatus)}
105105
>

‎src/components/pages/language-list.js

+2-2
Original file line numberDiff line numberDiff line change
@@ -121,10 +121,10 @@ class LanguageList extends React.Component {
121121
<div className={classes.container}>
122122
<AppBar position="static">
123123
<Toolbar>
124-
<IconButton color="contrast" onClick={onCloseClick}>
124+
<IconButton color="inherit" onClick={onCloseClick}>
125125
<CloseIcon />
126126
</IconButton>
127-
<Typography type="title" color="inherit">
127+
<Typography variant="title" color="inherit">
128128
{type === 'inputLang' ? strings.chooseAnInputLanguage : strings.chooseAnOutputLanguage}
129129
</Typography>
130130
</Toolbar>

0 commit comments

Comments
 (0)