what3words is a really simple way to talk about location. We have divided the world into a grid of 3m x 3m squares and assigned each one a unique 3 word address. It means anyone can accurately find any location and share it more quickly, easily and with less ambiguity than any other system. The …
Category Archives: Elsewhere
CSS Grid: Floor Plan
Another CSS Grid Layout by Olivia NG. Be sure to check more CSS Grid Layouts in her CSS Grid Experiments collection on CodePen. Some nce CSS Grid: Floor Plan →CSS Grid Experiments Collection →
CraftQL – A drop-in GraphQL server for Craft CMS
CraftQL is a drop-in GraphQL server for your Craft CMS implementation. With zero configuration, CraftQL allows you to access all of Craft’s features through a familiar GraphQL interface. ❓ Unfamiliar with GraphQL? Earlier today Ryan Glover (Ponyfoo) posted a great introduction to it. In the admin interface you get a GraphiQL interface, and the ability …
Continue reading “CraftQL – A drop-in GraphQL server for Craft CMS”
Combining position: sticky; with overflow: scroll;
Figure: position: sticky; and overflow: scroll;, a quirky combination … but it can be fixed! Dannie Vinther: Say we want an overflowing table of columns and rows with sticky headings on a page. We want the headings to stick while scrolling on the document window, and we want to be able to scroll horizontally within …
Continue reading “Combining position: sticky; with overflow: scroll;“
Aladdin Trailer
Disney’s Aladdin (1992) is getting a live-action remake. Today the trailer got released: I was 9 when the original Aladdin came out. I can sing along to all of its songs by heart. So yeah, I’m quite the sucker for this re-make. The trailer looks quite promising so I’m starting to think that they won’t …
Browse the web like it’s 1990: CERN 2019 WorldWideWeb Rebuild
Figure: WorldWideWeb, with the homepage of bram.us loaded Today the web turned 30. Perfect time to mention that back in February a small team of people have worked on a rebuild of the original WorldWideWeb application – the world’s first browser – which was used to access the web back then. In December 1990, an …
Continue reading “Browse the web like it’s 1990: CERN 2019 WorldWideWeb Rebuild”
Using the <details> element to create modals and menus
The folks over at GitHub have been leveraging the <details> element to create modals and menus: <details class=“dropdown”> <summary class=“btn” aria-haspopup=“menu”>…</summary> <ul class=“dropdown-content”> <li><a href="/muan">profile</a></li> … </ul> </details> Very clever, as <details> trumps the <modal> element in many ways: Semantic Accessible No JavaScript Next to that, they’ve also released a few custom elements that make …
Continue reading “Using the <details> element to create modals and menus”
React Hook Flow Diagram
Donovon has created this nice flowchart that explains the new lifecycle of a Hooks component. Comes in handy 😉 hook-flow →
Making sense of React’s useEffect
Today Dan Abramov published an extensive deep dive into useEffect. The issue that many devs (who, including me, have been using componentDidMount before) are having, is that they now need to unlearn a few things It’s only after I stopped looking at the useEffect Hook through the prism of the familiar class lifecycle methods that …
JavaScript “loose” comparison, step by step
This handy tool visualizes loose comparison (==) in JavaScript works: Below you can provide two values to compare, and see which steps of the “Abstract Equality Algorithm” as defined in Section 7.2.14 of the ECMAScript specification are executed. JavaScript “loose” comparison, step by step → Related: Equality in JavaScript Javascript : The Curious Case of …
Continue reading “JavaScript “loose” comparison, step by step”