From mboxrd@z Thu Jan 1 00:00:00 1970 Return-Path: Received: from gate001.proxmox.com (gate001.proxmox.com [45.144.208.40]) by lore.proxmox.com (Postfix) with ESMTPS id 081311FF0DD for ; Thu, 22 Oct 2026 19:43:44 +0200 (CEST) Received: from gate001.proxmox.com (localhost.localdomain [127.0.0.1]) by gate001.proxmox.com (Proxmox) with ESMTP id A0774214F0; Thu, 22 Oct 2026 19:43:43 +0200 (CEST) From: Thomas Lamprecht To: yew-devel@lists.proxmox.com Subject: [PATCH yew-widget-toolkit-assets 0/3] material: 8px spacing, touch-sized controls Date: Thu, 22 Oct 2026 19:40:59 +0200 Message-ID: <20261022174334.2286071-1-t.lamprecht@proxmox.com> X-Mailer: git-send-email 2.47.3 MIME-Version: 1.0 Content-Transfer-Encoding: 8bit X-Bm-Milter-Handled: 55990f41-d878-4baa-be0a-ee34c49e34d2 X-Bm-Transport-Timestamp: 1792691019489 X-SPAM-LEVEL: Spam detection results: 0 AWL 0.517 Adjusted score from AWL reputation of From: address DMARC_MISSING 0.1 Missing DMARC policy KAM_DMARC_STATUS 0.01 Test Rule for DKIM or SPF Failure with Strict Alignment (newer systems) RCVD_IN_DNSWL_MED -2.3 Sender listed at https://www.dnswl.org/, medium trust SPF_HELO_NONE 0.001 SPF: HELO does not publish an SPF Record SPF_PASS -0.001 SPF: sender matches SPF record Message-ID-Hash: M6BY2GCLFHTHGRB2BEMEIZM3CAD4JTGY X-Message-ID-Hash: M6BY2GCLFHTHGRB2BEMEIZM3CAD4JTGY X-MailFrom: t.lamprecht@proxmox.com X-Mailman-Rule-Misses: dmarc-mitigation; no-senders; approved; loop; banned-address; emergency; member-moderation; nonmember-moderation; administrivia; implicit-dest; max-recipients; max-size; news-moderation; no-subject; digests; suspicious-header X-Mailman-Version: 3.3.10 Precedence: list List-Id: Yew framework devel list at Proxmox List-Help: List-Owner: List-Post: List-Subscribe: List-Unsubscribe: Our material theme's 10px spacer puts its steps at 10, 20, 30 and 40px, off the 8dp grid that Material Design aligns components to, and leaves a lot of room on desktops. Also, on phones, several controls are smaller than a finger hits reliably. This series lowers the Material default to 8px and keeps selected controls at 44px where the primary pointer is coarse. The last patch adds a root class that turns the touch sizes off, so an application can offer that choice next to the density. I checked it in Chromium with phone, tablet and desktop emulation in the PVE mobile GUI and the PMG quarantine GUI and some other internal UIs. FWICT, none of them needs changes but pages get about a fifth tighter (more content visible and usable), and on a phone buttons grow from 40px to 44px while list rows were already taller than that. Updating the precompiled CSS is not sent along as part of the series and needs a rebuild after applying, but that's purely mechanical. Thomas Lamprecht (3): material: give controls a fingertip-sized target on touch screens material: reduce default spacing to 8px material: let an application turn the touch-sized controls off scss/introduction.md | 8 +++ scss/material/_theme_config_material.scss | 7 +-- scss/material/_theme_post_material.scss | 74 +++++++++++++++++++++++ 3 files changed, 85 insertions(+), 4 deletions(-) -- 2.47.3