-
Notifications
You must be signed in to change notification settings - Fork 364
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
change: [M3-7182] - Update RemovableSelectionsList default maximum height to cut off the last list item #9827
Conversation
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@abailly-akamai thanks Alban! I'd checked with Andrew, and as of right now we do not plan to add the drop shadow. I'll update the internal ticket to make note of that! |
@coliu-akamai what was the reasoning? It's good to remember we may all have different experiences based on our browser settings |
It might be worth taking a screenshot with and without the shadow, and then showing it to Andrew. Personally, I do like how the shadow looks but I also have to see it in this application. |
@abailly-akamai let me double check, but iirc, we saw behavior with the drop shadow disappearing behind the list items in the marketplace apps when scrolling that was weird and potentially even made it worth revisiting the shadow there. However, I'm currently not seeing that on my browser (chrome) for marketplace and the lists, so I'll check with Andrew again and get back to you. edit: the weird behavior was on Safari @tyler-akamai @abailly-akamai I'm experimenting with the drop-shadow for the react list, below (if we go with the drop shadow, we may need to darken the color due to the background for this list being darker than the marketplace app's background -- currently using theme.color.boxShadow). Am also currently looking into a way to get the drop shadow to only show up if the list needs a scrollbar: |
@abailly-akamai to follow up on this, spoke with Andrew - it is Safari that has the weird behavior with box shadows (note how the market place apps are above the boxshadow when scrolling). Andrew noted that this may be how Safari treats boxshadows, and that it might be better to use a gradient instead --I'm going to look more into this issue soon. Regarding the box shadow on the RemovableSelectionsList - got the go ahead to add it for when the list actually needs to scroll (but otherwise hide it if we do not yet need to scroll the list). Just pushed up that change! |
@coliu-akamai great thanks for the update! i wonder if the safari bug has to do with a simple z-index issue. |
Thanks @tyler-akamai! Actually gonna make a few changes to make the drop shadow more dynamic, will lyk when those changes are pushed! |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Safari Marketplace UI is fixed, VPC changes look as described
Looks and works great, great job! |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Looks great! thanks for fixes.
confirmed max-height and dynamic list height logic ✅
Confirmed drop shadow fixes in both places ✅
Description 📝
some background
Preview 📷
How to test 🧪
Prerequisites
(How to setup test environment)
checkout this branch
yarn storybook --> RemovableSelectionsList
Marketplace fix: navigate to the marketplace apps on safari
Verification steps
For the removable selections list
for the Marketplace apps, verify that the drop shadow appears above the individual apps (it should now mirror chrome's behavior)
As an Author I have considered 🤔
Check all that apply