mirrors/hedgedoc
1
0
Fork 0
mirror of https://github.com/hedgedoc/hedgedoc.git synced 2025-05-31 23:28:34 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

Restructure help dialog (#484)

Browse source 
- restructured help dialog
- moved isMac function to editor util
- added notice to CHANGELOG.md

Co-authored-by: Erik Michelson <github@erik.michelson.eu>
Co-authored-by: Tilman Vatteroth <tilman.vatteroth@tu-dortmund.de>
Co-authored-by: Renovate Bot <bot@renovateapp.com>
Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>
This commit is contained in:
Philip Molares 2020-08-26 18:49:46 +02:00 • committed by GitHub
parent c95a7e0fba
commit dfdc652503
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
15 changed files with 422 additions and 368 deletions
Download patch file Download diff file Expand all files Collapse all files

44
src/components/editor/app-bar/help-button/shortcuts.tsx Normal file
View file

@ -0,0 +1,44 @@
import React from 'react'
import { Card, ListGroup, Row } from 'react-bootstrap'
import { Trans } from 'react-i18next'
import { isMac } from '../../utils'
export const Shortcut: React.FC = () => {
const modifierKey = isMac ? <kbd>Cmd</kbd> : <kbd>Ctrl</kbd>
const shortcutMap: {[category: string]: { [functionName: string]: JSX.Element[] }} = {
'View Mode': {
'editor.help.shortcuts.view': [modifierKey, <> + </>, <kbd>Alt</kbd>, <> + </>, <kbd>V</kbd>],
'editor.help.shortcuts.both': [modifierKey, <> + </>, <kbd>Alt</kbd>, <> + </>, <kbd>B</kbd>],
'editor.help.shortcuts.edit': [modifierKey, <> + </>, <kbd>Alt</kbd>, <> + </>, <kbd>E</kbd>]
},
Editor: {
'editor.help.shortcuts.bold': [modifierKey, <> + </>, <kbd>B</kbd>],
'editor.help.shortcuts.italic': [modifierKey, <> + </>, <kbd>I</kbd>],
'editor.help.shortcuts.underline': [modifierKey, <> + </>, <kbd>U</kbd>],
'editor.help.shortcuts.strikethrough': [modifierKey, <> + </>, <kbd>D</kbd>],
'editor.help.shortcuts.mark': [modifierKey, <> + </>, <kbd>M</kbd>]
}
}
return (
<Row className={'justify-content-center pt-4'}>
{Object.keys(shortcutMap).map(category => {
return (
<Card className={'m-2 w-50'}>
<Card.Header>{category}</Card.Header>
<ListGroup variant="flush">
{Object.entries(shortcutMap[category]).map(([functionName, shortcut]) => {
return (
<ListGroup.Item className={'d-flex justify-content-between'}>
<span><Trans i18nKey={functionName}/></span>
<span>{shortcut}</span>
</ListGroup.Item>
)
})}
</ListGroup>
</Card>)
})
}
</Row>
)
}