DongyoungKwon

Add warning to inform working only in Chrome

1 import React, { Component, Fragment } from 'react'; 1 import React, { Component, Fragment } from 'react';
2 import { post } from 'axios'; 2 import { post } from 'axios';
3 import { withStyles, Typography, Paper, Button, TextField } from '@material-ui/core'; 3 import { withStyles, Typography, Paper, Button, TextField } from '@material-ui/core';
4 +import Alert from '@material-ui/lab/Alert';
4 5
5 const styles = theme => ({ 6 const styles = theme => ({
6 root: { 7 root: {
...@@ -15,9 +16,10 @@ const styles = theme => ({ ...@@ -15,9 +16,10 @@ const styles = theme => ({
15 textAlign: 'center', 16 textAlign: 'center',
16 display: 'none', 17 display: 'none',
17 fontSize: '2.0rem', 18 fontSize: '2.0rem',
19 + fontColor: 'blue',
18 [theme.breakpoints.up('sm')]: { 20 [theme.breakpoints.up('sm')]: {
19 display: 'block', 21 display: 'block',
20 - } 22 + },
21 }, 23 },
22 paper: { 24 paper: {
23 marginTop: theme.spacing.unit * 5, 25 marginTop: theme.spacing.unit * 5,
...@@ -29,6 +31,11 @@ const styles = theme => ({ ...@@ -29,6 +31,11 @@ const styles = theme => ({
29 marginLeft: theme.spacing.unit * 20, 31 marginLeft: theme.spacing.unit * 20,
30 fontSize: '1rem', 32 fontSize: '1rem',
31 }, 33 },
34 + paperAlert: {
35 + marginTop: theme.spacing.unit * 5,
36 + marginLeft: theme.spacing.unit * 53,
37 + marginRight: theme.spacing.unit * 53
38 + }
32 }); 39 });
33 40
34 class MainPage extends Component { 41 class MainPage extends Component {
...@@ -94,6 +101,9 @@ class MainPage extends Component { ...@@ -94,6 +101,9 @@ class MainPage extends Component {
94 <TextField id="outlined-textarea" label="Scriptλ₯Ό μž…λ ₯ν•΄μ£Όμ„Έμš”." fullWidth="true" rows={20} placeholder="Script" multiline variant="outlined" onChange={this.getScript} /> 101 <TextField id="outlined-textarea" label="Scriptλ₯Ό μž…λ ₯ν•΄μ£Όμ„Έμš”." fullWidth="true" rows={20} placeholder="Script" multiline variant="outlined" onChange={this.getScript} />
95 </Paper> 102 </Paper>
96 <Button className={classes.button} variant="contained" color="primary" size="medium" onClick={this.handleScriptSubmit}>μ‹œμž‘ν•©λ‹ˆλ‹€.</Button> 103 <Button className={classes.button} variant="contained" color="primary" size="medium" onClick={this.handleScriptSubmit}>μ‹œμž‘ν•©λ‹ˆλ‹€.</Button>
104 + <Paper className={classes.paperAlert}>
105 + <Alert severity="error">이 μ‚¬μ΄νŠΈλŠ” Google Chromeμ—μ„œ λ™μž‘ν•©λ‹ˆλ‹€. </Alert>
106 + </Paper>
97 </Fragment> 107 </Fragment>
98 ); 108 );
99 } 109 }
......
...@@ -16,6 +16,7 @@ ...@@ -16,6 +16,7 @@
16 "author": "Dongyoung Kwon <ehddud2468@khu.ac.kr>", 16 "author": "Dongyoung Kwon <ehddud2468@khu.ac.kr>",
17 "license": "MIT", 17 "license": "MIT",
18 "dependencies": { 18 "dependencies": {
19 + "@material-ui/lab": "^4.0.0-alpha.57",
19 "body-parser": "^1.19.0", 20 "body-parser": "^1.19.0",
20 "express": "^4.17.1" 21 "express": "^4.17.1"
21 }, 22 },
......
This diff is collapsed. Click to expand it.