Skip to content

Instantly share code, notes, and snippets.

@garand
garand / tokenVariant.ts
Last active January 28, 2022 18:24
Stitches Token Variant
export function tokenVariant<
T extends keyof typeof theme,
V extends keyof typeof theme[T],
K extends (value: V) => ReturnType<K>
>(type: T, variantCss: K) {
return Object.keys(theme[type]).reduce(
(acc, key) => ({
...acc,
[key]: variantCss(key as V),
}),
@garand
garand / PromiseLoader.ts
Last active January 20, 2022 15:00
Promise based DataLoader implementation for Remix
// ./server/index.js
createRequestHandler({
build,
mode: MODE,
getLoadContext() {
return {
loader: PromiseLoader(),
};
},
})(req, res, next);
@garand
garand / paramify.ts
Created May 17, 2021 19:56
Utility to convert object values to strings
/**
* Convert object of unknown value types to strings for use as request query params
*/
export function paramify<T>(
params?: T
): { [key in keyof T]: string } | undefined {
if (!params) return undefined;
return Object.fromEntries(
Object.entries(params).map((param) => [param[0], String(param[1])])
) as { [key in keyof T]: string };
@garand
garand / useSqPaymentForm.ts
Last active July 2, 2020 17:21
useSqPaymentForm React Hook
import { useState, useEffect, useRef, useCallback } from 'react'
import {
UseSqPaymentForm,
states,
SqResponseError,
SqCardData,
SqVerificationResult,
SqVerificationError,
SqInputEventData,
SqContact,
@garand
garand / gist:b83e63b2ea48e17195465a078611296b
Created February 8, 2017 20:38
Bash script to open the currently running Docker container that is using port 80
docker-open() {
open http://${(L)$(hostname -s)}.local:`docker inspect --format='{{(index (index .NetworkSettings.Ports "80/tcp") 0).HostPort}}' $(docker-compose ps -q)`
}
// Header Shrink
var header_element = $('body > header');
var header_height = header_element.outerHeight(); // Get the header height dynamically so it can be set with CSS
var header_offset = header_element.next().css('paddingTop').slice(0,-2) - header_height; // Find out the offset for the header to take into account any existing padding in the CSS
scaleHeader(); // Run once on page load so the header shrinks if the page loads already scrolled down
$(window).scroll(function() { scaleHeader(); });

Keybase proof

I hereby claim:

  • I am garand on github.
  • I am garand (https://keybase.io/garand) on keybase.
  • I have a public key whose fingerprint is 13C0 2C01 9880 B9E3 F0AD 1F85 BBDB 132B B212 A208

To claim this, I am signing this object: