A rather geeky/technical weblog, est. 2001, by Bramus
Highly interesting post by Manuel Matuzovic on Cascade Layers. Manuel skips out on the technical/theoretical details — which were already been covered by me, Stephanie, Una, … — and jumps straight into the practical side of things. While I’m writing this blog post, I’m looking at a large site I’ve been working on and I’m …
Continue reading “Cascade Layers: Practical Use-Cases / Examples”
A book on JavaScript by Axel Rauschmayer. This book makes JavaScript less challenging to learn for newcomers, by offering a modern view that is as consistent as possible. Covers all essential features of JavaScript, up to and including ES2022. You can read the entire contents online, or order PDF/EPUB/MOBI versions for $34 JavaScript for Impatient …
Continue reading “JavaScript for Impatient Programmers (ES2022 edition)”
This map shows all the blinking beacons from OpenStreetMap. More specifically, it asks the Overpass API for all elements with an seamark:light:sequence attribute, decodes these, and displays them as coloured circles on the map using Leaflet. It also tries to take the seamark:light:range and seamark:light:colour into account. The cool part is that the size and …
I recently enjoyed reading Hidde de Vries‘s post (that was a talk) on Semantics: One of the web’s killer features is that it comes with a language for shared semantics. When used right, HTML helps us build websites and apps that work for a broad range of users. Let’s look at what semantics are and …
Stephanie Eckles, writing for Smashing Magazine: Cascade layers introduce the new at-rule of @layer. The intent is to help CSS authors be more intentional about ordering the “layers” of CSS rules as a new method of cascade management. Getting Started With CSS Cascade Layers → If you’re looking for the quick version on Cascade Layers, …
The author of the Have I Been Pwnd website got a nasty surprise: an AU $5,000 bill from Azure (that eventually racked up to $11,000). The culprit: a sudden spike of outgoing bandwidth due to a file no longer being cached properly. I guess I’m looking at this a bit like the last time I …
Nixery is a Docker-compatible container registry that is capable of transparently building and serving container images using Nix. Images are built on-demand based on the image name. For example: docker pull http://nixery.dev/shell/git/htop The command above will give you an image with an interactive Shell, that also has git and htop installed. Keep adding more path …
In CSS, Specificity is expressed as a triad/triple (A,B,C). An example value would be (1,1,2). To compare specificity — i.e. to see which value has a higher specificity — you need to compare each component of the triple until you find a difference: function compareSpecificity(x, y) { // x and y being arrays such as …
In this video, Una digs into Cascade Layers: Quick show and tell on CSS cascade layers and the @layer property, coming to browsers in Chromium 99+ and Firefox 97+, plus they’re in the current Safari Tech Preview. The demo can be found on CodePen: https://codepen.io/web-dot-dev/pen/LYzqPEp Awaiting her post on the subject, you can check out …
@supports at-rule(@keyword)
Using the at-rule() function we’ll soon be able to detect support for at-rules and their descriptors.