Skip to content

Instantly share code, notes, and snippets.

Avatar
🏕️
I’m trying to do my job, please respect my time and attention.

Brandon Pittman brandonpittman

🏕️
I’m trying to do my job, please respect my time and attention.
View GitHub Profile
@brandonpittman
brandonpittman / use-presence-with-tailwind.tsx
Last active May 17, 2022
`usePresence` with Tailwind animation utilities
View use-presence-with-tailwind.tsx
import { AnimatePresence, usePresence } from "framer-motion";
import { classNames } from "~/lib/utils/class-names";
import { useCounter } from "@kyleshevlin/use-common";
import { useCallback } from "react";
const Box = ({ count }: { count: number }) => {
const [isPresent, safeToRemove] = usePresence();
const onAnimationEnd = useCallback(() => {
if (!isPresent) safeToRemove();
View pending-link.js
@brandonpittman
brandonpittman / kit-google-translate.ts
Last active Nov 5, 2021
Translate selected text into with Google Translate.
View kit-google-translate.ts
// Menu: JA → EN
// Description: Translate selected text into with Google Translate.
// Author: Brandon Pittman
// Shortcut: ctrl j
import "@johnlindquist/kit";
const origin = "https://translate.google.com";
const text = await getSelectedText();
const sl = "ja";
View weeks.tsx
import clsx from 'clsx';
import { differenceInWeeks } from 'date-fns';
const fillIn = (complete: boolean) =>
clsx(
complete ? 'bg-gray-300' : 'bg-transparent',
'h-1.5 w-1.5 border border-gray-300 rounded-full'
);
const weekCount = differenceInWeeks(new Date(), new Date('8/31/1983'));
@brandonpittman
brandonpittman / tabata.cjs
Last active Jun 15, 2021
Script to announce Tabata intervals
View tabata.cjs
#!/usr/bin/env node
const os = require("os");
if (os.platform() !== "darwin") {
console.error("This script only works with macOS.");
process.exit(1);
}
const { spawn } = require("child_process");
View zxTest.mjs
await $`mkdir example`
await cd('example')
@brandonpittman
brandonpittman / withIcon.jsx
Created Mar 6, 2021
Icon Caching component
View withIcon.jsx
import * as React from 'react'
import hash from 'fnv1a'
export const IconCache = React.createContext({})
IconCache.displayName = 'IconCache'
export const useIconCache = () => React.useContext(IconCache)
const withIcon = (icon) => {
const Icon = (props) => {
const { size = 24, color = 'currentColor', ...propsWeDontControl } = props
const cache = useIconCache()
@brandonpittman
brandonpittman / dumb-angular-shit.md
Last active Jan 5, 2021
Super dumb, but this actually works
View dumb-angular-shit.md
@HostBinding('attr.id')
externalId = '';

@Input()
set id(value: string) {
  this.#id = value;
  this.externalId = null;
}
@brandonpittman
brandonpittman / preact-test.html
Created Jan 22, 2020
Preact standalone module test
View preact-test.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
@brandonpittman
brandonpittman / watermark.fish
Created Sep 4, 2019
Pass a glob into this function to quickly add a basic watermark of the filename
View watermark.fish
function watermark
for file in $argv
convert $file -font Arial -pointsize 20 -draw "gravity south fill black text 0,12 '$file' fill white text 1,11 '$file' " converted-$file
end
end