LESS CSS Mixins

[Johnathan]

Hey, I’ve been looking for somewhere to find and share mixins I’ve made for use with LESS, thought I’d make this post and let people post theirs if they have any.
I’ll start off with an iPhone button..

Code:

@border-radius(@radius:5px){
border-radius:@radius;
-webkit-border-radius:@radius;
-moz-border-radius:@radius;
}

@iphone-button(@color){
width:63px;
height:33px;
background-color:@color;
background-image:-webkit-gradient(linear, 0% 49%, 0% 50%, from(rgba(255,255,255,0.45)), to(@color));
@border-radius(5px);
color:white;
font-size:12px;
border:none;
border:1px solid #3e3e3e;
}

You can pass in any colour and it will apply the shiny to it :)
I also included a simple border-radius Mixin that is used within my iPhone button.
The button in action with a red passed in..
[img]http://files.droplr.com.s3.amazonaws.com/files/14318719/1xdddc.Screen%20shot%202010-08-14%20at%2002%3A02%3A01.png[/img]

[Author]

Posts