| @@ -1,7 +1,7 @@ | ||
| 1 | -/*!*****************************************************************************************************************************************************************************************************************************************************!*\ | |
| 2 | - !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[2].use[2]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[2].use[3]!./dev/scss/frames/_iframe.scss ***! | |
| 3 | - \*****************************************************************************************************************************************************************************************************************************************************/ | |
| 1 | +/*!*****************************************************************************************************************************************************************************************************************************************!*\ | |
| 2 | + !*** css ./node_modules/css-loader/dist/cjs.js??clonedRuleSet-3.use[1]!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-3.use[2]!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-3.use[3]!./dev/scss/frames/_iframe.scss ***! | |
| 3 | + \*****************************************************************************************************************************************************************************************************************************************/ | |
| 4 | 4 | html[frame-adminify-iframe=true] { |
| 5 | 5 | padding-top: 0 !important; |
| 6 | 6 | } |
| 7 | 7 | |
| @@ -13,59 +13,5 @@ | ||
| 13 | 13 | html[frame-adminify-iframe=true] #wpcontent, |
| 14 | 14 | html[frame-adminify-iframe=true] #wpfooter { |
| 15 | 15 | margin-left: 0 !important; |
| 16 | 16 | margin-right: 0 !important; |
| 17 | -} | |
| 18 | - | |
| 19 | -/** | |
| 20 | - * Pre-publish panel in the block editor on mobile - duplicate Publish button. | |
| 21 | - * | |
| 22 | - * Below 782px the panel is full-bleed and core anchors it at `top: 46px`, the | |
| 23 | - * height of the mobile admin bar, so it covers the editor header and its Publish | |
| 24 | - * button. Inside the Adminify frame the admin bar is hidden (above), the editor | |
| 25 | - * header moves up to the top of the iframe, and the panel's 46px gap leaves that | |
| 26 | - * header - Publish button and all - showing above the panel's own Cancel / | |
| 27 | - * Publish row. Anchor the panel to the top of the iframe so it covers the header | |
| 28 | - * the way it does in the default admin. | |
| 29 | - */ | |
| 30 | -@media (max-width: 781.98px) { | |
| 31 | - html[frame-adminify-iframe=true] .editor-post-publish-panel { | |
| 32 | - top: 0; | |
| 33 | - } | |
| 34 | -} | |
| 35 | -/** | |
| 36 | - * Media library popup on real mobile devices - breathing room at the bottom. | |
| 37 | - * | |
| 38 | - * WordPress renders the modal full-bleed below 640px and pins its toolbar flush | |
| 39 | - * to the modal's bottom edge, so the "Set featured image" / "Select" button ends | |
| 40 | - * up hard against the device edge - and on phones with a home indicator, partly | |
| 41 | - * under it. Lift the whole modal box instead of touching the toolbar, so the | |
| 42 | - * toolbar keeps the geometry core gives it (`.media-frame-toolbar` bottom 60px | |
| 43 | - * + `.media-toolbar` bottom -60px) and everything inside moves up together. | |
| 44 | - */ | |
| 45 | -@media screen and (max-width: 782px), screen and (max-height: 400px) { | |
| 46 | - html[frame-adminify-iframe=true] .media-modal, | |
| 47 | - html[frame-adminify-iframe=true] .image-details .media-modal { | |
| 48 | - bottom: calc(16px + env(safe-area-inset-bottom, 0px)); | |
| 49 | - } | |
| 50 | -} | |
| 51 | -/** | |
| 52 | - * Media library popup on real mobile devices - legacy browsers only. | |
| 53 | - * | |
| 54 | - * The shell sizes the iframe against the visible viewport (`100dvh`), so the | |
| 55 | - * media modal fits and its bottom toolbar - the "Set featured image" / "Select" | |
| 56 | - * button - is reachable. Browsers without `dvh` support (iOS < 15.4, | |
| 57 | - * Chrome < 108) fall back to `100vh`, which mobile browsers resolve against the | |
| 58 | - * LARGE viewport (URL bar hidden). There the iframe hangs below the visible | |
| 59 | - * area and takes the modal's toolbar with it. | |
| 60 | - * | |
| 61 | - * Shrink the modal by the Adminify topbar height for those browsers only, on | |
| 62 | - * top of the 16px gap above. | |
| 63 | - */ | |
| 64 | -@supports not (height: 100dvh) { | |
| 65 | - @media screen and (max-width: 782px), screen and (max-height: 400px) { | |
| 66 | - html[frame-adminify-iframe=true] .media-modal, | |
| 67 | - html[frame-adminify-iframe=true] .image-details .media-modal { | |
| 68 | - bottom: calc(72px + env(safe-area-inset-bottom, 0px)); | |
| 69 | - } | |
| 70 | - } | |
| 71 | 17 | } |
