qtip/stylus/theme.styl

pretty, mobile-friendly tooltips

$background = #fff
$color = #000
$shadow-color = rgba(0,0,0,.1)
$shadow = 0 1px 1px $shadow-color

#qtip
	background $background
	box-shadow $shadow
	color $color
	display block
	font-size 18px
	opacity 0
	padding 10px 14px
	-webkit-transition .2s linear
	-webkit-transition-property opacity, -webkit-transform

	&.visible
		opacity 1
		-webkit-animation Grow .3s

	// arrow
	&:before
		color $background
		text-shadow $shadow

@-webkit-keyframes Grow

	0%
		-webkit-transform scale(.7)

	40%
		-webkit-transform scale(1.2)

	70%
		-webkit-transform scale(.9)

	100%
		-webkit-transform scale(1)