일정 부분 까지 완전 하얀 후 fade
export const mobileShadow = style({
"@media": {
...kycMobileStyle({
background: `
linear-gradient(to top,
white 0%,
white 50%,
rgba(255,255,255,0.8) 75%,
rgba(255,255,255,0) 100%
)
`,
bottom: 0,
height: 120,
left: "50%",
position: "fixed",
transform: "translateX(-50%)",
width: "100%",
}),
},
display: "hidden",
});
TypeScript
복사
특정부분 외 클릭 시 event fire
useEffect(() => {
const handleClickOutside = (event: MouseEvent) => {
if (
dropdownRef.current &&
!dropdownRef.current.contains(event.target as Node) &&
!buttonRef.current?.contains(event.target as Node)
) {
setIsDropdownOpened(false);
}
};
document.addEventListener("mousedown", handleClickOutside);
return () => {
document.removeEventListener("mousedown", handleClickOutside);
};
}, []);
TypeScript
복사