A tweet-sized debugger for visualizing your CSS layouts. Outlines every DOM element on your page a random (valid) CSS hex color.
One-line version to paste in your DevTools
Use $$
if your browser aliases it:
~ 108 byte version
#!/bin/bash | |
function create_dir { | |
if [ ! -d $1 ]; | |
then | |
mkdir $1 | |
fi | |
} | |
echo "create the src directory..." |
function remove_merged_git_branches { | |
# Following sed uses fact that current branch has a '*' in front of it | |
current_branch=$(git branch --no-color 2> /dev/null | sed -e '/^[^*]/d' -e 's/* \(.*\)/\1/') | |
if [ "$current_branch" != "master" ]; then | |
echo "WARNING: You are on branch $current_branch, NOT master." | |
fi | |
echo "Fetching merged branches..." | |
git remote prune origin | |
# Gets remove & local merged branches (but not master, nutmeg, sugar7, current branch, etc.) |
require 'fixjour' | |
require File.expand_path("./spec/spec_helpers/builders.rb") | |
include Fixjour | |
w = Workspace.find( YOUR_WORKSPACE_ID_HERE ) | |
60.times { |n| create_story(workspace: w, title: n) } |
Chris Gannon rocks at SVG animation. This is just me studying his stuff and a total buffoonery not to be taken seriously! Go look at Chris's original here: http://codepen.io/chrisgannon/pen/wKReBX as this is just a decomposition for me to figure out what the dude's doing cuz "imitation is the sincerest form of flattery" and all dat jazz :-)
If you're developing an application based on React it can be helpful if you don't need to develop all the basic UI components yourself. Here you can find a list with various components, component libraries and complete design systems developed with and for React.
Brands (official design systems by various companies and products)