Some Links on AI-Related Stuff
Every so often, I find that the links I save to read later fall into natural groups or patterns that reveal common threads of interest. The past couple of weeks have produced a lot of thoughts about ChatGPT, an AI-powered interface that responds to requests in a chat-like exchange. Sorta like a “Hey Siri” request, but in a Discord channel. ChatGPT is just one of several AI-flavored tech, including GitHub’s CoPilot (writing code) and Dall-E (generative images and art)..
Read more- 0 Comment
Unchain My Inaccessibly-Labelled Heart
Suzy Naschansky from the HTMHell Advent Calendar: <h2 id="article1-heading">All About Dragons</h2> <p>I like dragons. Blah blah blah blah blah.</p> <p> <a id="article1-read-more" aria-labelledby="article1-read-more article1-heading">Read more</a> </p> See that aria-labelledby attribute? It chains two IDs from the markup, one for the heading (#article1-heading) and one for the link (#article1-read-more). What happ..
Read more- 0 Comment
Holiday Snowtacular 2022
We’ve got ourselves a real holiday treat! Join host Alex Trost from the Frontend Horse community for the Holiday Snowtacular 2022 this Friday, December 16. There’s a lineup of 12 awesome speakers — including Chris Coyier, Cassidy Williams, Kevin Powell, and Angie Jones — each discussing various front-end and web dev topics. It’s like the 12 days of Christmas, but wrapped up in a four-hour session for web nerds like us. It’s a real good cause, too. The event ..
Read more- 0 Comment
A Few Times Container Size Queries Would Have Helped Me Out
CSS Container Queries are still gaining traction and many of us are getting our hands wet with them, even if it’s for little experiments or whatnot. They’ve got great, but not quite full, browser support — enough to justify using them in some projects, but maybe not to the extent where we might be tempted to start replacing media queries from past projects with shiny new container size queries. They sure are handy though! In fact, I’ve already run into a few situat..
Read more- 0 Comment
Setting up a screen reader testing environment on your computer
Sara Soueidan with everything you need, from what screen reading options are out there all the way to setting up virtual machines for them, installing them, and confguring keyboard options. It’s truly a one-stop reference that pulls together disparate tips for getting the most out of your screen reading accessibility testing. Thanks, Sara, for putting together this guide, and especially doing so while making no judgments or assumptions about what someone may or may not k..
Read more- 0 Comment
Saving Settings for a Custom WordPress Block in the Block Editor
We’ve accomplished a bunch of stuff in this series! We created a custom WordPress block that fetches data from an external API and renders it on the front end. Then we took that work and extended it so the data also renders directly in the WordPress block editor. After that, we created a settings UI for the block using components from the WordPress InspectorControls package. There’s one last bit for us to cover and that’s saving the settings options. If we recall fro..
Read more- 0 Comment
CSS Infinite Slider Flipping Through Polaroid Images
In the last article, we made a pretty cool little slider (or “carousel” if that’s what you prefer) that rotates in a circular direction. This time we are going to make one that flips through a stack of Polaroid images. CodePen Embed Fallback Cool right? Don’t look at the code quite yet because there’s a lot to unravel. Join me, will ya? CSS Sliders series Circular Rotating Image Slider Flipping Through Polaroid Images (you are here!) Infinite 3..
Read more- 0 Comment
Animated Background Stripes That Transition on Hover
How often to do you reach for the CSS background-size property? If you’re like me — and probably lots of other front-end folks — then it’s usually when you background-size: cover an image to fill the space of an entire element. Well, I was presented with an interesting challenge that required more advanced background sizing: background stripes that transition on hover. Check this out and hover it with your cursor: CodePen Embed Fallback There’s a lot mo..
Read more- 0 Comment
Adding Box Shadows to WordPress Blocks and Elements
I stumbled across this tweet from Ana Segota looking for a way to add a CSS box-shadow to a button’s hover state in WordPress in the theme.json file. Is it possible to add a box-shadow for the button on hover state in theme.json? #WordPress— Ana Segota (@Ana_Segota) November 1, 2022 She’s asking because theme.json is where WordPress wants us to start moving basic styles for block themes. Traditionally, we’d do any and all styling in style.css when working in a..
Read more- 0 Comment
CSS is OK, I guess.
Nothing but ear-to-ear smiles as I was watching this video from @quayjn on YouTube. (No actual name in the byline, though I think it’s Brian Katz if my paper trail is correct). The best is this Pen you can use to sing along… CodePen Embed Fallback The little song Una did for memorizing for JavaScript’s map(), filter(), and reduce()methods at the end of this article comes to mind for sure. To Shared Link — Permalink on CSS-Tricks CSS is OK, I guess. orig..
Read more- 0 Comment