| 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 |
\*****************************************************************************************************************************************************************************************************************************************************/ |
| 4 |
html[frame-adminify-iframe=true] { |
| 5 |
padding-top: 0 !important; |
| 6 |
} |
| 7 |
|
| 8 |
html[frame-adminify-iframe=true] #adminmenumain, |
| 9 |
html[frame-adminify-iframe=true] #wpadminbar { |
| 10 |
display: none !important; |
| 11 |
} |
| 12 |
|
| 13 |
html[frame-adminify-iframe=true] #wpcontent, |
| 14 |
html[frame-adminify-iframe=true] #wpfooter { |
| 15 |
margin-left: 0 !important; |
| 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 |
} |
| 72 |
|
