krisolo/storyforge
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: declutter mobile bottom sheets

Browse Source
This commit is contained in:
kris
2026-03-30 13:01:56 +08:00
parent fd3d3c8ae5
commit 4242b40f5c
3 changed files with 19 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
web/storyforge-web-v4/assets/app.js
View File

@@ -850,11 +850,13 @@ function openAuthModal() {
const modal = document.querySelector(".auth-modal-backdrop");
if (!modal) return;
const session = appState.session;
document.body.classList.add("sheet-open", "auth-sheet-open");
modal.classList.remove("hidden");
setAuthField("backendUrl", session?.backendUrl || DEFAULT_BACKEND_URL);
}
function closeAuthModal() {
document.body.classList.remove("sheet-open", "auth-sheet-open");
document.querySelector(".auth-modal-backdrop")?.classList.add("hidden");
}
@@ -976,6 +978,7 @@ function openActionModal(config) {
submit.textContent = config.submitLabel || "执行";
submit.disabled = false;
submit.hidden = Boolean(config.hideSubmit);
document.body.classList.add("sheet-open", "action-sheet-open");
modal.classList.remove("hidden");
if (typeof config.onOpen === "function") {
config.onOpen({ modal, title, description, fields, message, submit });
@@ -984,6 +987,7 @@ function openActionModal(config) {
function closeActionModal() {
currentActionConfig = null;
document.body.classList.remove("sheet-open", "action-sheet-open");
document.querySelector(".action-modal-backdrop")?.classList.add("hidden");
}
@@ -1475,13 +1479,13 @@ function syncOneLinerRunPolling() {
function openOneLinerPanel() {
ensureOneLinerUi();
document.body.classList.add("oneliner-open");
document.body.classList.add("sheet-open", "oneliner-open");
document.querySelector(".oneliner-backdrop")?.classList.remove("hidden");
syncOneLinerRunPolling();
}
function closeOneLinerPanel() {
document.body.classList.remove("oneliner-open");
document.body.classList.remove("sheet-open", "oneliner-open");
document.querySelector(".oneliner-backdrop")?.classList.add("hidden");
clearOneLinerRunPollTimer();
}

6
web/storyforge-web-v4/assets/styles.css
View File

@@ -1264,6 +1264,12 @@ select {
transform: translateY(16px) scale(0.96);
}
.sheet-open .mobile-tabbar {
opacity: 0;
pointer-events: none;
transform: translateY(calc(100% + env(safe-area-inset-bottom)));
}
.oneliner-fab-mark {
width: 28px;
height: 28px;

9
web/storyforge-web-v4/tests/workbench-pages.test.mjs
View File

@@ -97,9 +97,14 @@ test("mobile shell removes duplicated desktop topbar and collapses the main agen
test("mobile action sheets and oneliner runtime behave like bottom sheets", () => {
assert.match(APP, /class="sheet-handle"/);
assert.match(APP, /document\.body\.classList\.add\("oneliner-open"\)/);
assert.match(APP, /document\.body\.classList\.remove\("oneliner-open"\)/);
assert.match(APP, /document\.body\.classList\.add\("sheet-open", "auth-sheet-open"\)/);
assert.match(APP, /document\.body\.classList\.remove\("sheet-open", "auth-sheet-open"\)/);
assert.match(APP, /document\.body\.classList\.add\("sheet-open", "action-sheet-open"\)/);
assert.match(APP, /document\.body\.classList\.remove\("sheet-open", "action-sheet-open"\)/);
assert.match(APP, /document\.body\.classList\.add\("sheet-open", "oneliner-open"\)/);
assert.match(APP, /document\.body\.classList\.remove\("sheet-open", "oneliner-open"\)/);
assert.match(CSS, /\.sheet-handle\s*\{/);
assert.match(CSS, /\.sheet-open \.mobile-tabbar\s*\{[\s\S]*opacity:\s*0/);
assert.match(CSS, /\.oneliner-open \.oneliner-fab\s*\{[\s\S]*opacity:\s*0/);
assert.match(CSS, /@media \(max-width: 760px\)[\s\S]*\.auth-modal,\s*[\s\S]*\.action-modal,\s*[\s\S]*\.oneliner-panel\s*\{[\s\S]*border-radius:\s*24px 24px 0 0/);
assert.match(CSS, /@media \(max-width: 760px\)[\s\S]*\.auth-actions\s*\{[\s\S]*position:\s*sticky/);