| 1 |
- {"ast":null,"code":"var _jsxFileName = \"/Users/holunyeung/Documents/GitHub/Photo_React/photo/src/testM.js\";\nimport React from 'react';\nimport { makeStyles, useTheme } from '@material-ui/core/styles';\nimport AppBar from '@material-ui/core/AppBar';\nimport Toolbar from '@material-ui/core/Toolbar';\nimport Typography from '@material-ui/core/Typography';\nimport Button from '@material-ui/core/Button';\nimport IconButton from '@material-ui/core/IconButton';\nimport MenuIcon from '@material-ui/icons/Menu';\nimport clsx from 'clsx';\nimport Drawer from '@material-ui/core/Drawer';\nimport List from '@material-ui/core/List';\nimport CssBaseline from '@material-ui/core/CssBaseline';\nimport Divider from '@material-ui/core/Divider';\nimport ChevronLeftIcon from '@material-ui/icons/ChevronLeft';\nimport ChevronRightIcon from '@material-ui/icons/ChevronRight';\nimport ListItem from '@material-ui/core/ListItem';\nimport ListItemIcon from '@material-ui/core/ListItemIcon';\nimport ListItemText from '@material-ui/core/ListItemText';\nimport InboxIcon from '@material-ui/icons/MoveToInbox';\nimport MailIcon from '@material-ui/icons/Mail';\nimport ImageList from './ImageList';\nimport PhotoIcon from '@material-ui/icons/Photo';\nimport ShareIcon from '@material-ui/icons/Share';\nimport PhotoAlbumIcon from '@material-ui/icons/PhotoAlbum';\nimport LibraryAddCheckIcon from '@material-ui/icons/LibraryAddCheck';\nimport Grid from '@material-ui/core/Grid';\nconst drawerWidth = 240;\nconst useStyles = makeStyles(theme => ({\n root: {\n flexGrow: 1\n },\n menuButton: {\n marginRight: theme.spacing(2)\n },\n title: {\n flexGrow: 1\n },\n toolbar: {\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'flex-end',\n padding: theme.spacing(0, 1),\n // necessary for content to be below app bar\n ...theme.mixins.toolbar\n },\n root: {\n display: 'flex'\n },\n appBar: {\n zIndex: theme.zIndex.drawer + 1,\n transition: theme.transitions.create(['width', 'margin'], {\n easing: theme.transitions.easing.sharp,\n duration: theme.transitions.duration.leavingScreen\n })\n },\n appBarShift: {\n marginLeft: drawerWidth,\n width: `calc(100% - ${drawerWidth}px)`,\n transition: theme.transitions.create(['width', 'margin'], {\n easing: theme.transitions.easing.sharp,\n duration: theme.transitions.duration.enteringScreen\n })\n },\n menuButton: {\n marginRight: 36\n },\n hide: {\n display: 'none'\n },\n drawer: {\n width: drawerWidth,\n flexShrink: 0,\n whiteSpace: 'nowrap'\n },\n drawerOpen: {\n width: drawerWidth,\n transition: theme.transitions.create('width', {\n easing: theme.transitions.easing.sharp,\n duration: theme.transitions.duration.enteringScreen\n })\n },\n drawerClose: {\n transition: theme.transitions.create('width', {\n easing: theme.transitions.easing.sharp,\n duration: theme.transitions.duration.leavingScreen\n }),\n overflowX: 'hidden',\n width: theme.spacing(7) + 1,\n [theme.breakpoints.up('sm')]: {\n width: theme.spacing(9) + 1\n }\n },\n toolbar: {\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'flex-end',\n padding: theme.spacing(0, 1),\n // necessary for content to be below app bar\n ...theme.mixins.toolbar\n },\n content: {\n flexGrow: 1,\n padding: theme.spacing(3)\n }\n}));\nexport default function ButtonAppBar() {\n const classes = useStyles();\n const [open, setOpen] = React.useState(false);\n const theme = useTheme();\n\n const handleDrawerOpen = () => {\n setOpen(true);\n };\n\n const handleDrawerClose = () => {\n setOpen(false);\n };\n\n return /*#__PURE__*/React.createElement(\"div\", {\n className: classes.root,\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 122,\n columnNumber: 14\n }\n }, /*#__PURE__*/React.createElement(AppBar, {\n position: \"static\",\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 124,\n columnNumber: 9\n }\n }, /*#__PURE__*/React.createElement(Toolbar, {\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 126,\n columnNumber: 9\n }\n }, /*#__PURE__*/React.createElement(IconButton, {\n color: \"inherit\",\n onClick: handleDrawerOpen,\n edge: \"start\",\n className: clsx(classes.menuButton, {\n [classes.hide]: open\n }),\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 128,\n columnNumber: 9\n }\n }, /*#__PURE__*/React.createElement(MenuIcon, {\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 137,\n columnNumber: 9\n }\n })), \" \", /*#__PURE__*/React.createElement(IconButton, {\n edge: \"start\",\n className: classes.menuButton,\n color: \"inherit\",\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 140,\n columnNumber: 23\n }\n }, /*#__PURE__*/React.createElement(MenuIcon, {\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 144,\n columnNumber: 9\n }\n })), \" \", /*#__PURE__*/React.createElement(Typography, {\n variant: \"h6\",\n className: classes.title,\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 147,\n columnNumber: 22\n }\n }, \"News \"), \" \", /*#__PURE__*/React.createElement(Button, {\n color: \"inherit\",\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 151,\n columnNumber: 22\n }\n }, \" Login \"), \" \"), \" \"), \" \", /*#__PURE__*/React.createElement(Drawer, {\n variant: \"permanent\",\n className: clsx(classes.drawer, {\n [classes.drawerOpen]: open,\n [classes.drawerClose]: !open\n }),\n classes: {\n paper: clsx({\n [classes.drawerOpen]: open,\n [classes.drawerClose]: !open\n })\n },\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 154,\n columnNumber: 24\n }\n }, /*#__PURE__*/React.createElement(\"div\", {\n className: classes.toolbar,\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 170,\n columnNumber: 9\n }\n }, /*#__PURE__*/React.createElement(IconButton, {\n onClick: handleDrawerClose,\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 172,\n columnNumber: 9\n }\n }, \" \", theme.direction === 'rtl' ? /*#__PURE__*/React.createElement(ChevronRightIcon, {\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 173,\n columnNumber: 84\n }\n }) : /*#__PURE__*/React.createElement(ChevronLeftIcon, {\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 173,\n columnNumber: 109\n }\n }), \" \"), \" \"), \" \", /*#__PURE__*/React.createElement(Divider, {\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 175,\n columnNumber: 15\n }\n }), /*#__PURE__*/React.createElement(List, {\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 177,\n columnNumber: 9\n }\n }, \" \", ['Inbox', 'Starred', 'Send email', 'Drafts'].map((text, index) => /*#__PURE__*/React.createElement(ListItem, {\n button: true,\n key: text,\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 179,\n columnNumber: 81\n }\n }, /*#__PURE__*/React.createElement(ListItemIcon, {\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 181,\n columnNumber: 17\n }\n }, \" \", index % 2 === 0 ? /*#__PURE__*/React.createElement(InboxIcon, {\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 182,\n columnNumber: 52\n }\n }) : /*#__PURE__*/React.createElement(MailIcon, {\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 182,\n columnNumber: 70\n }\n }), \" \"), \" \", /*#__PURE__*/React.createElement(ListItemText, {\n primary: text,\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 182,\n columnNumber: 104\n }\n }), \" \")), \" \"), \" \", /*#__PURE__*/React.createElement(Divider, {\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 188,\n columnNumber: 16\n }\n }), /*#__PURE__*/React.createElement(List, {\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 190,\n columnNumber: 9\n }\n }, \" \", ['All mail', 'Trash', 'Spam'].map((text, index) => /*#__PURE__*/React.createElement(ListItem, {\n button: true,\n key: text,\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 192,\n columnNumber: 66\n }\n }, /*#__PURE__*/React.createElement(ListItemIcon, {\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 194,\n columnNumber: 17\n }\n }, \" \", index % 2 === 0 ? /*#__PURE__*/React.createElement(InboxIcon, {\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 195,\n columnNumber: 52\n }\n }) : /*#__PURE__*/React.createElement(MailIcon, {\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 195,\n columnNumber: 70\n }\n }), \" \"), \" \", /*#__PURE__*/React.createElement(ListItemText, {\n primary: text,\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 195,\n columnNumber: 104\n }\n }), \" \")), \" \"), \" \"), \" \", /*#__PURE__*/React.createElement(\"main\", {\n className: classes.content,\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 202,\n columnNumber: 18\n }\n }, /*#__PURE__*/React.createElement(\"div\", {\n className: classes.toolbar,\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 204,\n columnNumber: 9\n }\n }), \" \", /*#__PURE__*/React.createElement(Typography, {\n paragraph: true,\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 206,\n columnNumber: 12\n }\n }, \"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.Rhoncus dolor purus non enim praesent elementum facilisis leo vel.Risus at ultrices mi tempus imperdiet.Semper risus in hendrerit gravida rutrum quisque non tellus.Convallis convallis tellus id interdum velit laoreet id donec ultrices.Odio morbi quis commodo odio aenean sed adipiscing.Amet nisl suscipit adipiscing bibendum est ultricies integer quis.Cursus euismod quis viverra nibh cras.Metus vulputate eu scelerisque felis imperdiet proin fermentum leo.Mauris commodo quis imperdiet massa tincidunt.Cras tincidunt lobortis feugiat vivamus at augue.At augue eget arcu dictum varius duis at consectetur lorem.Velit sed ullamcorper morbi tincidunt.Lorem donec massa sapien faucibus et molestie ac. \"), \" \", /*#__PURE__*/React.createElement(Typography, {\n paragraph: true,\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 210,\n columnNumber: 22\n }\n }, \"Consequat mauris nunc congue nisi vitae suscipit.Fringilla est ullamcorper eget nulla facilisi etiam dignissim diam.Pulvinar elementum integer enim neque volutpat ac tincidunt.Ornare suspendisse sed nisi lacus sed viverra tellus.Purus sit amet volutpat consequat mauris.Elementum eu facilisis sed odio morbi.Euismod lacinia at quis risus sed vulputate odio.Morbi tincidunt ornare massa eget egestas purus viverra accumsan in .In hendrerit gravida rutrum quisque non tellus orci ac.Pellentesque nec nam aliquam sem et tortor.Habitant morbi tristique senectus et.Adipiscing elit duis tristique sollicitudin nibh sit.Ornare aenean euismod elementum nisi quis eleifend.Commodo viverra maecenas accumsan lacus vel facilisis.Nulla posuere sollicitudin aliquam ultrices sagittis orci a. \"), \" \"), \" \");\n}","map":{"version":3,"sources":["/Users/holunyeung/Documents/GitHub/Photo_React/photo/src/testM.js"],"names":["React","makeStyles","useTheme","AppBar","Toolbar","Typography","Button","IconButton","MenuIcon","clsx","Drawer","List","CssBaseline","Divider","ChevronLeftIcon","ChevronRightIcon","ListItem","ListItemIcon","ListItemText","InboxIcon","MailIcon","ImageList","PhotoIcon","ShareIcon","PhotoAlbumIcon","LibraryAddCheckIcon","Grid","drawerWidth","useStyles","theme","root","flexGrow","menuButton","marginRight","spacing","title","toolbar","display","alignItems","justifyContent","padding","mixins","appBar","zIndex","drawer","transition","transitions","create","easing","sharp","duration","leavingScreen","appBarShift","marginLeft","width","enteringScreen","hide","flexShrink","whiteSpace","drawerOpen","drawerClose","overflowX","breakpoints","up","content","ButtonAppBar","classes","open","setOpen","useState","handleDrawerOpen","handleDrawerClose","paper","direction","map","text","index"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { makeStyles, useTheme } from '@material-ui/core/styles';\nimport AppBar from '@material-ui/core/AppBar';\nimport Toolbar from '@material-ui/core/Toolbar';\nimport Typography from '@material-ui/core/Typography';\nimport Button from '@material-ui/core/Button';\nimport IconButton from '@material-ui/core/IconButton';\nimport MenuIcon from '@material-ui/icons/Menu';\nimport clsx from 'clsx';\nimport Drawer from '@material-ui/core/Drawer';\nimport List from '@material-ui/core/List';\nimport CssBaseline from '@material-ui/core/CssBaseline';\nimport Divider from '@material-ui/core/Divider';\nimport ChevronLeftIcon from '@material-ui/icons/ChevronLeft';\nimport ChevronRightIcon from '@material-ui/icons/ChevronRight';\nimport ListItem from '@material-ui/core/ListItem';\nimport ListItemIcon from '@material-ui/core/ListItemIcon';\nimport ListItemText from '@material-ui/core/ListItemText';\nimport InboxIcon from '@material-ui/icons/MoveToInbox';\nimport MailIcon from '@material-ui/icons/Mail';\nimport ImageList from './ImageList';\nimport PhotoIcon from '@material-ui/icons/Photo';\nimport ShareIcon from '@material-ui/icons/Share';\nimport PhotoAlbumIcon from '@material-ui/icons/PhotoAlbum';\nimport LibraryAddCheckIcon from '@material-ui/icons/LibraryAddCheck';\nimport Grid from '@material-ui/core/Grid';\n\nconst drawerWidth = 240;\n\nconst useStyles = makeStyles((theme) => ({\n root: {\n flexGrow: 1,\n },\n menuButton: {\n marginRight: theme.spacing(2),\n },\n title: {\n flexGrow: 1,\n },\n toolbar: {\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'flex-end',\n padding: theme.spacing(0, 1),\n // necessary for content to be below app bar\n ...theme.mixins.toolbar,\n },\n root: {\n display: 'flex',\n },\n appBar: {\n zIndex: theme.zIndex.drawer + 1,\n transition: theme.transitions.create(['width', 'margin'], {\n easing: theme.transitions.easing.sharp,\n duration: theme.transitions.duration.leavingScreen,\n }),\n },\n appBarShift: {\n marginLeft: drawerWidth,\n width: `calc(100% - ${drawerWidth}px)`,\n transition: theme.transitions.create(['width', 'margin'], {\n easing: theme.transitions.easing.sharp,\n duration: theme.transitions.duration.enteringScreen,\n }),\n },\n menuButton: {\n marginRight: 36,\n },\n hide: {\n display: 'none',\n },\n drawer: {\n width: drawerWidth,\n flexShrink: 0,\n whiteSpace: 'nowrap',\n },\n drawerOpen: {\n width: drawerWidth,\n transition: theme.transitions.create('width', {\n easing: theme.transitions.easing.sharp,\n duration: theme.transitions.duration.enteringScreen,\n }),\n },\n drawerClose: {\n transition: theme.transitions.create('width', {\n easing: theme.transitions.easing.sharp,\n duration: theme.transitions.duration.leavingScreen,\n }),\n overflowX: 'hidden',\n width: theme.spacing(7) + 1,\n [theme.breakpoints.up('sm')]: {\n width: theme.spacing(9) + 1,\n },\n },\n toolbar: {\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'flex-end',\n padding: theme.spacing(0, 1),\n // necessary for content to be below app bar\n ...theme.mixins.toolbar,\n },\n content: {\n flexGrow: 1,\n padding: theme.spacing(3),\n },\n}));\n\nexport default function ButtonAppBar() {\n const classes = useStyles();\n const [open, setOpen] = React.useState(false);\n const theme = useTheme();\n\n const handleDrawerOpen = () => {\n setOpen(true);\n };\n\n const handleDrawerClose = () => {\n setOpen(false);\n };\n\n return ( <\n div className = { classes.root } >\n <\n AppBar position = \"static\" >\n <\n Toolbar >\n <\n IconButton color = \"inherit\"\n onClick = { handleDrawerOpen }\n edge = \"start\"\n className = {\n clsx(classes.menuButton, {\n [classes.hide]: open,\n })\n } >\n <\n MenuIcon / >\n <\n /IconButton> <\n IconButton edge = \"start\"\n className = { classes.menuButton }\n color = \"inherit\" >\n <\n MenuIcon / >\n <\n /IconButton> <\n Typography variant = \"h6\"\n className = { classes.title } >\n News <\n /Typography> <\n Button color = \"inherit\" > Login < /Button> < /\n Toolbar > <\n /AppBar> <Drawer\n variant = \"permanent\"\n className = {\n clsx(classes.drawer, {\n [classes.drawerOpen]: open,\n [classes.drawerClose]: !open,\n })\n }\n classes = {\n {\n paper: clsx({\n [classes.drawerOpen]: open,\n [classes.drawerClose]: !open,\n }),\n }\n } >\n <\n div className = { classes.toolbar } >\n <\n IconButton onClick = { handleDrawerClose } > { theme.direction === 'rtl' ? < ChevronRightIcon / > : < ChevronLeftIcon / > } <\n /IconButton> < /\n div > <\n Divider / >\n <\n List > {\n ['Inbox', 'Starred', 'Send email', 'Drafts'].map((text, index) => ( <\n ListItem button key = { text } >\n <\n ListItemIcon > { index % 2 === 0 ? < InboxIcon / > : < MailIcon / > } < /ListItemIcon> <\n ListItemText primary = { text }\n /> < /\n ListItem >\n ))\n } <\n /List> <\n Divider / >\n <\n List > {\n ['All mail', 'Trash', 'Spam'].map((text, index) => ( <\n ListItem button key = { text } >\n <\n ListItemIcon > { index % 2 === 0 ? < InboxIcon / > : < MailIcon / > } < /ListItemIcon> <\n ListItemText primary = { text }\n /> < /\n ListItem >\n ))\n } <\n /List> < /\n Drawer > <\n main className = { classes.content } >\n <\n div className = { classes.toolbar }\n /> <\n Typography paragraph >\n Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt\n ut labore et dolore magna aliqua.Rhoncus dolor purus non enim praesent elementum facilisis leo vel.Risus at ultrices mi tempus imperdiet.Semper risus in hendrerit gravida rutrum quisque non tellus.Convallis convallis tellus id interdum velit laoreet id donec ultrices.Odio morbi quis commodo odio aenean sed adipiscing.Amet nisl suscipit adipiscing bibendum est ultricies integer quis.Cursus euismod quis viverra nibh cras.Metus vulputate eu scelerisque felis imperdiet proin fermentum leo.Mauris commodo quis imperdiet massa tincidunt.Cras tincidunt lobortis feugiat vivamus at augue.At augue eget arcu dictum varius duis at consectetur lorem.Velit sed ullamcorper morbi tincidunt.Lorem donec massa sapien faucibus et molestie ac. <\n /Typography> <\n Typography paragraph >\n Consequat mauris nunc congue nisi vitae suscipit.Fringilla est ullamcorper eget nulla facilisi etiam dignissim diam.Pulvinar elementum integer enim neque volutpat ac tincidunt.Ornare suspendisse sed nisi lacus sed viverra tellus.Purus sit amet volutpat consequat mauris.Elementum eu facilisis sed odio morbi.Euismod lacinia at quis risus sed vulputate odio.Morbi tincidunt ornare massa eget egestas purus viverra accumsan in .In hendrerit gravida rutrum quisque non tellus orci ac.Pellentesque nec nam aliquam sem et tortor.Habitant morbi tristique senectus et.Adipiscing elit duis tristique sollicitudin nibh sit.Ornare aenean euismod elementum nisi quis eleifend.Commodo viverra maecenas accumsan lacus vel facilisis.Nulla posuere sollicitudin aliquam ultrices sagittis orci a. <\n /Typography> < /\n main > < /\n div >\n );\n}"]},"metadata":{},"sourceType":"module"}
|
