visnup

#!/bin/sh

url='https://twitter.com/izs/status/433464696289497088'
while [[ -n $url ]]; do
  echo $url
  url=$(curl -s $url | fgrep data-expanded-url | head -1 | sed 's/.*data-expanded-url="\([^"]*\).*/\1/')
done

visnup

/**
 * (C)Leanest CSS spinner ever
 */

@keyframes spin {
	to { transform: rotate(1turn); }
}

.progress {
	position: relative;

visnup

An iOS-friendly histogram of my motion activity on my phone. Meant to be used inside a UIWebView.

Open on a phone and scrub back and forth with your finger.

visnup

.loading {
	border-bottom: 6px solid rgba(0, 0, 0, .1);
	border-left: 6px solid rgba(0, 0, 0, .1);
	border-right: 6px solid rgba(0, 0, 0, .1);
	border-top: 6px solid rgba(0, 0, 0, .4);
	border-radius: 100%;
	height: 50px;
	width: 50px;
	animation: rot .6s infinite linear;
}

visnup

/**
 * The first commented line is your dabblet’s title
 */
p { margin: 0; }
ul { list-style-type: none; padding-left: 0; margin: .5em 0 }
li { display: inline-block; }
input { margin-left: 1.5em; }
li:first-child input { margin-left: 0 }
body { font-family: 'Avenir'; }

visnup

/**
 * The first commented line is your dabblet’s title
 */

background: #f06;
background: linear-gradient(45deg, #f06, yellow);
min-height: 100%;

visnup

div {
  background: url(http://2.bp.blogspot.com/-LzjJphrxhVQ/Tc-hZ0Dp6sI/AAAAAAAADbE/rYNM9tEJWg8/s1600/70-the-most-awesome-picture-ever-taken.jpg) center center no-repeat;
  width: 200px;
  height: 200px;
}

visnup

div.image {
  background: transparent center center no-repeat;
  background-size: auto 100%; 
  width: 200px;
  height: 200px;
}

visnup

<input type="text" pattern="\d*" />

visnup

<input type="text" name="fname" placeholder="First name" />
<input type="text" name="lname" placeholder="Last name" />
<input type="text" name="email" placeholder="Email" />