Personal_mirrors/bitburner-src
1
0
Fork 0
mirror of https://github.com/bitburner-official/bitburner-src.git synced 2024-11-27 01:53:48 +01:00
Code Issues Packages Projects Releases Wiki Activity

Add Paper styling to modal

Browse Source
This commit is contained in:
nickofolas 2022-01-29 23:54:36 -06:00
parent e800886d42
commit dd77deca7b
1 changed files with 165 additions and 160 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
src/ScriptEditor/ui/ThemeEditorModal.tsx
View File

@ -7,6 +7,7 @@ import Button from "@mui/material/Button";
import Box from "@mui/material/Box"; import Box from "@mui/material/Box";
import Tooltip from "@mui/material/Tooltip"; import Tooltip from "@mui/material/Tooltip";
import TextField from "@mui/material/TextField"; import TextField from "@mui/material/TextField";
import Paper from "@mui/material/Paper";
import IconButton from "@mui/material/IconButton"; import IconButton from "@mui/material/IconButton";
import ReplyIcon from "@mui/icons-material/Reply"; import ReplyIcon from "@mui/icons-material/Reply";
import HistoryIcon from '@mui/icons-material/History'; import HistoryIcon from '@mui/icons-material/History';
@ -104,6 +105,7 @@ export function ThemeEditorModal(props: IProps): React.ReactElement {
}}> }}>
<Typography variant="h4">Customize Editor theme</Typography> <Typography variant="h4">Customize Editor theme</Typography>
<Typography>Hover over input boxes for more information</Typography> <Typography>Hover over input boxes for more information</Typography>
<Paper sx={{ p: 1, my: 1 }}>
<OptionSwitch <OptionSwitch
checked={themeCopy.base === "vs"} checked={themeCopy.base === "vs"}
onChange={(val) => { onChange={(val) => {
@ -113,8 +115,8 @@ export function ThemeEditorModal(props: IProps): React.ReactElement {
text="Use light theme as base" text="Use light theme as base"
tooltip={ tooltip={
<> <>
If enabled, the vs light theme will be used as the If enabled, the <code>vs</code> light theme will be used as the
theme base, otherwise, vs-dark will be used. theme base, otherwise, <code>vs-dark</code> will be used.
</> </>
} }
/> />
@ -245,6 +247,8 @@ export function ThemeEditorModal(props: IProps): React.ReactElement {
/> />
</Box> </Box>
</Box> </Box>
</Paper>
<Paper sx={{ p: 1 }}>
<TextField <TextField
multiline multiline
fullWidth fullWidth
@ -253,7 +257,7 @@ export function ThemeEditorModal(props: IProps): React.ReactElement {
value={JSON.stringify(themeCopy, undefined, 2)} value={JSON.stringify(themeCopy, undefined, 2)}
onChange={onThemeChange} onChange={onThemeChange}
/> />
<Box sx={{ my: 1 }}> <Box sx={{ mt: 1 }}>
<Button onClick={() => { <Button onClick={() => {
Settings.EditorTheme = { ...themeCopy }; Settings.EditorTheme = { ...themeCopy };
props.onClose() props.onClose()
@ -266,6 +270,7 @@ export function ThemeEditorModal(props: IProps): React.ReactElement {
startIcon={<HistoryIcon />} startIcon={<HistoryIcon />}
>Reset to default</Button> >Reset to default</Button>
</Box> </Box>
</Paper>
</Modal> </Modal>
) )
} }