diff options
Diffstat (limited to 'subprojects/frontend/src/App.tsx')
-rw-r--r-- | subprojects/frontend/src/App.tsx | 60 |
1 files changed, 60 insertions, 0 deletions
diff --git a/subprojects/frontend/src/App.tsx b/subprojects/frontend/src/App.tsx new file mode 100644 index 00000000..54f92f9a --- /dev/null +++ b/subprojects/frontend/src/App.tsx | |||
@@ -0,0 +1,60 @@ | |||
1 | import AppBar from '@mui/material/AppBar'; | ||
2 | import Box from '@mui/material/Box'; | ||
3 | import IconButton from '@mui/material/IconButton'; | ||
4 | import Toolbar from '@mui/material/Toolbar'; | ||
5 | import Typography from '@mui/material/Typography'; | ||
6 | import MenuIcon from '@mui/icons-material/Menu'; | ||
7 | import React from 'react'; | ||
8 | |||
9 | import { EditorArea } from './editor/EditorArea'; | ||
10 | import { EditorButtons } from './editor/EditorButtons'; | ||
11 | import { GenerateButton } from './editor/GenerateButton'; | ||
12 | |||
13 | export function App(): JSX.Element { | ||
14 | return ( | ||
15 | <Box | ||
16 | display="flex" | ||
17 | flexDirection="column" | ||
18 | sx={{ height: '100vh' }} | ||
19 | > | ||
20 | <AppBar | ||
21 | position="static" | ||
22 | color="inherit" | ||
23 | > | ||
24 | <Toolbar> | ||
25 | <IconButton | ||
26 | edge="start" | ||
27 | sx={{ mr: 2 }} | ||
28 | color="inherit" | ||
29 | aria-label="menu" | ||
30 | > | ||
31 | <MenuIcon /> | ||
32 | </IconButton> | ||
33 | <Typography | ||
34 | variant="h6" | ||
35 | component="h1" | ||
36 | flexGrow={1} | ||
37 | > | ||
38 | Refinery | ||
39 | </Typography> | ||
40 | </Toolbar> | ||
41 | </AppBar> | ||
42 | <Box | ||
43 | display="flex" | ||
44 | justifyContent="space-between" | ||
45 | alignItems="center" | ||
46 | p={1} | ||
47 | > | ||
48 | <EditorButtons /> | ||
49 | <GenerateButton /> | ||
50 | </Box> | ||
51 | <Box | ||
52 | flexGrow={1} | ||
53 | flexShrink={1} | ||
54 | sx={{ overflow: 'auto' }} | ||
55 | > | ||
56 | <EditorArea /> | ||
57 | </Box> | ||
58 | </Box> | ||
59 | ); | ||
60 | } | ||