Re: [csswg-drafts] [css-transforms][css-logical] Flow-relative Transforms (#1544)

Does anyone involved with the standardisation process know how this could be taken forward? It’s surprising to me that this issue has been opened for so long, and also heartening to see so much recent activity. With browser support for logical properties and values getting pretty good, I can only imagine lots more people will start to be looking for this for transforms too.

---

Sharing my personal flavour of a workaround in case it helps – essentially using the same technique as for [icons mirroring](https://rtlstyling.com/posts/rtl-styling#practical-examples):

```css
:root {
    --flow-direction: 1;
}

[dir="rtl"] {
    --flow-direction: -1;
}

.classname {
  transform: translateX(calc(var(--flow-direction) * 100%));
}
```

Bit verbose but makes it possible to use this `--flow-direction` custom property in all sorts of calculations, and override it per-component for pages displaying multiple languages.

-- 
GitHub Notification of comment by thibaudcolas
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/1544#issuecomment-1355245914 using your GitHub account


-- 
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config

Received on Friday, 16 December 2022 17:16:49 UTC