Inventing weird CSS things.
CSSWG Member (previously: an invited expert).
Frontend engineer working on Datadog's design system.
Ask me about: #CSS, #Frontend, #DesignSystems
Located in France. He/him.
| Articles and Experiments | https://kizu.dev |
| Less polished blog | https://blog.kizu.dev |
| GitHub | https://github.com/kizu |
| Current Mood | Sleepy, thinking about a new article to write 🍵:blobcatmelt: |
Something tells me I won't finish that article I was writing (and kinda staled) this year. The technique itself is complete, but needs some polishing + I need to come up with some better examples and showcases, plus then do the write-up about how everything works.
Starting from the second half of next week I'll be on PTO for two weeks, so will be able to concentrate on finishing it, but not sure I'd want to release it in-between holidays.
Friday fun with the web.
I made this with MathML and CSS only 📏📐
Kids learn by having fun. Fun makes everything better.
As adult professionals, we tend to forget this and take ourselves too seriously sometimes.
Make something silly today! I guarantee you'll learn something along the way.
Request: a federated network, which is like cohost, but which not just allows inline styles, but `<style></style>`, contents of which could be automatically wrapped with `@scope{}` to apply only to the post itself.
I think the element-based `@scope` could potentially be a really nice way to introduce styling in various user-generated contexts in general.
Rendering 1000 elements unconditionally chained one after another (or maybe ~2000 elements including pseudos) took around 17 seconds on my m1 max.
When trying to render true 10k I tired of waiting and killed the tab.
Ok, I guess “conditionally” was the keyword: in fact while there were 10000 elements (actually… 30000 + another 20000 pseudos), it did not use the full chaining for all of them, only for initial ones, and the rest were still using anchor positioning, but falling back to one of the earlier items.
Testing the “full chaining, one after another” in my setup with the performance profiler, when the count reached ~100, long tasks started to appear, and layout time started increasing.
Are there any good ways to fix (or workaround) the #accessibility of the `.blur()` in Safari, where, compared to other browsers, it completely loses the context of the keyboard navigation for that element?
I guess, there is full non-interop with it, where Chrome seems to handle it the best (allows tab+shift-tabbing in both directions without landing on the blurring element), while Firefox only allows tabbing forwards.
Anyways, late pledges for Hubworld: Aidalon are open, and I can highly recommend it: https://gamefound.com/en/projects/earthborne-games/hubworld-aidalon/
It turns out to be a really great game, following the steps of Netrunner, but pretty different and unique. I always loved more position & tactics-based card games, and this one really scratches an itch.
Maybe I need to write a blog post about it, as there are just so many things that seem to be great: an attempt at sustainability, non-violent themes, the model (no random boosters), etc.
On the hubworld of Aidalon there is no problem that a fistful of shards can't solve. Build out your sphere of influence and race to keep your foothold through cunning and subterfuge in this sustainably produced, competitive, expandable card game for 2 – 4 players.
Jen Simmons
Patrick Brosset