react-awesome-lightbox
react-awesome-lightbox copied to clipboard
Problem: Close button "X" is faded even after passing an onClose prop

Code:
{isImageViewerOpen && (
<Lightbox
images={images}
startIndex={imageIndex}
onClose={() => setIsImageViewerOpen(false)}
/>
)}
the close button doesn't have any disable state. Does it close the lightbox when clicked? or functionality is also affected?
Hi Anam,
It does affect the functionality it's working perfectly fine, but the only issue here is that it is faded which in terms of UX gives the user an impression that the button is disabled. So, you could fix this it'll be great just need to tweak the CSS a bit.
Regards, Muhammad Usman Tariq Lahore University of Management Sciences (LUMS) BS Computer Science | 2020 https://www.linkedin.com/in/muhammad-usman-tariq-454579a4/ View LinkedIn Profilehttps://www.linkedin.com/in/muhammad-usman-tariq-454579a4/
From: Anam Ahmed [email protected] Sent: Friday, October 2, 2020 6:38 PM To: theanam/react-awesome-lightbox [email protected] Cc: Muhammad Usman Tariq [email protected]; Author [email protected] Subject: Re: [theanam/react-awesome-lightbox] Problem: Close button "X" is faded even after passing an onClose prop (#4)
the close button doesn't have any disable state. Does it close the lightbox when clicked? or functionality is also affected?
— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHubhttps://github.com/theanam/react-awesome-lightbox/issues/4#issuecomment-702739248, or unsubscribehttps://github.com/notifications/unsubscribe-auth/AJOYJ3IZWOFSSUIS3QL66IDSIXJV5ANCNFSM4R45QPKQ.
Correction: It does NOT affect the functionality.
Regards, Muhammad Usman Tariq Lahore University of Management Sciences (LUMS) BS Computer Science | 2020 https://www.linkedin.com/in/muhammad-usman-tariq-454579a4/ View LinkedIn Profilehttps://www.linkedin.com/in/muhammad-usman-tariq-454579a4/
From: Muhammad Usman Tariq [email protected] Sent: Friday, October 2, 2020 7:02 PM To: theanam/react-awesome-lightbox [email protected] Subject: Re: [theanam/react-awesome-lightbox] Problem: Close button "X" is faded even after passing an onClose prop (#4)
Hi Anam,
It does affect the functionality it's working perfectly fine, but the only issue here is that it is faded which in terms of UX gives the user an impression that the button is disabled. So, you could fix this it'll be great just need to tweak the CSS a bit.
Regards, Muhammad Usman Tariq Lahore University of Management Sciences (LUMS) BS Computer Science | 2020 https://www.linkedin.com/in/muhammad-usman-tariq-454579a4/ View LinkedIn Profilehttps://www.linkedin.com/in/muhammad-usman-tariq-454579a4/
From: Anam Ahmed [email protected] Sent: Friday, October 2, 2020 6:38 PM To: theanam/react-awesome-lightbox [email protected] Cc: Muhammad Usman Tariq [email protected]; Author [email protected] Subject: Re: [theanam/react-awesome-lightbox] Problem: Close button "X" is faded even after passing an onClose prop (#4)
the close button doesn't have any disable state. Does it close the lightbox when clicked? or functionality is also affected?
— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHubhttps://github.com/theanam/react-awesome-lightbox/issues/4#issuecomment-702739248, or unsubscribehttps://github.com/notifications/unsubscribe-auth/AJOYJ3IZWOFSSUIS3QL66IDSIXJV5ANCNFSM4R45QPKQ.
OnClose function triggers funtionality. In order to use Lightbox you should write something like that:
{ postDetail.image && <> <p> <img src={imageSrc} onClick={toggleLightbox} /> </p> { light && <Lightbox image={imageSrc} title="Image Title" onClose={toggleLightbox} /> } </> }
in toggleLightbox function you should toggle light state.