Skip to content

Instantly share code, notes, and snippets.

Avatar

Merott Movahedi Merott

View GitHub Profile
@Merott
Merott / tailwind-maxwidth-breakpoints.js
Last active August 10, 2023 18:26
Automatically add corresponding max-width breakpoints for each existing breakpoint in Tailwind CSS
View tailwind-maxwidth-breakpoints.js
const defaultTheme = require('tailwindcss/defaultTheme')
const screens = { ...defaultTheme.screens }
// add max-width screens/breakpoints prefixed with `-`
for (let screen in screens) {
const size = screens[screen]
if (typeof size === 'string') {
screens[`-${screen}`] = { max: `calc(${size} - 1px)` }
}
@Merott
Merott / isObject.ts
Last active July 15, 2023 17:07
A TypeScript guard for object types, with an optional parameter to verify the shape of that object, specifying the properties and their corresponding types.
View isObject.ts
type BasicTypeMap = {
/* These are the types you might get with the `typeof` operator. */
'string': string,
'number': number,
'bigint': bigint,
'boolean': boolean,
'symbol': symbol,
'undefined': undefined,
'object': object,
'function': (...args: unknown[]) => unknown,
@Merott
Merott / migrate-stripe-subscriptions.ts
Last active July 7, 2023 19:58
A basic Node.js script for copying customer subscriptions from one Stripe account to another after a data migration.
View migrate-stripe-subscriptions.ts
import readline from 'readline'
import Stripe from 'stripe'
if (!process.env.STRIPE_SK || !process.env.STRIPE_OLD_SK) {
throw new Error('Must set STRIPE_SK and STRIPE_OLD_SK environment variables!')
}
const apiVersion = '2022-11-15'
export const stripeNew = new Stripe(process.env.STRIPE_SK, { apiVersion })
View keybase.md

Keybase proof

I hereby claim:

  • I am merott on github.
  • I am merott (https://keybase.io/merott) on keybase.
  • I have a public key ASD12uDpNrlfITUcUvpiUVYxz0EBe5E5h3_8B-WVQBKL_wo

To claim this, I am signing this object:

@Merott
Merott / micro-cors.ts
Created July 29, 2022 16:49
A partial port of fastify/fastify-cors to vercel/micro
View micro-cors.ts
// A partial port of fastify-cors:
// https://github.com/fastify/fastify-cors/blob/master/index.js
import type { RequestHandler } from 'micro'
import { send } from 'micro'
export interface MicroCorsOptions {
/**
* Configures the Access-Control-Allow-Origin CORS header.
*/
@Merott
Merott / tailwind-colors-as-css-variables.md
Last active September 9, 2023 22:06
Expose Tailwind colors as CSS custom properties (variables)
View tailwind-colors-as-css-variables.md

This is a simple Tailwind plugin to expose all of Tailwind's colors, including any custom ones, as custom css properties on the :root element.

There are a couple of main reasons this is helpful:

  • You can reference all of Tailwind's colors—including any custom ones you define—from handwritten CSS code.
  • You can define all of your colors within the Tailwind configuration, and access the final values programmatically, which isn't possible if you did it the other way around: referencing custom CSS variables (defined in CSS code) from your Tailwind config.

See the Tailwind Plugins for more info on plugins.