For a recent project we did at work I needed outlined text. Using text-shadow you can achieve the desired effect, but one must admit: it’s ugly. Some browsers however (Webkit) support the text-stroke property which gets a much nicer result. Here’s a demo pen: See the Pen CSS Transparent and Outlined Text by Bramus! (@bramus) …
Emoji Silhouettes and Emoji Outlines with CSS
From StackOverflow: It’s possible to include Emoji characters in modern browsers, but how can one make it a single color and choose that color? Using an (inset) text-shadow in combination with transparent text color this indeed is possible: With some more CSS – and an extra attribute – it’s possible to even achieve a (faux) …
Continue reading “Emoji Silhouettes and Emoji Outlines with CSS”
New CSS rotate syntax
In the CSS Transforms Module Level 2 there will be individual transform properties for translate, scale, and rotate. This pen by Wes Bos demonstrates the new rotate syntax (use Canary): See the Pen ALbmzN by Wes Bos (@wesbos) on CodePen. So how exactly is said syntax? Here’s a snippet from the spec: The rotate property …
9 Underutilized Features in CSS
List assembled by Jordan Little: The CSS calc() function The pointer media query The currentColor variable The :valid, :invalid, and :empty pseudoclasses Counters using only CSS Predictable tables with fixed layout Easy form states using adjacent sibling selectors Algebraic nth-child() selection Animating elements with animation-fill-mode As a tenth feature I’d like to add the use …
Electrode – Universal React and Node.js Application Platform
From the folks at Walmart: Electrode is a platform for building universal React/Node.js applications with standardized structure, best practices, and modern technologies baked in. It’s powering Walmart.com. And, now developers can use Electrode Platform as a whole or take its pieces, as appropriate. Electrode focuses on performance, component reusability, and simple deployment to multiple cloud …
Continue reading “Electrode – Universal React and Node.js Application Platform”
Beyond Console Debugging Tricks
ASCII to SVG
A bunch of handy Git aliases
Tim Pettersen, developer at Atlassian (BitBucket & JIRA): Git has a strong commitment to backwards compatibility: many powerful features are hidden behind options rather than exposed as default behaviour. Fortunately Git also supports aliases, so you can create your own commands that do all manner of Git magic. Here’s a selection of the more useful …
State of the Web
How it feels to learn Javascript in 2016
In the same style as the aforementioned “It’s the future!” — A fictional conversation on web development: … JSX? What is JSX? -JSX is just a JavaScript syntax extension that looks pretty much like XML. It’s kind of another way to describe the DOM, think of it as a better HTML. What’s wrong with HTML? …