external-repos/squoosh
1
0
Fork 1
mirror of https://github.com/GoogleChromeLabs/squoosh.git synced 2025-11-17 19:19:47 +00:00
Code Issues Packages Projects Releases Wiki Activity

Hoist flyouts to <body>

Browse Source
This commit is contained in:
Jason Miller
2020-12-09 23:47:43 -05:00
parent 7de8fa9da3
commit a65bbdf811
5 changed files with 142 additions and 59 deletions
Download Patch File Download Diff File Expand all files Collapse all files

36
src/client/lazy-app/Compress/Flyout/style.css
View File

@@ -5,11 +5,9 @@
justify-items: center;
}
.wrap > aside:last-of-type {
.flyout {
display: inline-block;
position: absolute;
left: 0;
top: 100%;
position: fixed;
z-index: 100;
display: flex;
flex-wrap: nowrap;
@@ -25,44 +23,14 @@
display: none;
}
/* align to the right edge */
&[data-anchor*='right'] {
left: 100%;
}
/* open to the left */
&[data-direction*='left'] {
right: 0;
left: auto;
align-items: flex-end;
&[anchor*='right'] {
right: 100%;
}
}
/* align to the top edge */
&[data-anchor*='top'] {
top: 0;
}
/* open to the left */
&[data-direction*='up'] {
bottom: 100%;
top: auto;
flex-direction: column-reverse;
--flyout-offset-y: 20px;
&[data-anchor*='bottom'] {
bottom: 0;
}
}
/*
@media (min-width: 860px) {
flex-direction: column-reverse;
top: auto;
bottom: 100%;
}
*/
}
@keyframes menuOpen {