Theodoros Antoniou
@theo-anto.bsky.social
I create things on the web, mostly with CSS
It's been a while since I got this excited about new CSS features, but seeing all the amazing demos by @nerdy.dev just sparks joy.
Pure CSS Scroll Spy Table of contents - No JavaScript Required!
YouTube video by Kevin Powell
www.youtube.com
January 16, 2025 at 5:21 PM
It's been a while since I got this excited about new CSS features, but seeing all the amazing demos by @nerdy.dev just sparks joy.
As someone maintaining a UI library based on custom-elements, I can't believe the day when React finally adds proper support for custom elements, is here!
December 6, 2024 at 1:32 PM
As someone maintaining a UI library based on custom-elements, I can't believe the day when React finally adds proper support for custom elements, is here!
Did someone ask for simple, no-hack/no-js scroll shadows?
find some here!
know which side of a scroller is scrollable with CSS
another part of the scroll-state() spec
codepen.io/argyleink/pe...
know which side of a scroller is scrollable with CSS
another part of the scroll-state() spec
codepen.io/argyleink/pe...
December 5, 2024 at 3:52 PM
Did someone ask for simple, no-hack/no-js scroll shadows?
Reposted by Theodoros Antoniou
#CSS scroll-state() container queries:
the "stuck" query
```css
@container scroll-state(stuck: top) {
box-shadow: var(--shadow-5);
border-radius: var(--radius-3);
margin: var(--size-5);
}
```
article coming soon!
(currently in Canary experiments)
the "stuck" query
```css
@container scroll-state(stuck: top) {
box-shadow: var(--shadow-5);
border-radius: var(--radius-3);
margin: var(--size-5);
}
```
article coming soon!
(currently in Canary experiments)
December 5, 2024 at 12:55 AM
#CSS scroll-state() container queries:
the "stuck" query
```css
@container scroll-state(stuck: top) {
box-shadow: var(--shadow-5);
border-radius: var(--radius-3);
margin: var(--size-5);
}
```
article coming soon!
(currently in Canary experiments)
the "stuck" query
```css
@container scroll-state(stuck: top) {
box-shadow: var(--shadow-5);
border-radius: var(--radius-3);
margin: var(--size-5);
}
```
article coming soon!
(currently in Canary experiments)
🌈 Nyan Cat Scrollbar, originally developed by @surma.dev, and now reborn and working in both directions, with the help of Scroll Driven Animations! Check it out here: codepen.io/dogoku/pen/y...
🌈 Nyan Cat Scrollbar Reborn! (CSS Scroll Driven Animations)
A POC for creating a CSS only* fully custom scrollbar. The dream of having easy to implement and performant scrollbars is one I have had for many year...
codepen.io
December 5, 2024 at 2:37 AM
🌈 Nyan Cat Scrollbar, originally developed by @surma.dev, and now reborn and working in both directions, with the help of Scroll Driven Animations! Check it out here: codepen.io/dogoku/pen/y...