feat: fixes UX around drag and drop onto canvas

src/components/ItemControls/IconSelectionControls/IconSelectionControls.tsx

@@ -1,4 +1,5 @@
 import React, { useCallback } from 'react';
+import { Stack, Alert } from '@mui/material';
 import { ControlsContainer } from 'src/components/ItemControls/components/ControlsContainer';
 import { useUiStateStore } from 'src/stores/uiStateStore';
 import { Icon } from 'src/types';
@@ -36,7 +37,12 @@ export const IconSelectionControls = () => {
     <ControlsContainer
       header={
         <Section sx={{ position: 'sticky', top: 0, pt: 6, pb: 3 }}>
-          <Searchbox value={filter} onChange={setFilter} />
+          <Stack spacing={2}>
+            <Searchbox value={filter} onChange={setFilter} />
+            <Alert severity="info">
+              You can drag and drop icons below onto the canvas.
+            </Alert>
+          </Stack>
         </Section>
       }
     >

src/components/UiOverlay/UiOverlay.tsx

@@ -98,8 +98,7 @@ export const UiOverlay = () => {
           width: 0,
           height: 0,
           top: 0,
-          left: 0,
-          zIndex: 1
+          left: 0
         }}
       >
         {availableTools.includes('ITEM_CONTROLS') && itemControls && (