Oh hey, my name is Levi.

Visually hidden snippet

There are several ways to hide content using CSS. For example using display: none, or visibility: hidden. Each way of hiding elements is useful in different situations, but this snippet is specifically for visually hiding elements while keeping the accessible to assistive technologies like screen readers.

.visually-hidden:not(:focus):not(:active) {
  clip: rect(0 0 0 0); 
  clip-path: inset(50%);
  height: 1px;
  overflow: hidden;
  position: absolute;
  white-space: nowrap; 
  width: 1px;
}

Scott O'Hara wrote about this in 2017 including a deep dive into all the different ways you can hide stuff and when to use which method. I'd definitely recommend checking out that article too.

Smaller Better Things

I watched this mini documentary about a French butter maker the other day that makes high-end butter with old techniques that very few places use anymore.

I really like this quote from the owner where he explains that he could make a lot more butter (and more money) if he using newer more automated techniques, but instead he prefers to focus on quality and do less—to make smaller things.

Me, I’m a little good man and I make little things.

I think about this concept a lot these days. The larger a project gets the quicker I find myself losing interest. It’s not that I fear hard work it’s that I just want to do smaller, better work.

Anyway, watch this video about making butter. It appears that it only exists as this Tweet. I couldn't find it on Insider site, so I've embedded it here. Enjoy!

Copyright Snippet

It's that time of year again, so I thought I'd do a quick post on the simple bit of JavaScript I use to keep the copyright date current in the static sites I build. Add the hidden attribute to your container element markup so that if JS fails for some reason it won't display.

class CopyrightElement extends HTMLElement {
  connectedCallback() {
    this.innerHTML = `© ${new Date().getFullYear()}`;
  }
}

if ('customElements' in window) {
  window.customElements.define('copyright-element', CopyrightElement);
}

As a bonus, here's a tiny custom element I made that does the same thing. This way you can just wrap your static text in a <copyright-element> tag and as long as the browser is capable and you scripts loaded, you get an upgraded, up-to-date footer copyright date.

(function() {
  document.addEventListener('DOMContentLoaded', function() {
    // Update this to whatever selector you want.
    const element = document.querySelector('[data-copyright]');
    if (element) {
      element.removeAttribute('hidden');
      element.innerHTML = `&copy; ${new Date().getFullYear()}`;
    }
  });
})();

We Are The Songwriters

The urge to create can feel like a struggle sometimes. Throw in feelings of isolation and hopelessness brought on by living through a global pandemic and trying to make something to put out into the world can seem impossible some days.

I recently discovered Nick Cave's The Red Hand Files via Austin Kleon's newsletter. I spent a few hours reading through a dozen or so posts. It gave me a real rush of emotion that I think I needed. The questions submitted through the site and his answers to them are heartbreaking, hilarious, and inspiring.

I found the answer to this one called "What do you do when the lyrics just aren’t coming?" very comforting in a lot of ways. This last line at the end put a lump in my throat.

We are all of these things — we are the songwriters.

If you do anything creative for fun, or for a living—and I tend to think lots of folks fall into at least one of those categories—I'd highly recommend giving it a read.

Working and Mourning

I’m not religious, but when I looked out my front window yesterday morning at the church across the street from my house I felt my heart sink a little when I saw a completely empty parking lot. It was Easter morning.

We're all mourning something right now. Losing the ability to see friends, of being able to shake a hand, to give a hug. The loss of freedom to do whatever we want. I'm really lucky that this virus hasn't directly touched my life, other than the being stuck in my house for weeks on end. None of my family or friends have contracted it and the town I live in has seen very few confirmed cases. And no deaths, yet.

It might seem weird when we look back one day at how we even cared about trying to keep building web pages when the world was such a mess.