social-likes-nojq/gh-pages/tamia/modules/tooltip/index.styl

64 lines
997 B
Stylus

// Tâmia © 2013 Artem Sapegin http://sapegin.me
// Tooltip
// Bones
.tooltip,
.has-tooltip:before
position: relative
display: inline-block
text-decoration: none
white-space: nowrap
.tooltip:after,
.has-tooltip:before,
.has-tooltip:after
content: ""
position: absolute
left: 50%
transform: translateX(-50%)
.has-tooltip
position: relative
&:before
content: attr(data-tooltip);
&:before,
&:after
top: 100%
display: none
&:hover:before,
&:hover:after
display: block
// Default skin
modules_default_skin ?= true
tooltip_default_skin ?= false
if modules_default_skin or tooltip_default_skin
_tooltip_arrow = 5px
_tooltip_bg = black(0.9)
.tooltip,
.has-tooltip:before
padding: .2em .5em
background: _tooltip_bg
color: #fff
font-size: 14px
border-radius: form_border_radius
.tooltip:after,
.has-tooltip:after
triangle("up", _tooltip_arrow, _tooltip_bg)
.tooltip:after
top: (-(_tooltip_arrow))
.has-tooltip:before
margin-top: _tooltip_arrow