mirror of
https://github.com/bitburner-official/bitburner-src.git
synced 2024-11-30 19:43:49 +01:00
added icon to hide stats
This commit is contained in:
parent
cab823bcdf
commit
ff726afcd6
@ -18,6 +18,8 @@ import Typography from "@mui/material/Typography";
|
|||||||
import Divider from "@mui/material/Divider";
|
import Divider from "@mui/material/Divider";
|
||||||
import Button from "@mui/material/Button";
|
import Button from "@mui/material/Button";
|
||||||
import Collapse from "@mui/material/Collapse";
|
import Collapse from "@mui/material/Collapse";
|
||||||
|
import Fab from "@mui/material/Fab";
|
||||||
|
import VisibilityOffIcon from "@mui/icons-material/VisibilityOff";
|
||||||
|
|
||||||
import { colors } from "./Theme";
|
import { colors } from "./Theme";
|
||||||
import { Settings } from "../../Settings/Settings";
|
import { Settings } from "../../Settings/Settings";
|
||||||
@ -94,10 +96,14 @@ const useStyles = makeStyles({
|
|||||||
int: {
|
int: {
|
||||||
color: colors.int,
|
color: colors.int,
|
||||||
},
|
},
|
||||||
|
nobackground: {
|
||||||
|
backgroundColor: "#0000",
|
||||||
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
export function CharacterOverview({ player, save }: IProps): React.ReactElement {
|
export function CharacterOverview({ player, save }: IProps): React.ReactElement {
|
||||||
const setRerender = useState(false)[1];
|
const setRerender = useState(false)[1];
|
||||||
|
const [open, setOpen] = useState(true);
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
const id = setInterval(() => setRerender((old) => !old), 600);
|
const id = setInterval(() => setRerender((old) => !old), 600);
|
||||||
@ -106,103 +112,120 @@ export function CharacterOverview({ player, save }: IProps): React.ReactElement
|
|||||||
|
|
||||||
const classes = useStyles();
|
const classes = useStyles();
|
||||||
return (
|
return (
|
||||||
<Paper square>
|
<>
|
||||||
<Box m={1}>
|
<Box display="flex" justifyContent="flex-end" flexDirection={"column"}>
|
||||||
<Table size="small">
|
<Collapse in={open}>
|
||||||
<TableBody>
|
<Paper square>
|
||||||
<TableRow>
|
<Box m={1}>
|
||||||
<TableCell component="th" scope="row" classes={{ root: classes.cellNone }}>
|
<Table size="small">
|
||||||
<Typography classes={{ root: classes.hp }}>HP </Typography>
|
<TableBody>
|
||||||
</TableCell>
|
<TableRow>
|
||||||
<TableCell align="right" classes={{ root: classes.cellNone }}>
|
<TableCell component="th" scope="row" classes={{ root: classes.cellNone }}>
|
||||||
<Typography classes={{ root: classes.hp }}>
|
<Typography classes={{ root: classes.hp }}>HP </Typography>
|
||||||
{numeralWrapper.formatHp(player.hp)} / {numeralWrapper.formatHp(player.max_hp)}
|
</TableCell>
|
||||||
</Typography>
|
<TableCell align="right" classes={{ root: classes.cellNone }}>
|
||||||
</TableCell>
|
<Typography classes={{ root: classes.hp }}>
|
||||||
</TableRow>
|
{numeralWrapper.formatHp(player.hp)} / {numeralWrapper.formatHp(player.max_hp)}
|
||||||
|
</Typography>
|
||||||
|
</TableCell>
|
||||||
|
</TableRow>
|
||||||
|
|
||||||
<TableRow>
|
<TableRow>
|
||||||
<TableCell component="th" scope="row" classes={{ root: classes.cellNone }}>
|
<TableCell component="th" scope="row" classes={{ root: classes.cellNone }}>
|
||||||
<Typography classes={{ root: classes.money }}>Money </Typography>
|
<Typography classes={{ root: classes.money }}>Money </Typography>
|
||||||
</TableCell>
|
</TableCell>
|
||||||
<TableCell align="right" classes={{ root: classes.cellNone }}>
|
<TableCell align="right" classes={{ root: classes.cellNone }}>
|
||||||
<Typography classes={{ root: classes.money }}>
|
<Typography classes={{ root: classes.money }}>
|
||||||
{numeralWrapper.formatMoney(player.money.toNumber())}
|
{numeralWrapper.formatMoney(player.money.toNumber())}
|
||||||
</Typography>
|
</Typography>
|
||||||
</TableCell>
|
</TableCell>
|
||||||
</TableRow>
|
</TableRow>
|
||||||
|
|
||||||
<TableRow>
|
<TableRow>
|
||||||
<TableCell component="th" scope="row" classes={{ root: classes.cell }}>
|
<TableCell component="th" scope="row" classes={{ root: classes.cell }}>
|
||||||
<Typography classes={{ root: classes.hack }}>Hack </Typography>
|
<Typography classes={{ root: classes.hack }}>Hack </Typography>
|
||||||
</TableCell>
|
</TableCell>
|
||||||
<TableCell align="right" classes={{ root: classes.cell }}>
|
<TableCell align="right" classes={{ root: classes.cell }}>
|
||||||
<Typography classes={{ root: classes.hack }}>
|
<Typography classes={{ root: classes.hack }}>
|
||||||
{numeralWrapper.formatSkill(player.hacking_skill)}
|
{numeralWrapper.formatSkill(player.hacking_skill)}
|
||||||
</Typography>
|
</Typography>
|
||||||
</TableCell>
|
</TableCell>
|
||||||
</TableRow>
|
</TableRow>
|
||||||
|
|
||||||
<TableRow>
|
<TableRow>
|
||||||
<TableCell component="th" scope="row" classes={{ root: classes.cellNone }}>
|
<TableCell component="th" scope="row" classes={{ root: classes.cellNone }}>
|
||||||
<Typography classes={{ root: classes.combat }}>Str </Typography>
|
<Typography classes={{ root: classes.combat }}>Str </Typography>
|
||||||
</TableCell>
|
</TableCell>
|
||||||
<TableCell align="right" classes={{ root: classes.cellNone }}>
|
<TableCell align="right" classes={{ root: classes.cellNone }}>
|
||||||
<Typography classes={{ root: classes.combat }}>
|
<Typography classes={{ root: classes.combat }}>
|
||||||
{numeralWrapper.formatSkill(player.strength)}
|
{numeralWrapper.formatSkill(player.strength)}
|
||||||
</Typography>
|
</Typography>
|
||||||
</TableCell>
|
</TableCell>
|
||||||
</TableRow>
|
</TableRow>
|
||||||
|
|
||||||
<TableRow>
|
<TableRow>
|
||||||
<TableCell component="th" scope="row" classes={{ root: classes.cellNone }}>
|
<TableCell component="th" scope="row" classes={{ root: classes.cellNone }}>
|
||||||
<Typography classes={{ root: classes.combat }}>Def </Typography>
|
<Typography classes={{ root: classes.combat }}>Def </Typography>
|
||||||
</TableCell>
|
</TableCell>
|
||||||
<TableCell align="right" classes={{ root: classes.cellNone }}>
|
<TableCell align="right" classes={{ root: classes.cellNone }}>
|
||||||
<Typography classes={{ root: classes.combat }}>{numeralWrapper.formatSkill(player.defense)}</Typography>
|
<Typography classes={{ root: classes.combat }}>
|
||||||
</TableCell>
|
{numeralWrapper.formatSkill(player.defense)}
|
||||||
</TableRow>
|
</Typography>
|
||||||
|
</TableCell>
|
||||||
|
</TableRow>
|
||||||
|
|
||||||
<TableRow>
|
<TableRow>
|
||||||
<TableCell component="th" scope="row" classes={{ root: classes.cellNone }}>
|
<TableCell component="th" scope="row" classes={{ root: classes.cellNone }}>
|
||||||
<Typography classes={{ root: classes.combat }}>Dex </Typography>
|
<Typography classes={{ root: classes.combat }}>Dex </Typography>
|
||||||
</TableCell>
|
</TableCell>
|
||||||
<TableCell align="right" classes={{ root: classes.cellNone }}>
|
<TableCell align="right" classes={{ root: classes.cellNone }}>
|
||||||
<Typography classes={{ root: classes.combat }}>
|
<Typography classes={{ root: classes.combat }}>
|
||||||
{numeralWrapper.formatSkill(player.dexterity)}
|
{numeralWrapper.formatSkill(player.dexterity)}
|
||||||
</Typography>
|
</Typography>
|
||||||
</TableCell>
|
</TableCell>
|
||||||
</TableRow>
|
</TableRow>
|
||||||
<TableRow>
|
<TableRow>
|
||||||
<TableCell component="th" scope="row" classes={{ root: classes.cell }}>
|
<TableCell component="th" scope="row" classes={{ root: classes.cell }}>
|
||||||
<Typography classes={{ root: classes.combat }}>Agi </Typography>
|
<Typography classes={{ root: classes.combat }}>Agi </Typography>
|
||||||
</TableCell>
|
</TableCell>
|
||||||
<TableCell align="right" classes={{ root: classes.cell }}>
|
<TableCell align="right" classes={{ root: classes.cell }}>
|
||||||
<Typography classes={{ root: classes.combat }}>{numeralWrapper.formatSkill(player.agility)}</Typography>
|
<Typography classes={{ root: classes.combat }}>
|
||||||
</TableCell>
|
{numeralWrapper.formatSkill(player.agility)}
|
||||||
</TableRow>
|
</Typography>
|
||||||
|
</TableCell>
|
||||||
|
</TableRow>
|
||||||
|
|
||||||
<TableRow>
|
<TableRow>
|
||||||
<TableCell component="th" scope="row" classes={{ root: classes.cellNone }}>
|
<TableCell component="th" scope="row" classes={{ root: classes.cellNone }}>
|
||||||
<Typography classes={{ root: classes.cha }}>Cha </Typography>
|
<Typography classes={{ root: classes.cha }}>Cha </Typography>
|
||||||
</TableCell>
|
</TableCell>
|
||||||
<TableCell align="right" classes={{ root: classes.cellNone }}>
|
<TableCell align="right" classes={{ root: classes.cellNone }}>
|
||||||
<Typography classes={{ root: classes.cha }}>{numeralWrapper.formatSkill(player.charisma)}</Typography>
|
<Typography classes={{ root: classes.cha }}>
|
||||||
</TableCell>
|
{numeralWrapper.formatSkill(player.charisma)}
|
||||||
</TableRow>
|
</Typography>
|
||||||
<Intelligence player={player} />
|
</TableCell>
|
||||||
<Work player={player} />
|
</TableRow>
|
||||||
|
<Intelligence player={player} />
|
||||||
|
<Work player={player} />
|
||||||
|
|
||||||
<TableRow>
|
<TableRow>
|
||||||
<TableCell align="center" colSpan={2} classes={{ root: classes.cellNone }}>
|
<TableCell align="center" colSpan={2} classes={{ root: classes.cellNone }}>
|
||||||
<Button color={Settings.AutosaveInterval !== 0 ? "primary" : "secondary"} onClick={save}>
|
<Button color={Settings.AutosaveInterval !== 0 ? "primary" : "secondary"} onClick={save}>
|
||||||
SAVE
|
SAVE
|
||||||
</Button>
|
</Button>
|
||||||
</TableCell>
|
</TableCell>
|
||||||
</TableRow>
|
</TableRow>
|
||||||
</TableBody>
|
</TableBody>
|
||||||
</Table>
|
</Table>
|
||||||
|
</Box>
|
||||||
|
</Paper>
|
||||||
|
</Collapse>
|
||||||
|
<Box display="flex" justifyContent="flex-end">
|
||||||
|
<Fab classes={{ root: classes.nobackground }} color="secondary" onClick={() => setOpen((old) => !old)}>
|
||||||
|
<VisibilityOffIcon />
|
||||||
|
</Fab>
|
||||||
|
</Box>
|
||||||
</Box>
|
</Box>
|
||||||
</Paper>
|
</>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user