2020-1-CloudComputing-E / E_Team_KhuBox

Go to a project
Toggle navigation Toggle navigation pinning
이우진
816d88af 1 parent f37a0b89

Modify account information

Inline Side-by-side
Showing 4 changed files with 36 additions and 18 deletions
...@@ -40,11 +40,9 @@ const AccountProfile = props => { ...@@ -40,11 +40,9 @@ const AccountProfile = props => {
40 const classes = useStyles(); 40 const classes = useStyles();
41 41
42 const user = { 42 const user = {
43 - name: 'Shen Zhi', 43 + name: '엄준식',
44 - city: 'Los Angeles', 44 + membership: 'Basic',
45 - country: 'USA', 45 + avatar: '/images/avatars/avatar_1.png'
46 - timezone: 'GTM-7',
47 - avatar: '/images/avatars/avatar_11.png'
48 }; 46 };
49 47
50 return ( 48 return (
...@@ -59,21 +57,13 @@ const AccountProfile = props => { ...@@ -59,21 +57,13 @@ const AccountProfile = props => {
59 gutterBottom 57 gutterBottom
60 variant="h2" 58 variant="h2"
61 > 59 >
62 - John Doe 60 + {user.name}
63 </Typography> 61 </Typography>
64 <Typography 62 <Typography
65 - className={classes.locationText}
66 color="textSecondary" 63 color="textSecondary"
67 variant="body1" 64 variant="body1"
68 > 65 >
69 - {user.city}, {user.country} 66 + {user.membership + " Plan"}
70 - </Typography>
71 - <Typography
72 - className={classes.dateText}
73 - color="textSecondary"
74 - variant="body1"
75 - >
76 - {moment().format('hh:mm A')} ({user.timezone})
77 </Typography> 67 </Typography>
78 </div> 68 </div>
79 <Avatar 69 <Avatar
...@@ -82,7 +72,7 @@ const AccountProfile = props => { ...@@ -82,7 +72,7 @@ const AccountProfile = props => {
82 /> 72 />
83 </div> 73 </div>
84 <div className={classes.progress}> 74 <div className={classes.progress}>
85 - <Typography variant="body1">Profile Completeness: 70%</Typography> 75 + <Typography variant="body1">저장용량: 70% (7GB/10GB)</Typography>
86 <LinearProgress 76 <LinearProgress
87 value={70} 77 value={70}
88 variant="determinate" 78 variant="determinate"
......
...@@ -17,6 +17,9 @@ const useStyles = makeStyles(theme => ({ ...@@ -17,6 +17,9 @@ const useStyles = makeStyles(theme => ({
17 spacer: { 17 spacer: {
18 flexGrow: 1 18 flexGrow: 1
19 }, 19 },
20 + Button: {
21 + marginRight: theme.spacing(1)
22 + },
20 importButton: { 23 importButton: {
21 marginRight: theme.spacing(1) 24 marginRight: theme.spacing(1)
22 }, 25 },
...@@ -40,8 +43,8 @@ const DriveToolbar = props => { ...@@ -40,8 +43,8 @@ const DriveToolbar = props => {
40 > 43 >
41 <div className={classes.row}> 44 <div className={classes.row}>
42 <span className={classes.spacer} /> 45 <span className={classes.spacer} />
43 - <Button className={classes.importButton}>새 폴더</Button> 46 + <Button className={classes.Button}>새 폴더</Button>
44 - <Button className={classes.exportButton}>폴더 업로드</Button> 47 + <Button className={classes.Button}>폴더 업로드</Button>
45 <Button 48 <Button
46 color="primary" 49 color="primary"
47 variant="contained" 50 variant="contained"
...@@ -50,6 +53,16 @@ const DriveToolbar = props => { ...@@ -50,6 +53,16 @@ const DriveToolbar = props => {
50 </Button> 53 </Button>
51 </div> 54 </div>
52 <div className={classes.row}> 55 <div className={classes.row}>
56 + {/* 파일 클릭했을 때 표시 */}
57 + <span className={classes.spacer} />
58 + <Button className={classes.Button}>공유</Button>
59 + <Button className={classes.Button}>미리보기</Button>
60 + <Button className={classes.Button}>삭제</Button>
61 + <Button className={classes.Button}>이름 바꾸기</Button>
62 + <Button className={classes.Button}>이동</Button>
63 + <Button className={classes.Button}>다운로드</Button>
64 + </div>
65 + <div className={classes.row}>
53 <SearchInput 66 <SearchInput
54 className={classes.searchInput} 67 className={classes.searchInput}
55 placeholder="파일, 폴더 검색" 68 placeholder="파일, 폴더 검색"
......
...@@ -39,6 +39,15 @@ const DriveToolbar = props => { ...@@ -39,6 +39,15 @@ const DriveToolbar = props => {
39 className={clsx(classes.root, className)} 39 className={clsx(classes.root, className)}
40 > 40 >
41 <div className={classes.row}> 41 <div className={classes.row}>
42 + {/* 파일 클릭했을 때 표시 */}
43 + <span className={classes.spacer} />
44 + <Button className={classes.Button}>공유</Button>
45 + <Button className={classes.Button}>미리보기</Button>
46 + <Button className={classes.Button}>삭제</Button>
47 + <Button className={classes.Button}>이름 바꾸기</Button>
48 + <Button className={classes.Button}>다운로드</Button>
49 + </div>
50 + <div className={classes.row}>
42 <SearchInput 51 <SearchInput
43 className={classes.searchInput} 52 className={classes.searchInput}
44 placeholder="파일, 폴더 검색" 53 placeholder="파일, 폴더 검색"
......
...@@ -39,6 +39,12 @@ const DriveToolbar = props => { ...@@ -39,6 +39,12 @@ const DriveToolbar = props => {
39 className={clsx(classes.root, className)} 39 className={clsx(classes.root, className)}
40 > 40 >
41 <div className={classes.row}> 41 <div className={classes.row}>
42 + {/* 파일 클릭했을 때 표시 */}
43 + <span className={classes.spacer} />
44 + <Button className={classes.Button}>복원</Button>
45 + <Button className={classes.Button}>영구 삭제</Button>
46 + </div>
47 + <div className={classes.row}>
42 <SearchInput 48 <SearchInput
43 className={classes.searchInput} 49 className={classes.searchInput}
44 placeholder="파일, 폴더 검색" 50 placeholder="파일, 폴더 검색"
......