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
// Example using multiple colors with SVG Sprites .. see it in an example with: | |
// $ git clone -b svg-inline-experiments --single-branch https://github.com/unicorn-ui/Buttons.git Buttons && cd Buttons && npm install && pushd svg-builder && npm install && grunt && popd && grunt dev | |
@mixin svgColors($fillColor: false, $color: false, $patchCurrentColorForIE: false) { | |
@if $fillColor { | |
fill: $fillColor; | |
} | |
@if $color { |
<!doctype html> | |
<html> | |
<head> | |
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> | |
<meta http-equiv="X-UA-Compatible" content="IE=Edge"> | |
<meta name="viewport" content="width=device-width, initial-scale=1"> | |
<style> | |
svg { width:50px; height:50px; } | |
svg > path, | |
svg > use { |
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.) |
#!/bin/bash | |
function create_dir { | |
if [ ! -d $1 ]; | |
then | |
mkdir $1 | |
fi | |
} | |
echo "create the src directory..." |
[user] | |
name = My Name | |
email = me@gradecam.com | |
[color] | |
branch = auto | |
status = auto | |
diff = auto | |
interactive = auto | |
[github] | |
user = robin |