Skip to content
This repository has been archived by the owner. It is now read-only.
master
Switch branches/tags
Code

Latest commit

 

Git stats

Files

Permalink
Failed to load latest commit information.
Type
Name
Latest commit message
Commit time
lib
 
 
 
 
 
 

Catchup

Catchup is a small set of CSS3 and CSS 2.1 compatibility mixins for LESS. Use catch-up to polyfill features for older browsers and prevent code duplication by abstracting away vendor prefixes.

NOTE: This project is no longer being maintained. If you're interested in taking over maintenance of this repo, please contact me.

Using Catchup

Catchup can be @imported like any of your own LESS files. The library isn't useful by itself, there are no selectors exposed, you can just include css21.less and/or css3.less in your code to start using the mixins:

@import 'lib/css21';
@import 'lib/css3';

Each of the mixins has extensive documentation in the source code. Have a look at css21.less and css3.less. Some of the basics can be found below:

Border-Radius

One line border-radius for modern browsers:

.border-radius(10px);
.border-radius(10px 0 0 0);

Box-Shadow

One line box-shadow for modern browsers:

.box-shadow(0 0 10px #f00);

Multiple shadows supported:

@shadows: 0 0 10px #f00, inset 0 0 10px #0f0;
.box-shadow(@shadows);

Box-Sizing

One line box-sizing for modern browsers:

.box-sizing(border-box);

Inline-Block

Support display: inline-block; in IE6–7:

.inline-block();

Opacity

One line opacity for modern browsers and IE6+:

.opacity(.5);

Transition

One line transitions for modern browsers:

.transition(all .5s);

Multiple transitions supported:

@transitions: color .5s, font-size 1s;
.transition(@transitions);

Testing Catchup

Catchup is tested with HTML files in browser at the moment. In order to test, you'll need to compile the Catchup test LESS files into CSS. You'll need to install Node.js, npm and the LESS command line utility:

npm install -g less

Then you can run the following from within the project directory to compile the test CSS:

lessc test/catchup.less > test/catchup.css

Now you can open test/catchup.html in browser to make sure everything works.

License

Copyright 2012, Rowan Manning
Dual licensed under the MIT or GPL Version 2 licenses.

About

[UNMAINTAINED] Catchup is a small set of CSS3 and CSS 2.1 compatibility mixins for LESS.

Resources

Releases

No releases published

Packages

No packages published

Languages