A Beautiful Site

A collection of thoughts about HTML, CSS, JavaScript, UX, a11y, web standards, and related things. Posts by Cory LaViska.

Prefers Reduced Motion

Written on

By now, most devs are familiar with the prefers-reduced-motion media query that tells whether or not a user prefers, well, reduced motion. You can use this to tone down (or turn off) transitions and animations in your stylesheet to accommodate users with vestibular motion disorders.

Finding the active element in a shadow root

Written on

You can get the focused element with document.activeElement but, if it's inside a shadow root, this will be the host element. This happens because of retargeting, but sometimes you might need access to the internal element that actually has focus.

Moving from Stencil to LitElement

Written on

Over the weekend, I finished migrating Shoelace from Stencil to LitElement. Even though consumers of the library won't see much of a difference, this was a major overhaul of Shoelace's internals.

SVG Repo

Written on

I stumbled upon a great resource for free SVGs. They're currently boasting over 300,000 images. Check it out over at SVG repo.

Archiving Postleaf

Written on

Postleaf — at least in its current form — has been discontinued. In the future, I'd like to bring it back as something different. Maybe an open source project. Maybe a SaaS product. I'm not sure at this point.

Getting localized month and day names in the browser

Written on

JavaScript has a well-supported date/time formatting API called Intl.DateTimeFormat. Here's a tip — you can use it to generate localized month and day names without the need for a language pack! This is super useful if you're building, say, a date picker or a calendar app.

Shoelace 2.0: a forward-thinking library of web components

Written on

I've been having a lot of fun with Stencil and web components lately. Back in January, I decided to use it to completely redesign Shoelace, an open source project I created a few years ago.

Cory's amazing dot paper

Written on

In a world where designers use Sketch, Photoshop, and other apps to create wireframes, I'm here in my corner holding this old fashioned pencil and a stack of dot paper.

A free HTML, CSS, and JavaScript beautifier

Written on

Ten years ago, I launched DirtyMarkup to clean up dirty code. It was a fun little tool, but its best feature was that it was easy to use and didn't have intrusive advertisements.

Let's Encrypt renews but browsers still seeing old/expired SSL certificate

Written on

This morning was frustrating. I recently upgraded my VPS from the deprecated letsencrypt client to the newer cerbot client and generated new certificates for all my personal domains. I thought everything was fine — until I kept seeing intermittent SSL errors.

Feeds available in Atom & JSON

Explore the archive for additional posts or press / to search.