Gaël Poupard
Gaël Poupard
Thanks for the detailed answer, makes sense!
Some good read on [Jonathan Harrell's blog](https://www.jonathan-harrell.com/component-variants-scoped-css-variables/).
Also known as "Safe triangles", here's ["Better context menus using safe triangles" on Smashing Magazine](https://www.smashingmagazine.com/2023/08/better-context-menus-safe-triangles/).
Ahmad Shadeed came up with a brilliant and simple solution in his [Designing better target size post](https://ishadeed.com/article/target-size/#safe-triangle-target-areas).
Could be interesting along with [`hover` media query](https://developer.mozilla.org/en-US/docs/Web/CSS/@media/hover).
Is something like this a good idea: ```css :root { --gutter: 1em; } @media (pointer: coarse) { :root { --gutter: 1.5em; } } ``` Waiting for more sources and opinions...
Another resource, with a great example of increasing interactive elements size on `coarse` pointers: ["Potential use cases for script, hover and pointer CSS Level 4 Media Features" by Jordan Moore](http://jordanm.co.uk/2013/11/11/potential-use-cases-for-script-hover-and-pointer.html)...
It is, even more since you have content-only contributors who might drop bitmap images everywhere :D However keep in mind that it doesn't handle SVGs, so you'd still need something...
Just saw `.woff2` files arer already served, my bad. Keeping this opened to consider variable font though.
Have a look at [SNCF's Bootstrap fork, using FlatPickr](https://designmetier-bootstrap.sncf.fr/docs/4.3/components/picker/).