edit layout for small resolution screens

src/app/components/LanguageSwitcher.tsx

@@ -44,9 +44,13 @@ export default function LanguageSwitcher() {
 		}, 3000)
 	}
 
-	useClickOutside(dropdownRef, () => {
-		setIsOpen(false);
-	});
+	useClickOutside(
+		dropdownRef,
+		() => {
+			setIsOpen(false);
+		},
+		isOpen
+	);
 
 	useEffect(() => {
 		const handleEscape = (event: KeyboardEvent) => {

src/app/components/dropDownList.tsx

@@ -18,9 +18,12 @@ interface ChildProps {
 export default function DropDownList({ children, value, callBack, translatedValue }: DropDownListProps) {
 	const [isOpen, setIsOpen] = useState(false)
 	const dropdownRef = useRef<HTMLDivElement>(null)
-	useClickOutside(dropdownRef, () => {
-		setIsOpen(false);
-	});
+	useClickOutside(dropdownRef,
+		() => {
+			setIsOpen(false);
+		},
+		isOpen
+	);
 
 	const enhancedChildren = React.Children.map(children, (child, index) => {
 		if (React.isValidElement<ChildProps>(child)) {