joshuabaker

Tailwind class autocomplete in object strings

Using Tailwind’s intellisense in VSCode and other IDEs, it’s possible to autocomplete classes in class, className, et al.

In some cases you want to introduce variants, which mean autocomplete is not available. To get around this, I use the following setup.

//                Add this to objects
//                ↓     ↓
const variants = /* tw */ {

joshuabaker

How to fix Cloudflare Worker unregister on macOS

[ERROR] Failed to unregister worker TypeError: fetch failed

I noticed that, from time to time, Wrangler worker instances get stuck and cannot be unregistered. Use the following command to force unregister.

kill -9 $(lsof -ti:6284)

joshuabaker

{
  "scripts": {
    "deploy-project-config": [
      "ssh {app-name}@deploy.eu2.frbit.com rm -rf config/project/*",
      "rsync -av ./config/project/* {app-name}@deploy.eu2.frbit.com:~/config/project",
      "ssh {app-name}@deploy.eu2.frbit.com php craft clear-caches/all",
      "ssh {app-name}@deploy.eu2.frbit.com php craft migrate/all",
      "ssh {app-name}@deploy.eu2.frbit.com php craft project-config/apply"
    ]
  }

joshuabaker

#!/bin/bash

echo "VERCEL_GIT_COMMIT_MESSAGE: $VERCEL_GIT_COMMIT_MESSAGE"

if [[ "$VERCEL_GIT_COMMIT_MESSAGE" == *"#nodeploy"* ]]; then
  # Don't build
  echo "🛑 - Build cancelled"
  exit 0;
else
  # Proceed with the build

joshuabaker

import { useTheme } from "@chakra-ui/react";
import { objectToArrayNotation } from "@chakra-ui/utils";

export default function useChakraResponsiveImageSizes(sizes) {
  const theme = useTheme();
  const details = theme.__breakpoints.details;

  if (!sizes) {
    return null;
  }

joshuabaker

.box {
  --radius: 3px;
  position: relative;
  width: 64px;
  height: 64px;
  background: linear-gradient(to bottom, green, gold);
  border-radius: var(--radius);
}

.box::after {

joshuabaker

#!/bin/sh

# Usage
#
#   chmod 755 http-status-codes.sh
#
#   cat list-of-urls.txt | xargs http-status-codes.sh

for arg in $@ ; do
  statusCode=`curl -I 2>/dev/null $arg | head -n 1 | awk '{print $2}'`

joshuabaker

import React from 'react'
import css from '@styled-system/css';
import PropTypes from 'prop-types';
import styled from 'styled-components';

function ${NAME}() {
  return <>
    {'${NAME}'}
  </>
}

joshuabaker

[
  {
    "code": "aa",
    "name": "Afar",
    "native": "Afar"
  },
  {
    "code": "ab",
    "name": "Abkhazian",
    "native": "Аҧсуа"

joshuabaker

{
  "name": "remove-focus-outline",
  "version": "1.0.0"
}