Hotfix Regarding Override Button Block by Main Wrapper because of z-index value above the override button
Description
Hello guys, I want to report a finding that I found on Single-SPA playground, So I want to try how Single-SPA playground will guide me to see if my applications works (Actually I can successfully make it works on my local using Single-SPA Vue Example). here is the screenshot below
because of it, I want to know how it works on playground so I try to play around with it, but turns out, I got stuck when tried to verify it on Step 1 because it always told me that my applications failed because of my @vue-mf/styleguide
Curious about it, I see the text above which told me to try using the devtools on the bottom-right corner which is this one
but when I tried to click it, I always failed to do it, so I think maybe it only show and I need to enable it manually, so I tried to add devtools: true on my Local Storage like this
but it seems still failed, So I got curious and tried to inspect it, and turn out it seems the playground main wrapper using z-index and and it blocked the override button and make it can't be clicked
So when I tried to disabled it, it works and I can click it again to override my styles
Hotfix Regarding Override Button Block by Main Wrapper because of z-index value above the override button
Description
Hello guys, I want to report a finding that I found on Single-SPA playground, So I want to try how Single-SPA playground will guide me to see if my applications works (Actually I can successfully make it works on my local using Single-SPA Vue Example). here is the screenshot below
because of it, I want to know how it works on playground so I try to play around with it, but turns out, I got stuck when tried to verify it on Step 1 because it always told me that my applications failed because of my
@vue-mf/styleguideCurious about it, I see the text above which told me to try using the devtools on the bottom-right corner which is this one
but when I tried to click it, I always failed to do it, so I think maybe it only show and I need to enable it manually, so I tried to add
devtools: trueon my Local Storage like thisbut it seems still failed, So I got curious and tried to inspect it, and turn out it seems the playground main wrapper using
z-indexand and it blocked the override button and make it can't be clickedSo when I tried to disabled it, it works and I can click it again to override my styles
What Type of PR is This?
Bug Fix
Issue Card
https://github.com/single-spa/single-spa-playground/issues/61 - Failed to Override The the Style button because of the main application Z-Index above the button
Propose Solution
I think we can exclude the z-Index on the playground or at least adjust it so we can use this override button again
so if I stretched my screen it will looks like this
and my fix will make the overlay looks like this
in current production it will looks like this
now if the adjust approach is used, user can click it again