question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Sidebar: Fix positioning of popups (color/date picker, tooltips)

See original GitHub issue

Feature Description

Currently, we only have color/date pickers in the right column of the editor and their positioning is not flexible (they always open on the left side of the input), so with the new Sidebar on the left side, the color picker opens out of the viewport area, I’ve introduced a temporary fix so the picker is at least visible but we need to change the positioning a bit. It was discussed on Slack and it should look like this:

image

Date picker case is easier, just the anchor point needs to change, right now it’s top/right, should be top/left: image

https://github.com/GoogleForCreators/web-stories-wp/pull/10760#discussion_r818761362

PR should be based on/merged to the sidebar branch.

Alternatives Considered

Additional Context

Issue Analytics

  • State:closed
  • Created 2 years ago
  • Comments:7 (5 by maintainers)

github_iconTop GitHub Comments

2reactions
merapicommented, Mar 10, 2022

@merapi - can you confirm?

Yes, I’ve added a proper description that shows the correct positioning.

0reactions
BrookeGrahamcommented, Mar 15, 2022

Fixed via #10883

Read more comments on GitHub >

github_iconTop Results From Across the Web

Controlling tooltips & pop-up menus with components in React
1. Open the tooltip · isOpen is for mounting and unmounting the tooltip component/JSX markup and · style is for positioning the tooltip...
Read more >
Add smart/fixed positioning option for components with ...
Add smart/fixed positioning option for components with dropdowns/popups and for tooltips/popovers #4762. Open. 3 of 5 tasks.
Read more >
New in 2.4
CSS tooltips even support inversion and specified positioning. ... then hitting it again "Colorado", even without using a search selection dropdown.
Read more >
CSS sidebar with scrollbar with absolute tooltips
I'm really struggling with this one to wrap my head around, I have a sidebar that in one of the list items is...
Read more >
fomantic-ui/RELEASE-NOTES.md - UNPKG
28, - **Label** - Fixed image position/size in labels within menu items ... 160, - **Popup** - Add size and basic variation to...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found