Add mobile format toolbar, image picker and move-to dialog
- Markdown format commands shared by Ctrl+B/I/K and a toolbar above the soft keyboard on touch devices; bold and italic stack correctly - Fit the app to the visual viewport so the keyboard does not cover the caret or the toolbar - Insert images from the photo library or a file picker - Move notes and folders with a folder picker from the file tree menu or the command palette - Open the file tree menu with a long press on touch devices
This commit is contained in:
1 parent
eb63b14c8e
commit
91da6e116e
14 files changed
+565
-68
No files matched your search
@@ -0,0 +1,19 @@
|
||||
// 软键盘弹出时,iOS Safari 与新版 Android Chrome 只缩小可视区域、页面高度不变,
|
||||
// 编辑器底部(光标、键盘上方的工具条)会被键盘挡住。把应用高度设为可视区域的高度。
|
||||
// 双指缩放也会改变可视区域,缩放时不调整
|
||||
export function trackVisualViewport(onShrink: () => void) {
|
||||
const vv = window.visualViewport
|
||||
if (!vv) return
|
||||
let last = vv.height
|
||||
const update = () => {
|
||||
const height = vv.scale > 1.01 ? null : vv.height
|
||||
document.documentElement.style.setProperty('--rm-app-height', height === null ? '100%' : `${height}px`)
|
||||
// iOS 会把页面整体上推以露出输入位置,应用高度已经适配,推回原位
|
||||
if (height !== null && vv.offsetTop > 0) window.scrollTo(0, 0)
|
||||
if (height !== null && height < last) requestAnimationFrame(onShrink)
|
||||
last = vv.height
|
||||
}
|
||||
vv.addEventListener('resize', update)
|
||||
vv.addEventListener('scroll', update)
|
||||
update()
|
||||
}
|
||||
Reference in new issue
Block a user