1
0
mirror of https://github.com/lensapp/lens.git synced 2025-05-20 05:10:56 +00:00

Add keyboard support

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>
This commit is contained in:
Alex Andreev 2021-11-09 10:50:57 +03:00
parent a0030cbd8a
commit 57622e33a1
2 changed files with 14 additions and 2 deletions

View File

@ -47,6 +47,11 @@
}
.menu {
width: 184px;
width: 185px;
margin-top: -10px;
}
.avatar {
font-weight: 500;
margin-right: 1.25rem;
}

View File

@ -83,6 +83,12 @@ export function SidebarCluster({ clusterEntity }: { clusterEntity: CatalogEntity
toggle();
};
const onKeyDown = (evt: React.KeyboardEvent<HTMLDivElement>) => {
if (evt.code == "Space") {
toggle();
}
};
const toggle = () => {
setOpened(!opened);
};
@ -91,13 +97,14 @@ export function SidebarCluster({ clusterEntity }: { clusterEntity: CatalogEntity
const id = `cluster-${metadata.uid}`;
return (
<div className={styles.SidebarCluster} tabIndex={0} id={id}>
<div className={styles.SidebarCluster} tabIndex={0} id={id} onKeyDown={onKeyDown} role="menubar">
<Avatar
title={metadata.name}
colorHash={`${metadata.name}-${metadata.source}`}
width={40}
height={40}
src={spec.icon?.src}
className={styles.avatar}
/>
<div className={styles.clusterName}>
{metadata.name}