Roma Komarov / is on Nostr

Frontend engineer working on Datadog's design system.

CSS is love.

Located in France. He/him.

Last Notes

2024-07-31 13:09:11

- reply

@npub16mu…qy4m Note: it is possible to get the width of the scrollbars in a much more simple and cross-browser way via container queries: https://github.com/w3c/csswg-drafts/issues/4691#issuecomment-1715388016

2024-07-31 13:05:35

What are your most wanted #CSS features that are already in the specs, but no browser cares to implement or at least prototype them?
I have too many of these, but the most recent things I wanted are the division with units like `calc(1em / 1px)`, custom properties in container queries, and `attr()` with ` <attr-type>`.

2024-07-21 10:32:10

Do you have any unsolved #CSS problems that you want to be eventually solved?
And what do you think is impossible, and we probably will never get?

2024-07-19 17:09:56

- reply

@npub16mu…qy4m https://kizu.dev/fit-to-width/ — I wonder how far off your idea is! :D

2024-07-19 07:22:27

Sometimes I wake up with an idea for an experiment, and sometimes I get some ideas when I go to bed.
Yesterday I just couldn't sleep because of it, so had to rush back to my setup from the bed, and test it.
It worked. An article incoming.

2024-06-19 10:16:41

New post: “Custom Properties and CSS-Wide Keywords”.
https://blog.kizu.dev/variables-and-css-wide-keywords/
I did some tests with custom properties in #CSS, and how they work (or don’t) with the CSS-Wide Keywords (`initial`, `inherit`, `unset`, `revert` and `revert-layer`).
As the result, I did create a PR adding a few Web Platform Tests, and opened two bugs in Safari and Firefox.

2024-06-18 12:04:56

A question for fellow #typography enthusiasts: let's say we want to have oldstyle numerals and small caps for abbreviations.
What do we do when either of those appears at the beginning of a sentence?
Do we make the first letter/digit “uppercase” by making it use the regular style, or do we undo those styles for the whole number/abbreviation?

2024-06-09 14:16:02

Can someone remind me why we don't have block-size containment?

2024-05-29 21:54:02

- reply

@npub16mu…qy4m Nope, page up + page down on the keyboard for the vertical movement :) Can do keyboard + trackpad in 4s when not using the trackpad for pre-positioning.

2024-05-29 21:32:55

- reply

@npub16mu…qy4m 5s. It needs to have a more precise timer :)
https://cdn.masto.host/frontendsocial/media_attachments/files/112/526/511/273/982/102/original/212b048c0e2beec6.mp4

2024-05-16 22:02:05

We really need to gather various #typography related #CSS properties that are scattered across different browsers without full support (or with just partial support) and make it into an #interop2025 focus area.
Like `ascent-override` (please, Safari!)
Or `font-size-adjust` (come on, Chrome!)
Or… `initial-letter` (hey, Firefox!), though, there are also so many `::first-letter` issues!
Or `text-box-trim` & `text-box-edge` (ok, these are only there in Safari TP)
And so on, and so forth.

2024-05-10 15:53:49

I really don't like the JS API of the view transitions, with the necessity to _wrap_ all the actions in the `startTransition`, rather than having an ability to manually mark the “before” and “after” points. Like, why don't we have an `endTransition` or something similar?

2024-05-09 13:03:52

Let's say I want to have a web component.
Whenever I use it, I would like to provide a custom callback to run in its context, defining it in HTML.
Is there an idiomatic way to do so? The way I'm thinking of is to use `currentScript`:
<my-element>
<script> document.currentScript.myCallback = () => console.log('Hey!');</script>
</my-element>
And then call this `myCallback` from inside the `connectedCallback`.
Is there anything better (apart from using a unique `id` for this)?