From a042f8342e438c6bece8fd88a2f99ee0d3c381b2 Mon Sep 17 00:00:00 2001 From: Mahmoud-zino Date: Fri, 23 Jun 2023 19:19:19 +0200 Subject: [PATCH 1/2] fixed scroll to top of modal --- .changeset/witty-pigs-wave.md | 5 +++++ packages/skeleton/src/lib/utilities/Modal/Modal.svelte | 4 ++-- 2 files changed, 7 insertions(+), 2 deletions(-) create mode 100644 .changeset/witty-pigs-wave.md diff --git a/.changeset/witty-pigs-wave.md b/.changeset/witty-pigs-wave.md new file mode 100644 index 000000000..b1826629b --- /dev/null +++ b/.changeset/witty-pigs-wave.md @@ -0,0 +1,5 @@ +--- +"@skeletonlabs/skeleton": patch +--- + +bugfix: fixed Scroll to the top of the modal, when the modal is bigger than the view. diff --git a/packages/skeleton/src/lib/utilities/Modal/Modal.svelte b/packages/skeleton/src/lib/utilities/Modal/Modal.svelte index 47d8cfda3..8386369e1 100644 --- a/packages/skeleton/src/lib/utilities/Modal/Modal.svelte +++ b/packages/skeleton/src/lib/utilities/Modal/Modal.svelte @@ -71,8 +71,8 @@ export let regionFooter: CssClasses = 'flex justify-end space-x-2'; // Base Styles - const cBackdrop = 'fixed top-0 left-0 right-0 bottom-0'; - const cTransitionLayer = 'w-full h-full p-4 overflow-y-auto flex justify-center'; + const cBackdrop = 'fixed top-0 left-0 right-0 bottom-0 overflow-y-auto'; + const cTransitionLayer = 'w-full h-fit min-h-full p-4 overflow-y-auto flex justify-center'; const cModal = 'block'; // max-h-full overflow-y-auto overflow-x-hidden const cModalImage = 'w-full h-auto'; From 1f00268504975ef8cbda581d4f744ef5c2e9952b Mon Sep 17 00:00:00 2001 From: Mahmoud-zino Date: Fri, 7 Jul 2023 19:34:44 +0200 Subject: [PATCH 2/2] added overflow for fullscreen modals --- packages/skeleton/src/lib/utilities/Modal/Modal.svelte | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/skeleton/src/lib/utilities/Modal/Modal.svelte b/packages/skeleton/src/lib/utilities/Modal/Modal.svelte index 59b7027e7..9a4da99a3 100644 --- a/packages/skeleton/src/lib/utilities/Modal/Modal.svelte +++ b/packages/skeleton/src/lib/utilities/Modal/Modal.svelte @@ -76,7 +76,7 @@ // Base Styles const cBackdrop = 'fixed top-0 left-0 right-0 bottom-0 overflow-y-auto'; const cTransitionLayer = 'w-full h-fit min-h-full p-4 overflow-y-auto flex justify-center'; - const cModal = 'block'; // max-h-full overflow-y-auto overflow-x-hidden + const cModal = 'block overflow-y-auto'; // max-h-full overflow-y-auto overflow-x-hidden const cModalImage = 'w-full h-auto'; // Local