Software engineer with a special interest in accessibility. Builds for the web, mainly using React and Tailwind CSS nowadays. Currently @Rollstack, ex-@Wise.
- Tweets3.4K
- Following412
- Followers484
- Likes26.2K
-
Separating reusable styles and reusable behavior (e.g. headless components) makes it super flexible to apply the design system anywhere you need to. This makes it extensible to new use cases with much less complexity.
ALT Examples of a 16px target that doesn't pass AA conformity, while 24 passes for the AA 24px rule. Examples of a 24px target that doesn't pass AAA conformity, while 44 passes for the AAA 44px rule. Example of achieving conformity with spacing, by adding 4px to a 16 px square (which makes 24px in total) for the AA one, and 10 px spacing to a 24px square (which makes 44 px) for the AAA one. And en abstract wireframe of a small blue link in a paragraph of text that is WCAG conformant because of the inline exception, and a bigger button at the bottom of another paragraph that passes too for AA.
![Presentation held in a fancy theatre showcasing capabilities of the stage 3 Temporal API. Code snippet on the slide:
const departure = Temporal.ZonedDateTime.from('2024-06-28T11:55:00+08:00 [Asia/Hong_Kong]');
const flightTime = Temporal.Duration.from({ minutes: 775 });
const arrival = departure.add(flightTime).withTimeZone('Europe/Budapest');
arrival.toString(); // 2024-06-28T18:50:00+02:00[Europe/Budapest]](https://pbs.twimg.com/media/GREtjq0WEAA9HaA.jpg?name=orig)
ALT Presentation held in a fancy theatre showcasing capabilities of the stage 3 Temporal API. Code snippet on the slide: const departure = Temporal.ZonedDateTime.from('2024-06-28T11:55:00+08:00 [Asia/Hong_Kong]'); const flightTime = Temporal.Duration.from({ minutes: 775 }); const arrival = departure.add(flightTime).withTimeZone('Europe/Budapest'); arrival.toString(); // 2024-06-28T18:50:00+02:00[Europe/Budapest]
