Zach Olivare 0livare

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.

If you use server rendering, keep in mind that neither useLayoutEffect nor useEffect can run until the JavaScript is downloaded.

You might see a warning if you try to useLayoutEffect on the server. Here's two common ways to fix it.

Option 1: Convert to useEffect

If this effect isn't important for first render (i.e. if the UI still looks valid before it runs), then useEffect instead.

function MyComponent() {

Algorithmic layouts

You are looking at the most important, and most abundant thing on the web. You can't see it, unfortunately, because it's very small… aaaaand it's invisible — so having a magnifying glass doesn't really help here. But still.

I'm talking, of course, about U+0020; not to be confused with the band U2, who are just as ubiquitous, but far less useful.

This unicode point, representing the humble space character, is between every word, in every run of text, on every page of the web. And it has a very special characteristic: it's not sticky like glue. If two words are neighbors but there's not enough room for both of them, the space will free the second word to wrap around and start a new line.

Before getting into flexible containers, viewport meta tags, and @media breakpoints this humble character is what makes the web fundamentally 'responsive'. That is: able to change the layout of its content to suit different devices, contexts, and settings. Browser text does this automa

	import {Action, ActionCreator, Dispatch} from 'redux';
	import {ThunkAction} from 'redux-thunk';

	// Redux action
	const reduxAction: ActionCreator<Action> = (text: string) => {
	return {
	type: SET_TEXT,
	text
	};
	};

	const randomColor = (() => {
	"use strict";

	const randomInt = (min, max) => {
	return Math.floor(Math.random() * (max - min + 1)) + min;
	};

	return () => {
	var h = randomInt(0, 360);
	var s = randomInt(42, 98);

	#!/bin/bash
	#
	# DESCRIPTION:
	#
	# Set the bash prompt according to:
	# * the active virtualenv
	# * the branch of the current git/mercurial repository
	# * the return value of the previous command
	# * the fact you just came from Windows and are used to having newlines in
	# your prompts.

	# Credit http://stackoverflow.com/a/2514279
	for branch in `git branch -r \| grep -v HEAD`;do echo -e `git show --format="%ai %ar by %an" $branch \| head -n 1` \\t$branch; done \| sort -r