mn-angular-lib 1.0.104 → 1.0.106
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json
CHANGED
|
@@ -122,6 +122,11 @@
|
|
|
122
122
|
:host(.mobile-sheet) .modal-container {
|
|
123
123
|
width: 100%;
|
|
124
124
|
max-width: 100%;
|
|
125
|
+
/* Cap the sheet at 92vh. The soft keyboard OVERLAYS the lower part of the sheet rather
|
|
126
|
+
than lifting it (on iOS the WKWebView does not resize — Capacitor `resize: none` — so
|
|
127
|
+
there is nothing to lift into): the sheet stays anchored at the bottom and its inner
|
|
128
|
+
scroll area scrolls the focused field up above the keyboard (see the `.mn-keyboard-open`
|
|
129
|
+
growth rule below plus `scroll-padding-bottom` in the host app's styles.css). */
|
|
125
130
|
max-height: 92vh;
|
|
126
131
|
/* Keep the footer / last content clear of the iOS home indicator. The sheet
|
|
127
132
|
background extends into the inset so it reads as one continuous surface.
|
|
@@ -133,6 +138,20 @@
|
|
|
133
138
|
animation: slideUpIn 0.45s var(--mn-sheet-ease);
|
|
134
139
|
}
|
|
135
140
|
|
|
141
|
+
/* While the soft keyboard is open (the host app adds `.mn-keyboard-open` to <html> on iOS),
|
|
142
|
+
grow the sheet to the full capped height. The keyboard overlays the lower part, so a
|
|
143
|
+
SHORT form would otherwise sit entirely behind the keyboard with no room to scroll the
|
|
144
|
+
focused field into view — pinning the height to 92vh guarantees content above the keyboard
|
|
145
|
+
for the inner scroll (with its `--keyboard-height` scroll-padding) to reveal the field.
|
|
146
|
+
Read as a plain class/var, so the library keeps no dependency on Capacitor.
|
|
147
|
+
`!important` is required to beat the inline `[style.height]` the shell binds for FULL-size or
|
|
148
|
+
explicit `sizeHeight` sheets (an inline style otherwise always wins over a stylesheet rule,
|
|
149
|
+
leaving a short fixed-height sheet stuck behind the overlaying keyboard). A FULL (95vh) sheet
|
|
150
|
+
is capped to 92vh while the keyboard is open, which is fine. */
|
|
151
|
+
:host-context(.mn-keyboard-open).mobile-sheet .modal-container {
|
|
152
|
+
height: 92vh !important;
|
|
153
|
+
}
|
|
154
|
+
|
|
136
155
|
/* Override whichever anim-* open animation was selected */
|
|
137
156
|
:host(.mobile-sheet).anim-slide .modal-container,
|
|
138
157
|
:host(.mobile-sheet).anim-fade .modal-container,
|
|
@@ -163,6 +182,7 @@
|
|
|
163
182
|
short-circuits its close wait when reduced motion is requested.
|
|
164
183
|
========================= */
|
|
165
184
|
@media (prefers-reduced-motion: reduce) {
|
|
185
|
+
:host,
|
|
166
186
|
:host .modal-backdrop,
|
|
167
187
|
:host .modal-container {
|
|
168
188
|
animation-duration: 0.01ms !important;
|