fix(mobile): input bar non visibile - usare 100dvh
- #app usa 100dvh su mobile (viewport dinamico) - Input piu visibile anche se disabilitato (opacity 0.7) - Touch target 44px per input e bottone - flex-shrink:0 su btn-send - safe-area padding aumentato
This commit is contained in:
1 parent
54c9acb0d6
commit
8b6620cd3d
2 files changed
+57
-1
No files matched your search
Binary file not shown.
|
After Width: | Height: | Size: 43 KiB |
@@ -475,7 +475,7 @@ html, body {
|
||||
}
|
||||
#input-area input::placeholder { color: var(--text-muted); }
|
||||
#input-area input:disabled {
|
||||
opacity: 0.4;
|
||||
opacity: 0.7;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
#btn-send {
|
||||
@@ -663,6 +663,62 @@ html, body {
|
||||
#sidebar.open { left: 0; }
|
||||
#sidebar-backdrop.open { display: block; }
|
||||
|
||||
#app { flex-direction: column; height: 100dvh; }
|
||||
|
||||
#header {
|
||||
padding: 0 12px;
|
||||
gap: 10px;
|
||||
min-height: 48px;
|
||||
height: 48px;
|
||||
}
|
||||
#header h1 { font-size: 14px; letter-spacing: 1px; }
|
||||
#header .turn-badge { font-size: 11px; }
|
||||
|
||||
#main {
|
||||
width: 100%;
|
||||
min-height: 0;
|
||||
}
|
||||
|
||||
#chat {
|
||||
padding: 12px;
|
||||
gap: 10px;
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
#input-area {
|
||||
padding: 10px 12px;
|
||||
padding-bottom: max(12px, env(safe-area-inset-bottom));
|
||||
gap: 8px;
|
||||
}
|
||||
#input-area input {
|
||||
font-size: 16px;
|
||||
padding: 12px;
|
||||
min-height: 44px;
|
||||
}
|
||||
#btn-send {
|
||||
width: 44px;
|
||||
height: 44px;
|
||||
font-size: 20px;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
/* Welcome screen */
|
||||
#welcome h1 { font-size: 28px; }
|
||||
#welcome .subtitle { font-size: 14px; }
|
||||
.camp-list { max-width: 100%; padding: 0 12px; }
|
||||
#new-camp-form { width: 100%; max-width: 100%; padding: 0 12px; }
|
||||
|
||||
/* Sidebar content */
|
||||
.sidebar-section { padding: 10px 12px; }
|
||||
.sidebar-section h2 { font-size: 10px; }
|
||||
.char-name { font-size: 14px; }
|
||||
.stat-grid { gap: 3px; }
|
||||
.stat-row { font-size: 12px; }
|
||||
.area-item { font-size: 12px; }
|
||||
}
|
||||
#sidebar.open { left: 0; }
|
||||
#sidebar-backdrop.open { display: block; }
|
||||
|
||||
#app { flex-direction: column; }
|
||||
|
||||
#header {
|
||||
|
||||
Reference in new issue
Block a user