Steven Spriggs
@stevenspriggs.bsky.social
Employed at Red Hat working with deign systems, web standards and Web Components. Skiing, hiking, climbing, and general outdoors enthusiast.
Anyone else having authentication issues on codepen? I keep getting dropped to a 500 error page after auth with GitHub oauth. /cc @chriscoyier.net Not sure if this is valid status downforeveryoneorjustme.com/codepen.io but showing down for me.
If you're dealing with SVG icons you probably know the pain of overwriting colors. There's a new spec in the making that allows controlling CSS variables from "the outside". And it's shipping in Firefox already! https://drafts.csswg.org...
daverupert.com/2026/06/fix-... Yo! I’ve have so many use cases for this. @davatron5000.bsky.social this is awesome. Runs off to apply this workaround in a couple of places…. 🏃
A workaround for hiding empty slots in Chromium
Named slots are one of web components’ biggest superpowers ✨. Imagine a Button component with an optional icon; in Web Components we don’t need a separate Button and IconButton, a single Button compon...
daverupert.com
Quick stop in at Shirley heights and tour of Nelson dockyard.
Curtain Bluff is an amazing resort in Antigua if you are ever looking for a nice getaway.
Happy Anniversary CSS! On 12 May 1998 CSS level 2 went to Rec. It's amazing how far the web and CSS has come in 28 years. Thank you to everyone who has contributed to CSS over the years! www.w3.org/Style/CSS/Ov... #WebStandards #WebDesign #CSS w3c.social/@w3c/1165617...
World Wide Web Consortium (@w3c@w3c.social)
Attached: 1 image Happy Anniversary CSS! On 12 May 1998 CSS level 2 went to Rec. It's amazing how far the web and CSS has come in 28 years. Thank you to everyone who has contributed to CSS over th...
w3c.social
I just noticed that @lit.dev crossed the 5M downloads/week mark on npm! 🎉 That's more than 2x in the last year, and 6x in the last three years 🚀
We must speak plainly about the agenda Elon Musk & other MAGA leaders are pushing. It’s white nationalism. There’s no room for Black, Hispanic/Latino, Asian, Native, Jewish or all other Americans in Musk’s monocultural vision. Multiculturalism is superior. We can’t allow Musk & others to end it.
border-shape can handle both insets and outsets, so you can do effects like this chevron nav (corner-shape can't do both). This means you get a perfectly-wrapping focus ring without needing to manage z-index or having it partially covered due to overlap. Demo: codepen.io/una/pen/ByzY...
Finally solving the tooltip arrow usecase with a new CSS property called border-shape ⚠️ WIP early-stage API, timeline TBD, more info coming soon But it brings a lil tear to my eye to see this working, border & all 🥲 This demo uses anchored container queries + border-shape + a little animation
Do you work with DTCG-formatted design tokens in CSS? Check out the recently improved Design Tokens Language Server: github.com/bennypowers/... by @bennypowers.dev.web.brid.gy Rewritten in Go for a 96.2% speed increase while using 89.4% less memory and 89.2% smaller binary. Happy coding!
Happy October! 🍁 Cotton grass at Dolly Sods Wilderness Area, West Virginia #landscape #nature #photography #art
Lit is joining @openjsf.org! 🎉 Today at JSConf, The OpenJS Foundation announced Lit is officially joining as an Impact Project! We're beyond excited for this move and look forward to continuing our work to build the open web with OpenJS! Read more on our blog: lit.dev/blog/2025-10...
Lit is Joining the OpenJS Foundation!
Lit is officially joining the OpenJS Foundation as an Impact Project!
lit.dev
Hot off the presses! Firefox Nightly (www.mozilla.org/en-GB/firefo...) adds the new :heading pseudo! Easily style all headings, or use nth-child-like AnB syntax to select a range of headings! Needs `layout.css.heading-selector.enabled` flag enabled. Try it out and let me know your thoughts.
Proposal to rename "dependencies" in package.json to "liabilities”. So the new structure would be: ``` { "liabilities": { "react": "^19.0.0", "typescript": "^5.0.0" }, "devLiabilities": {...} } ```
Proud papa today. Took my three year old skiing with his first lift ticket. He did amazing and had a blast. #blueski #ski #skiwv #timberlinemountain
Balancing building complex web components and the desire for progressive enhancement is hard. Hiding content from users until components load brings up ptsd memories of flash load screens.
With the update to chrome 131 and the stated styling improvements for details summary. developer.chrome.com/blog/new-in-... I can no longer use details as display contents in a grid. Works in chrome 130/ Firefox / Safari. codepen.io/zeroedin/pen... Introduced bug? @chromium.social
grid with display: contents child (chrome 131 bug?)
...
codepen.io
#tinyCSStip One thing that has always annoyed me about `:empty` is that it doesn't work for elements that have text content, but no element children. `:has()` fixes this problem. `:not(:has(*))` selects elements that don't have element children, even if they have text content.
The Proposal to bring Reactive Primitives to all of JS is now public: github.com/proposal-sig... Please have a read and provide feedback 🎉
GitHub - proposal-signals/proposal-signals: A proposal to add signals to JavaScript.
A proposal to add signals to JavaScript. Contribute to proposal-signals/proposal-signals development by creating an account on GitHub.
github.com
“the ‘grid’ the designers wield (those … light pink lines superimposed over a whitespace-rich design comp) is a different beast than the ‘grid’ that developers wield (which includes CSS Grid, Flexbox, and a slew of other modern CSS techniques).” - @bradfrost.bsky.social 🍻 I’m here for this
Layout & Grid in Design Systems
Simply saying the word "grid" conjures up strong and confusing feelings. Kinda like puberty! With so much history and so many different (and sometimes competing) paradigms, it's no wonder conversation...
bradfrost.com
Attempting to learn to use and configure neovim (again).
Been awhile since I checked back in on bluesky looks like more action. Might start cross posting from mastadon