sindresorhus

Pure ESM package

The package that linked you here is now pure ESM. It cannot be require()'d from CommonJS.

This means you have the following choices:

1. Use ESM yourself. (preferred)
   Use import foo from 'foo' instead of const foo = require('foo') to import the package. You also need to put "type": "module" in your package.json and more. Follow the below guide.
2. If the package is used in an async context, you could use await import(…) from CommonJS instead of require(…).
3. Stay on the existing version of the package until you can move to ESM.

FradSer

The latest beta (3.5) includes separate color settings for light & dark mode. Toggling dark mode automatically switches colors.

Vist iTerm2 homepage or use brew install iterm2-beta to download the beta. Thanks @stefanwascoding.

---

1. Add switch_automatic.py to ~/Library/ApplicationSupport/iTerm2/Scripts/AutoLaunch with:

JoeyBurzynski

58 bytes of CSS to look great nearly everywhere

When making this website, i wanted a simple, reasonable way to make it look good on most displays. Not counting any minimization techniques, the following 58 bytes worked well for me:

main {
  max-width: 38rem;
  padding: 2rem;
  margin: auto;
}

jamesmacfie

How to use

In iTerm2, in the menu bar go to Scripts > Manage > New Python Script

Select Basic. Select Long-Running Daemon

Give the script a decent name (I chose auto_dark_mode.py)

Save and open the script in your editor of choice.

aparrish

unruthless

sub, sup {
  /* Specified in % so that the sup/sup is the
     right size relative to the surrounding text */
  font-size: 75%;

  /* Zero out the line-height so that it doesn't
     interfere with the positioning that follows */
  line-height: 0;

  /* Where the magic happens: makes all browsers position

bradwestfall

S3 Static Sites

⚠ This post is fairly old. I don't keep it up to date. Be sure to see comments where some people have posted updates

What this will cover

• Host a static website at S3
• Redirect www.website.com to website.com
• Website can be an SPA (requiring all requests to return index.html)
• Free AWS SSL certs
• Deployment with CDN invalidation

addyosmani

CSS Layout Debugger

A tweet-sized debugger for visualizing your CSS layouts. Outlines every DOM element on your page a random (valid) CSS hex color.

One-line version to paste in your DevTools

Use $$ if your browser aliases it:

~ 108 byte version

paulirish

Just jotting some notes on delivering webfonts performantly…

still an incomplete draft.

Any critical fonts must be requested asap.

Critical fonts are neccessary for the above-the-fold content to be useful. Identify which of the fonts you NEED for the first render, as they get very different treatment vs the others.

You want the network reqs for your critical fonts to start ASAP. ideally the @font-face req is in a style tag, following CRP guidelines

mikowl

// Inspired by https://twitter.com/coderitual/status/1112297299307384833 and https://tapajyoti-bose.medium.com/7-killer-one-liners-in-javascript-33db6798f5bf

//  Remove any duplicates from an array of primitives.
const unique = [...new Set(arr)]

// Sleep in async functions. Use: await sleep(2000).
const sleep = (ms) => (new Promise(resolve => setTimeout(resolve, ms)));
// or
const sleep = util.promisify(setTimeout);