More with LESS is a little LESS library that makes some complicated stuff pretty easy while providing cross-browser compatibility. Check out the live demo.
Requires LESS 1.1.1 or later, so make sure you have that installed first!
Import more-with-less.less into your own LESS file and call any of the mixins in the #mwl namespace. For example, to create an inset button (can be created on any inline or block element), you would write:
@import "css/more-with-less"
a.this-is-a-button { #mwl > #buttons > .inset-button(#666) };And apply it in HTML like this:
<a class="this-is-a-button" href="#">This is a button</a>That's it! The mixins handle everything from the basic, e.g. cross-browser border-radius, to the complex like determining if the base button color is dark or light and adjusting the other colors accordingly.
Copyright 2011 Jason Rosoff
Licensed under the Apache License, Version 2.0 (the "License"); you may not use these files except in compliance with the License. You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.