ironmagma/quintodrome
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Show hotkeys as chips, for easier reading

Browse source
This commit is contained in:
Deluan 2021-10-25 10:52:43 -04:00
parent 8d6b5f9d02
commit ed1ca65ad5
1 changed files with 6 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
ui/src/dialogs/HelpDialog.js
View file

@ -1,6 +1,6 @@
import React, { useCallback, useState } from 'react' import React, { useCallback, useState } from 'react'
import ReactDOM from 'react-dom' import ReactDOM from 'react-dom'
import { Dialog } from '@material-ui/core' import { Chip, Dialog } from '@material-ui/core'
import { getApplicationKeyMap, GlobalHotKeys } from 'react-hotkeys' import { getApplicationKeyMap, GlobalHotKeys } from 'react-hotkeys'
import TableContainer from '@material-ui/core/TableContainer' import TableContainer from '@material-ui/core/TableContainer'
import Paper from '@material-ui/core/Paper' import Paper from '@material-ui/core/Paper'
@ -38,7 +38,11 @@ const HelpTable = (props) => {
</TableCell> </TableCell>
<TableCell align="left"> <TableCell align="left">
{sequences.map(({ sequence }) => ( {sequences.map(({ sequence }) => (
<span key={sequence}>{sequence}</span> <Chip
label={<kbd key={sequence}>{sequence}</kbd>}
size="small"
variant={'outlined'}
/>
))} ))}
</TableCell> </TableCell>
</TableRow> </TableRow>