gfx
Version:
3D CSS3 animation library for jQuery
87 lines (73 loc) • 1.95 kB
text/less
/*
Less CSS3 utils.
*/
.border-radius(@r: 3px) {
-moz-border-radius: @r;
-webkit-border-radius: @r;
border-radius: @r;
}
/* Vertical Background Gradient */
.vbg-gradient(@fc: #FFF, @tc: #FFF) {
background: @fc;
background: -webkit-gradient(linear, left top, left bottom, from(@fc), to(@tc));
background: -moz-linear-gradient(top, @fc, @tc);
background: linear-gradient(top, @fc, @tc);
}
/* Horizontal Background Gradient */
.hbg-gradient(@fc: #FFF, @tc: #FFF) {
background: @fc;
background: -webkit-gradient(linear, left top, right top, from(@fc), to(@tc));
background: -moz-linear-gradient(left, @fc, @tc);
background: linear-gradient(left, @fc, @tc);
}
.box-shadow (@h: 0px, @v: 0px, @b: 4px, @c: #333) {
-moz-box-shadow: @h @v @b @c;
-webkit-box-shadow: @h @v @b @c;
box-shadow: @h @v @b @c;
}
.inset-box-shadow (@h: 0px, @v: 0px, @b: 4px, @c: #333) {
-moz-box-shadow: inset @h @v @b @c;
-webkit-box-shadow: inset @h @v @b @c;
box-shadow: inset @h @v @b @c;
}
.box-flex (@s: 0) {
-webkit-box-flex: @s;
-moz-box-flex: @s;
box-flex: @s;
}
.hbox () {
display: -webkit-box;
-webkit-box-orient: horizontal;
-webkit-box-align: stretch;
-webkit-box-pack: left;
display: -moz-box;
-moz-box-orient: horizontal;
-moz-box-align: stretch;
-moz-box-pack: left;
}
.vbox () {
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-box-align: stretch;
display: -moz-box;
-moz-box-orient: vertical;
-moz-box-align: stretch;
}
.border-box () {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.transition (@s: 0.3s, @o: opacity, @t: linear) {
-webkit-transition: @s @o @t;
-moz-transition: @s @o @t;
transition: @s @o @t;
}
.ellipsis () {
text-overflow: ellipsis;
overflow: hidden;
white-space:nowrap;
}
.inset-line(@opacity: 0.4, @size: 1px) {
.inset-box-shadow(0, @size, 0, rgba(255, 255, 255, @opacity);
}