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

Styling disabled hotbar items

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>
This commit is contained in:
Alex Andreev 2021-05-06 13:37:15 +03:00
parent 3fcd44b676
commit c679a88ff1
3 changed files with 18 additions and 2 deletions

View File

@ -20,6 +20,18 @@
transition: all 0s 0.8s;
}
&.disabled {
opacity: 0.4;
cursor: default;
filter: grayscale(0.7);
&:hover {
&:not(.active) {
box-shadow: none;
}
}
}
&.active, &.interactive:hover {
img {
opacity: 1;

View File

@ -113,7 +113,10 @@ export function HotbarIcon(props: Props) {
toggleMenu();
}}
close={() => toggleMenu()}>
<MenuItem key="remove-from-hotbar" onClick={() => remove(uid) }>
<MenuItem key="remove-from-hotbar" onClick={(evt) => {
evt.stopPropagation();
remove(uid);
}}>
<Icon material="clear" small interactive={true} title="Remove from hotbar"/> Remove from Hotbar
</MenuItem>
{ menuItems.map((menuItem) => {

View File

@ -96,7 +96,7 @@ export class HotbarMenu extends React.Component<Props> {
<HotbarEntityIcon
key={index}
entity={entity}
onClick={() => entity?.onRun(catalogEntityRunContext)}
onClick={() => entity.onRun(catalogEntityRunContext)}
className={cssNames({ isDragging: snapshot.isDragging })}
remove={this.removeItem}
/>
@ -106,6 +106,7 @@ export class HotbarMenu extends React.Component<Props> {
title={item.entity.name}
source={item.entity.source}
remove={this.removeItem}
disabled
/>
)}
</div>