TIAN/matrix-screen-controller
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Improve Android app UI and controller flows

Browse Source
This commit is contained in:
TIAN
2026-10-09 16:43:58 +08:00
parent c0e26b97fe
commit 608229a497
90 changed files with 8103 additions and 1133 deletions
Download Patch File Download Diff File Expand all files Collapse all files
核桃派软件源代码/app/static/style.css
+36
View File
@@ -905,6 +905,28 @@ h3 {
display: none;
}
.board-expanded .pixel-grid { background-size: calc(100% / 192) calc(100% / 192); }
.layer-panel { margin-block: 1rem; padding-top: 1rem; border-top: 1px solid var(--border); }
.layer-actions { display: flex; flex-wrap: wrap; gap: .5rem; margin-block: .75rem; }
.layer-actions button { flex: 1 1 7rem; }
.layer-list { display: grid; gap: .4rem; max-height: 18rem; overflow: auto; }
.layer-item { text-align: left; overflow-wrap: anywhere; }
.layer-item[aria-pressed="true"] { border-color: #72E0C5; background: #163832; }
.layer-move-controls { display: grid; gap: .35rem; }
.layer-move-controls[hidden], #brush-layer-tools[hidden], #text-layer-tools[hidden] { display: none; }
.layer-move-controls label { display: flex; align-items: center; gap: .5rem; }
.layer-move-controls input { min-width: 0; width: 100%; }
.offset-steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: .2rem; }
.offset-steps button { padding: .2rem; text-align: center; }
.layer-copy-dialog { width: min(36rem, calc(100vw - 2rem)); max-height: 85dvh; overflow: auto; color: var(--text); background: var(--surface); border: 1px solid var(--border); border-radius: 1rem; padding: 1rem; box-shadow: var(--shadow); }
.layer-copy-dialog::backdrop { background: rgb(0 0 0 / 65%); }
.layer-copy-dialog select { width: 100%; }
#layer-copy-frame-list { display: grid; gap: .5rem; max-height: 45dvh; overflow: auto; }
#layer-copy-frame-list label { display: flex; align-items: center; gap: .6rem; min-width: 0; min-height: 44px; cursor: pointer; }
#layer-copy-frame-list label span { min-width: 0; overflow-wrap: anywhere; }
#layer-copy-frame-list input[type="checkbox"], .layer-background-toggle input[type="checkbox"] { flex: 0 0 20px; width: 20px; height: 20px; min-height: 20px; padding: 0; margin: 0; accent-color: var(--accent); cursor: pointer; }
body.canvas-edit-active[data-canvas-editor-mode="layer"] .board-stage { cursor: move; }
.canvas-coordinate-guide {
display: none;
pointer-events: none;
@@ -1028,6 +1050,8 @@ body.canvas-edit-active[data-canvas-editor-mode="move"] .board-stage:active {
position: absolute;
top: -28px;
left: 38px;
max-height: var(--assistive-menu-height, min(85dvh, calc(100dvh - 32px)));
overflow-y: auto;
display: grid;
width: min(14rem, calc(100vw - 88px));
gap: 8px;
@@ -1919,8 +1943,15 @@ textarea {
.canvas-toolbar .color-field {
margin-top: 0;
min-width: 0;
grid-template-columns: minmax(0, 1fr);
gap: 8px;
}
.canvas-color-heading { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 8px; min-height: 44px; }
.layer-background-toggle { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; cursor: pointer; }
.canvas-toolbar .color-trigger { width: 100%; min-width: 0; grid-template-columns: 34px minmax(0, 1fr); }
.segmented {
grid-column: 1 / -1;
grid-template-columns: repeat(2, minmax(0, 1fr));
@@ -3121,3 +3152,8 @@ noscript {
transition-duration: 0.01ms !important;
}
}
#actual-screen-frame { position:absolute; inset:0; z-index:4; border:2px solid #FFCC66; pointer-events:none; }
#actual-screen-frame[hidden] { display:none; }
#actual-screen-frame span { position:absolute; top:2px; left:3px; font-size:11px; color:#FFCC66; background:#000b; padding:2px; white-space:nowrap; }
.board-expanded #actual-screen-frame { inset:33.333333%; }