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.

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.

Musk advocates white monoculturalism

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...

Una Kravets@una.im · 7mo ago

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

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": {...} } ```

#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.

:empty {
	/* only selects elements without element children  
	 * and without any text content whatsoever, 
	 * including whitespace */
}

:not(:has(*)) {
	/* selects elements without element children, 
	 * even if they have any kind of text content */
}

“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