mirror of
https://github.com/Azure/cosmos-explorer.git
synced 2024-11-25 06:56:38 +00:00
Bug 2748872: "Back" button is not keyboard accessible which is present under "Email" screen. (#1665)
* Keyboard navigation was not present to the back button on the add row table dialog which has been added through this commit * Update PanelComponent.less
This commit is contained in:
parent
d305eb9f9b
commit
b419bec5a3
@ -112,8 +112,9 @@
|
||||
margin-top: 28px;
|
||||
margin-left: 4px !important;
|
||||
}
|
||||
.addRemoveIcon [alt="editEntity"]:focus,.addRemoveIconLabel [alt="editEntity"]:focus{
|
||||
border:1px dashed #605E5C
|
||||
.addRemoveIcon [alt="editEntity"]:focus,
|
||||
.addRemoveIconLabel [alt="editEntity"]:focus {
|
||||
border: 1px dashed #605e5c;
|
||||
}
|
||||
.addNewParamStyle {
|
||||
margin-top: 5px;
|
||||
@ -153,6 +154,9 @@
|
||||
.backImageIcon {
|
||||
margin-top: 8px;
|
||||
}
|
||||
[alt="back"]:focus {
|
||||
border: 1px solid #605e5c;
|
||||
}
|
||||
.addEntityDatePicker {
|
||||
max-width: 145px;
|
||||
}
|
||||
|
@ -213,12 +213,24 @@ export const AddTableEntityPanel: FunctionComponent<AddTableEntityPanelProps> =
|
||||
setSelectedRow(rowEndex);
|
||||
setIsEntityValuePanelTrue();
|
||||
};
|
||||
const handlePress = (event: React.KeyboardEvent<HTMLElement>): void => {
|
||||
if (event.key === "Enter" || event.key === "Space") {
|
||||
setIsEntityValuePanelFalse();
|
||||
}
|
||||
};
|
||||
|
||||
if (isEntityValuePanelOpen) {
|
||||
return (
|
||||
<Stack style={{ padding: "20px 34px" }}>
|
||||
<Stack horizontal {...columnProps}>
|
||||
<Image {...backImageProps} src={RevertBackIcon} alt="back" onClick={() => setIsEntityValuePanelFalse()} />
|
||||
<Image
|
||||
{...backImageProps}
|
||||
src={RevertBackIcon}
|
||||
alt="back"
|
||||
tabIndex={0}
|
||||
onClick={setIsEntityValuePanelFalse}
|
||||
onKeyPress={handlePress}
|
||||
/>
|
||||
<Label>{entityAttributeProperty}</Label>
|
||||
</Stack>
|
||||
<TextField
|
||||
|
Loading…
Reference in New Issue
Block a user