neos-ui
neos-ui copied to clipboard
BUGFIX: Show resize icon on safari for document tree
What I did
Both resize icons for the left sidebar are now visible (functionality was always there only invisible)
Resolves: #3556
How I did it
Removed the background color from the tree component itself and instead set the background colours of the parent component that define the resize option.
How to verify it
Check in all browsers whether the resize icons all properly show up.
@crydotsnake can you give more details about your browser and version?
@crydotsnake can you give more details about your browser and version?
Safari Version 16.5.1
Ah thx, I can reproduce the issue when the window height is quite small. I will check. This fix doesn't make sense without fixing this too.
I could make the resize work in safari, but the Icons are still pretty small, and it is no good UX to resize the trees in Safari. In other browsers, it still works fine.
Ok, acceptance tests now also work :)
Will test again
I could make the resize work in safari, but the Icons are still pretty small, and it is no good UX to resize the trees in Safari. In other browsers, it still works fine.
But now the whole tree incl. the topbar scrolls? That's also wrong
So I tried a few things. The main problem is that Safari uses a higher z-index for the scrollbar of the page tree subcomponent than for the resize icon of the parent container and they overlap. I tried the trick from https://stackoverflow.com/questions/21684101/css-vertical-scrollbar-padding-left-right-in-ul-possible but that didn't work properly either.
What works is to add a padding to leftSideBar__top
which makes the icon work, but scrolling looks strange then... not sure if we can fix this without Safari being fixed 🤷🏻♂️
Hi whats the status on this one? We found out that the autoprefixer for safari wasn't working so maybe this is related?