Enhancement: Add scrollable modal support for M3UFilters and M3UProfiles components to improve usability on mobile devices.

This commit is contained in:
SergeantPanda 2025-11-28 12:05:08 -06:00
parent 1d23ed3685
commit b791190e3b
3 changed files with 23 additions and 2 deletions

View file

@ -253,7 +253,16 @@ const M3UFilters = ({ playlist, isOpen, onClose }) => {
return (
<>
<Modal opened={isOpen} onClose={onClose} title="Filters" size="lg">
<Modal
opened={isOpen}
onClose={onClose}
title="Filters"
size="lg"
scrollAreaComponent={Modal.NativeScrollArea}
lockScroll={false}
withinPortal={true}
yOffset="2vh"
>
<Alert
icon={<Info size={16} />}
color="blue"

View file

@ -186,6 +186,10 @@ const M3UGroupFilter = ({ playlist = null, isOpen, onClose }) => {
title="M3U Group Filter & Auto Channel Sync"
size={1000}
styles={{ content: { '--mantine-color-body': '#27272A' } }}
scrollAreaComponent={Modal.NativeScrollArea}
lockScroll={false}
withinPortal={true}
yOffset="2vh"
>
<LoadingOverlay visible={isLoading} overlayBlur={2} />
<Stack>

View file

@ -192,7 +192,15 @@ const M3UProfiles = ({ playlist = null, isOpen, onClose }) => {
return (
<>
<Modal opened={isOpen} onClose={onClose} title="Profiles">
<Modal
opened={isOpen}
onClose={onClose}
title="Profiles"
scrollAreaComponent={Modal.NativeScrollArea}
lockScroll={false}
withinPortal={true}
yOffset="2vh"
>
{profilesArray
.sort((a, b) => {
// Always put default profile first