github/hedgedoc
1
0
Fork 0
mirror of https://github.com/hedgedoc/hedgedoc.git synced 2024-11-24 18:56:32 -05:00
Code Issues Projects Releases Packages Wiki Activity

improve accessibility on permission modal

Browse source 
Signed-off-by: yamashush <38120991+yamashush@users.noreply.github.com>
This commit is contained in:
yamashush 2024-01-21 19:34:45 +09:00 committed by Tilman Vatteroth
parent 56d3bce2da
commit 1f2c78831d
4 changed files with 9 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
frontend/src/components/editor-page/sidebar/specific-sidebar-entries/permissions-sidebar-entry/permissions-modal/permission-add-entry-field.tsx
View file

@ -9,7 +9,7 @@ import { UiIcon } from '../../../../../common/icons/ui-icon'
import type { PermissionDisabledProps } from './permission-disabled.prop' import type { PermissionDisabledProps } from './permission-disabled.prop'
import React, { useCallback, useState } from 'react' import React, { useCallback, useState } from 'react'
import { Button, FormControl, InputGroup } from 'react-bootstrap' import { Button, FormControl, InputGroup } from 'react-bootstrap'
import { Plus as IconPlus } from 'react-bootstrap-icons' import { PlusLg as IconPlus } from 'react-bootstrap-icons'
export interface PermissionAddEntryFieldProps { export interface PermissionAddEntryFieldProps {
onAddEntry: (identifier: string) => void onAddEntry: (identifier: string) => void
@ -42,8 +42,8 @@ export const PermissionAddEntryField: React.FC<PermissionAddEntryFieldProps & Pe
<InputGroup className={'me-1 mb-1'}> <InputGroup className={'me-1 mb-1'}>
<FormControl value={newEntryIdentifier} placeholder={placeholderText} onChange={onChange} disabled={disabled} /> <FormControl value={newEntryIdentifier} placeholder={placeholderText} onChange={onChange} disabled={disabled} />
<Button <Button
variant='light' variant='primary'
className={'text-secondary ms-2'} className={'text-ms-2'}
title={placeholderText} title={placeholderText}
onClick={onSubmit} onClick={onSubmit}
disabled={disabled}> disabled={disabled}>

8
frontend/src/components/editor-page/sidebar/specific-sidebar-entries/permissions-sidebar-entry/permissions-modal/permission-entry-buttons.tsx
View file

@ -75,10 +75,7 @@ export const PermissionEntryButtons: React.FC<PermissionEntryButtonsProps & Perm
return ( return (
<div> <div>
<Button variant='light' className={'text-danger me-2'} disabled={disabled} title={removeTitle} onClick={onRemove}> <ToggleButtonGroup className={'me-2'} type='radio' name='edit-mode' value={currentSetting}>
<UiIcon icon={IconX} />
</Button>
<ToggleButtonGroup type='radio' name='edit-mode' value={currentSetting}>
<Button <Button
disabled={disabled} disabled={disabled}
title={setReadOnlyTitle} title={setReadOnlyTitle}
@ -94,6 +91,9 @@ export const PermissionEntryButtons: React.FC<PermissionEntryButtonsProps & Perm
<UiIcon icon={IconPencil} /> <UiIcon icon={IconPencil} />
</Button> </Button>
</ToggleButtonGroup> </ToggleButtonGroup>
<Button variant='danger' disabled={disabled} title={removeTitle} onClick={onRemove}>
<UiIcon icon={IconX} />
</Button>
</div> </div>
) )
} }

2
frontend/src/components/editor-page/sidebar/specific-sidebar-entries/permissions-sidebar-entry/permissions-modal/permission-owner-change.tsx
View file

@ -38,7 +38,7 @@ export const PermissionOwnerChange: React.FC<PermissionOwnerChangeProps> = ({ on
<InputGroup className={'me-1 mb-1'}> <InputGroup className={'me-1 mb-1'}>
<FormControl value={ownerFieldValue} placeholder={placeholderText} onChange={onChangeField} /> <FormControl value={ownerFieldValue} placeholder={placeholderText} onChange={onChangeField} />
<Button <Button
variant='light' variant='primary'
title={buttonTitleText} title={buttonTitleText}
onClick={onClickConfirm} onClick={onClickConfirm}
className={'ms-2'} className={'ms-2'}

2
frontend/src/components/editor-page/sidebar/specific-sidebar-entries/permissions-sidebar-entry/permissions-modal/permission-owner-info.tsx
View file

@ -36,7 +36,7 @@ export const PermissionOwnerInfo: React.FC<PermissionOwnerInfoProps & Permission
return ( return (
<Fragment> <Fragment>
<UserAvatarForUsername username={noteOwner} /> <UserAvatarForUsername username={noteOwner} />
<Button variant='light' disabled={disabled} title={buttonTitle} onClick={onEditOwner}> <Button variant='primary' disabled={disabled} title={buttonTitle} onClick={onEditOwner}>
<UiIcon icon={IconPencil} /> <UiIcon icon={IconPencil} />
</Button> </Button>
</Fragment> </Fragment>