openclaw/oikos
1
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases Wiki Activity

fix(ux): prevent iOS auto-zoom on inputs + lazy-load page CSS

Browse Source 
Increase font-size to 16px on mobile for shopping quick-add inputs,
notes search, and contacts search. Desktop breakpoint restores compact
sizes. Move 9 page-specific stylesheets from index.html to on-demand
loading in router.js, reducing initial CSS payload.
This commit is contained in:
Ulas
2026-04-04 06:39:45 +02:00
parent 70c1291ae7
commit 364d029950
7 changed files with 58 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/styles/contacts.css
+5 -1
View File
@@ -61,7 +61,7 @@
border: 1.5px solid var(--color-border);
background-color: var(--color-surface-2);
color: var(--color-text-primary);
font-size: var(--text-sm);
font-size: var(--text-md);
transition: border-color var(--transition-fast);
min-height: 36px;
}
@@ -72,6 +72,10 @@
background-color: var(--color-surface);
}
@media (min-width: 1024px) {
.contacts-toolbar__search-input { font-size: var(--text-sm); }
}
/* --------------------------------------------------------
* Kategorie-Filter (horizontal scroll)
* -------------------------------------------------------- */
public/styles/notes.css
+5 -1
View File
@@ -68,7 +68,7 @@
border-radius: var(--radius-md);
background: var(--color-surface);
color: var(--color-text);
font-size: var(--text-sm);
font-size: var(--text-md);
outline-offset: 2px;
}
@@ -77,6 +77,10 @@
border-color: transparent;
}
@media (min-width: 1024px) {
.notes-toolbar__search-input { font-size: var(--text-sm); }
}
/* --------------------------------------------------------
* Masonry-Grid
* -------------------------------------------------------- */
public/styles/shopping.css
+9 -3
View File
@@ -165,7 +165,7 @@
border: 1.5px solid var(--color-border);
background-color: var(--color-surface);
color: var(--color-text-primary);
font-size: var(--text-base);
font-size: var(--text-md);
transition: border-color var(--transition-fast);
min-height: 44px;
}
@@ -186,7 +186,7 @@
border: 1px solid var(--color-border);
background-color: var(--color-surface);
color: var(--color-text-primary);
font-size: var(--text-sm);
font-size: var(--text-md);
text-align: center;
min-height: auto;
height: auto;
@@ -206,7 +206,7 @@
border: 1.5px solid var(--color-border);
background-color: var(--color-surface);
color: var(--color-text-secondary);
font-size: var(--text-sm);
font-size: var(--text-md);
cursor: pointer;
min-height: 44px;
}
@@ -216,6 +216,12 @@
border-color: var(--color-accent);
}
@media (min-width: 1024px) {
.quick-add__input { font-size: var(--text-base); }
.quick-add__qty { font-size: var(--text-sm); }
.quick-add__cat { font-size: var(--text-sm); }
}
.quick-add__btn {
width: 44px;
height: 44px;