Align slider endpoints in settings

This commit is contained in:
nickofolas 2022-01-21 16:32:32 -06:00
parent a954095519
commit 259071e3d5

@ -205,103 +205,97 @@ export function GameOptionsRoot(props: IProps): React.ReactElement {
<Grid item xs={12} sm={6}> <Grid item xs={12} sm={6}>
<List> <List>
<ListItem> <ListItem>
<Tooltip <Box display="grid" sx={{ width: 'fit-content', gridTemplateColumns: '1fr 3.5fr', gap: 1 }}>
title={ <Tooltip
<Typography> title={
The minimum number of milliseconds it takes to execute an operation in Netscript. Setting this too <Typography>
low can result in poor performance if you have many scripts running. The minimum number of milliseconds it takes to execute an operation in Netscript. Setting this too
</Typography> low can result in poor performance if you have many scripts running.
} </Typography>
> }
<Typography>.script exec time (ms)</Typography> >
</Tooltip> <Typography>.script exec time (ms)</Typography>
<Slider </Tooltip>
value={execTime} <Slider
onChange={handleExecTimeChange} value={execTime}
step={1} onChange={handleExecTimeChange}
min={5} step={1}
max={100} min={5}
valueLabelDisplay="auto" max={100}
/> valueLabelDisplay="auto"
</ListItem> />
<ListItem> <Tooltip
<Tooltip title={
title={ <Typography>
<Typography> The maximum number of lines a script's logs can hold. Setting this too high can cause the game to
The maximum number of lines a script's logs can hold. Setting this too high can cause the game to use a lot of memory if you have many scripts running.
use a lot of memory if you have many scripts running. </Typography>
</Typography> }
} >
> <Typography>Netscript log size</Typography>
<Typography>Netscript log size</Typography> </Tooltip>
</Tooltip> <Slider
<Slider value={logSize}
value={logSize} onChange={handleLogSizeChange}
onChange={handleLogSizeChange} step={20}
step={20} min={20}
min={20} max={500}
max={500} valueLabelDisplay="auto"
valueLabelDisplay="auto" />
/> <Tooltip
</ListItem> title={
<ListItem> <Typography>
<Tooltip The maximum number of entries that can be written to a port using Netscript's write() function.
title={ Setting this too high can cause the game to use a lot of memory.
<Typography> </Typography>
The maximum number of entries that can be written to a port using Netscript's write() function. }
Setting this too high can cause the game to use a lot of memory. >
</Typography> <Typography>Netscript port size</Typography>
} </Tooltip>
> <Slider
<Typography>Netscript port size</Typography> value={portSize}
</Tooltip> onChange={handlePortSizeChange}
<Slider step={1}
value={portSize} min={20}
onChange={handlePortSizeChange} max={100}
step={1} valueLabelDisplay="auto"
min={20} />
max={100} <Tooltip
valueLabelDisplay="auto" title={
/> <Typography>
</ListItem> The maximum number of entries that can be written to the terminal. Setting this too high can cause
<ListItem> the game to use a lot of memory.
<Tooltip </Typography>
title={ }
<Typography> >
The maximum number of entries that can be written to the terminal. Setting this too high can cause <Typography>Terminal capacity</Typography>
the game to use a lot of memory. </Tooltip>
</Typography> <Slider
} value={terminalSize}
> onChange={handleTerminalSizeChange}
<Typography>Terminal capacity</Typography> step={50}
</Tooltip> min={50}
<Slider max={500}
value={terminalSize} valueLabelDisplay="auto"
onChange={handleTerminalSizeChange} marks
step={50} />
min={50} <Tooltip
max={500} title={
valueLabelDisplay="auto" <Typography>The time (in seconds) between each autosave. Set to 0 to disable autosave.</Typography>
marks }
/> >
</ListItem> <Typography>Autosave interval (s)</Typography>
<ListItem> </Tooltip>
<Tooltip <Slider
title={ value={autosaveInterval}
<Typography>The time (in seconds) between each autosave. Set to 0 to disable autosave.</Typography> onChange={handleAutosaveIntervalChange}
} step={30}
> min={0}
<Typography>Autosave interval (s)</Typography> max={600}
</Tooltip> valueLabelDisplay="auto"
<Slider marks
value={autosaveInterval} />
onChange={handleAutosaveIntervalChange} </Box>
step={30}
min={0}
max={600}
valueLabelDisplay="auto"
marks
/>
</ListItem> </ListItem>
<ListItem> <ListItem>
<OptionSwitch <OptionSwitch