Zoom in plots #1592
Zoom in plots #1592
Conversation
| <div | ||
| className={styles.backdrop} | ||
| onClick={onClose} | ||
| role="none" |
There was a problem hiding this comment.
The reason for role="none" is that this isn't the main way to close the modal. I don't think adding a keyboard event would really be useful here.
There was a problem hiding this comment.
For me esc to close would be handy.
| .modal { | ||
| background-color: $bg-color; | ||
| position: relative; | ||
| border: 1px solid $fg-color; |
There was a problem hiding this comment.
[C] Personally I'm not a fan of this border. Could we have a shadow instead?
There was a problem hiding this comment.
I tried a light and focusBorder shadows and they both look terrible. On dark themes, dark shadows are not really visible and no borders make it hard to see what is the modal and what isn't. I also didn't want to have a border, but that's really the only thing that worked.
I'll try finding a different modal background colour and I think that later I'll create a story in Storybook that will show every colour from the CSS variables. I'll also load a few themes for references. That would make it easier to select colours in general and follow the theme better.
There was a problem hiding this comment.
Screen.Recording.2022-04-21.at.9.15.42.AM.mov
Not perfect in every theme, but I that is the best variable I found.
|
Code Climate has analyzed commit a8beda4 and detected 0 issues on this pull request. The test coverage on the diff in this pull request is 100.0% (85% is the threshold). This pull request will bring the total coverage in the repository to 96.8% (0.0% change). View more on Code Climate. |
Fixed. Didn't know the viewport just gets hidden when going too small. It will disappear when extremely small, but when the viewport is that small, you can't see anything else either. |
As mentioned in #1254
Screen.Recording.2022-04-20.at.10.50.12.AM.mov
I also tried adding the zoom to the comparison table, but the fact that it's an image, it's already most likely at its full size and seeing it take only 30% of the screen while zooming makes the zoom feel broken.