diff --git a/src/renderer/components/hotbar/hotbar-icon.scss b/src/renderer/components/hotbar/hotbar-icon.scss index 275af34d90..2241ac8dc3 100644 --- a/src/renderer/components/hotbar/hotbar-icon.scss +++ b/src/renderer/components/hotbar/hotbar-icon.scss @@ -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; diff --git a/src/renderer/components/hotbar/hotbar-icon.tsx b/src/renderer/components/hotbar/hotbar-icon.tsx index b858934634..c4e32dc5d9 100644 --- a/src/renderer/components/hotbar/hotbar-icon.tsx +++ b/src/renderer/components/hotbar/hotbar-icon.tsx @@ -113,7 +113,10 @@ export function HotbarIcon(props: Props) { toggleMenu(); }} close={() => toggleMenu()}> - remove(uid) }> + { + evt.stopPropagation(); + remove(uid); + }}> Remove from Hotbar { menuItems.map((menuItem) => { diff --git a/src/renderer/components/hotbar/hotbar-menu.tsx b/src/renderer/components/hotbar/hotbar-menu.tsx index 11f16bf598..02cf598837 100644 --- a/src/renderer/components/hotbar/hotbar-menu.tsx +++ b/src/renderer/components/hotbar/hotbar-menu.tsx @@ -96,7 +96,7 @@ export class HotbarMenu extends React.Component { 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 { title={item.entity.name} source={item.entity.source} remove={this.removeItem} + disabled /> )}