Fix upload cursor

wondrous-dev · Mar 3, 2024 · 485de05 · 485de05
1 parent 3df8515
commit 485de05
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 12 deletions.
diff --git a/wondrous-bot-admin/src/components/Settings/CustomizeBanners/index.tsx b/wondrous-bot-admin/src/components/Settings/CustomizeBanners/index.tsx
@@ -236,11 +236,11 @@ const CommandBanner = ({ baseBanner, activeOrg, customBanner }) => {
           <BannerUploadTextButtonContainer>
             <BannerUploadText>Optimal size: 640 x 140px</BannerUploadText>
             <BannerUploadButtonContainer>
+              <ButtonIconWrapper onClick={() => imageInputField.current.click()}>
+                <ReplaceIcon />
+              </ButtonIconWrapper>
               <ButtonInputContainer>
                 <input type="file" accept="image/*" ref={imageInputField} onChange={handleReplaceBannerImage} />
-                <ButtonIconWrapper>
-                  <ReplaceIcon />
-                </ButtonIconWrapper>
               </ButtonInputContainer>
               <ButtonIconWrapper onClick={handleDeleteBannerImage}>
                 <DeleteIcon />
@@ -271,11 +271,11 @@ const CommandBanner = ({ baseBanner, activeOrg, customBanner }) => {
             <TopImageTextButtonContainer>
               <TopImageText>400 x 400px</TopImageText>
               <TopImageButtonContainer>
+                <ButtonIconWrapper onClick={() => imageInputField.current.click()}>
+                  <ReplaceIcon />
+                </ButtonIconWrapper>
                 <ButtonInputContainer>
                   <input type="file" accept="image/*" ref={imageInputField} onChange={handleReplaceTopImage} />
-                  <ButtonIconWrapper>
-                    <ReplaceIcon />
-                  </ButtonIconWrapper>
                 </ButtonInputContainer>
                 <ButtonIconWrapper onClick={handleDeleteTopImage}>
                   <DeleteIcon />

diff --git a/wondrous-bot-admin/src/components/Settings/CustomizeBanners/styles.tsx b/wondrous-bot-admin/src/components/Settings/CustomizeBanners/styles.tsx
@@ -146,14 +146,9 @@ export const BannerUploadButtonContainer = styled(Grid)`
 
 export const ButtonInputContainer = styled(Grid)`
   && {
-    position: relative;
-
-    &:hover {
-      opacity: 0.8;
-    }
+    position: absolute;
 
     & > input {
-      z-index: 1;
       position: absolute;
       top: 0;
       left: 0;