diff --git a/src/components/Modal/Modal.tsx b/src/components/Modal/Modal.tsx index 0f7894592..b4fac29c1 100644 --- a/src/components/Modal/Modal.tsx +++ b/src/components/Modal/Modal.tsx @@ -17,10 +17,10 @@ const Modal: React.FC = ({ onClose, children }: Props) => { useEffect(() => { const onKeyDown = (event: KeyboardEvent) => event.keyCode === 27 && onClose(); - document.body.style.overflow = 'hidden'; + document.body.style.overflowY = 'hidden'; document.addEventListener('keydown', onKeyDown); return () => { - document.body.style.overflow = 'scroll'; + document.body.style.overflowY = 'auto'; document.removeEventListener('keydown', onKeyDown); }; }, [onClose]); diff --git a/src/screens/Movie/Movie.tsx b/src/screens/Movie/Movie.tsx index 46e29a74c..36eb1b19a 100644 --- a/src/screens/Movie/Movie.tsx +++ b/src/screens/Movie/Movie.tsx @@ -1,4 +1,4 @@ -import React, { useContext, useState } from 'react'; +import React, { useContext, useEffect, useState } from 'react'; import type { RouteComponentProps } from 'react-router-dom'; import { useHistory } from 'react-router'; import { Helmet } from 'react-helmet'; @@ -73,6 +73,13 @@ const Movie = ({ setTimeout(() => setHasShared(false), 2000); }; + useEffect(() => { + if (play) document.body.style.overflowY = 'hidden'; + return () => { + if (play) document.body.style.overflowY = 'auto'; + }; + }, [play]); + if (isLoading) return

Loading...

; if (error) return

Error loading list

; if (!item) return

Can not find medium

; @@ -101,7 +108,9 @@ const Movie = ({ - {item.tags.split(',').map(tag => )} + {item.tags.split(',').map((tag) => ( + + ))} {item ? : null} diff --git a/src/screens/Series/Series.tsx b/src/screens/Series/Series.tsx index 25e6d5ef3..819ccbf72 100644 --- a/src/screens/Series/Series.tsx +++ b/src/screens/Series/Series.tsx @@ -93,12 +93,22 @@ const Series = ({ } }, [history, searchParams, seriesPlaylist]); + useEffect(() => { + if (play) document.body.style.overflowY = 'hidden'; + return () => { + if (play) document.body.style.overflowY = 'auto'; + }; + }, [play]); + if (isLoading || playlistIsLoading) return

Loading...

; if (error || playlistError) return

Error loading list

; if (!seriesPlaylist || !item) return

Can not find medium

; const pageTitle = `${item.title} - ${config.siteName}`; - const canonicalUrl = seriesPlaylist && item ? `${window.location.origin}${episodeURL(seriesPlaylist, item.mediaid)}` : window.location.href; + const canonicalUrl = + seriesPlaylist && item + ? `${window.location.origin}${episodeURL(seriesPlaylist, item.mediaid)}` + : window.location.href; return ( @@ -121,8 +131,12 @@ const Series = ({ - {item.tags.split(',').map(tag => )} - {seriesPlaylist && item ? : null} + {item.tags.split(',').map((tag) => ( + + ))} + {seriesPlaylist && item ? ( + + ) : null}