Tailwind CSS static navbar with shadow on scroll for Vue applications

Tailwind is now a staple of my product building toolkit, and it fits so well with Vue/Nuxt, Tailwind and Firebase. For most of my projects I want that smooth shadow under the navbar - here's the code I use to achieve it. Extending makes sense if you're doing something multiple times over and over, like cards or alerts.