Permalink
Switch branches/tags
Nothing to show
Find file Copy path
Fetching contributors…
Cannot retrieve contributors at this time
174 lines (137 sloc) 3.69 KB

Core API

add ( object )

Adds data for compilation.

api.add({
    body: { 
        padding: 0 
    }
});

import ( string | [string, string, ...] )

AbsurdJS supports importing of JavaScript, JSON, YAML and CSS files.

module.exports = function(api) {
    api.import(__dirname + '/config/sizes.js');
    api.import([
        __dirname + '/config/colors.js',
        __dirname + '/config/sizes.js'
    ]);
}

importCSS ( string )

Send a string containing valid CSS code.

module.exports = function(api) {
    api.importCSS('body { margin: 0; font-size: 20px; }');
}

storage ( key, value )

api.storage("mixin", function(px) { return { fontSize: px + 'px' } }); api.add({ body: [ api.storage("mixin")(18) ] });

plugin ( name of property, function )

The plugin's function accepts two arguments. The first one is a reference to the API and second one is the value of the CSS property.

api.plugin('my-custom-gradient', function(api, colors) {
    return {
        background: 'linear-gradient(to bottom, ' + colors.join(", ") + ')'
    };
});

darken ( color, percents )

api.add({
    body: {
        color: api.darken('#BADA55', 25)
    }
});

lighten ( color, percents )

api.add({
    body: {
        color: api.lighten('#BADA55', 25)
    }
});

raw ( string )

 api.raw('/* comment here */');

rawImport ( string | [string, string, ...] )

api.rawImport(['bootstrap-responsive.css', 'bootstrap.css']);

compile ( function, options )

api.compile(function(err, result) { // ... }, {}); { combineSelectors: true, minify: false, processor: [internal CSS preprocessor], keepCamelCase: false }

compileFile ( path to file, function, options )

Check compile method for details about the options.

api.compileFile("css/styles.css", function(err, result) {
	// ...
}, {});

hook ( method function )

If your hook handler returns true the default method behaviour is skipped.

api.hook("add", function(rules, stylesheet) {
	// write your logic here
	return true;
});

register ( method, function )

Create your own API function.

api.register("toJSON", function(callback) {
	// your custom code here
})

morph ( type )

type could be html, component, dynamic-css or jsonify. Check out HTML preprocessing for more information.

api.morph("html").add({ html: { head: { title: "AbsurdJS is awesome" } } }).compile(function(err, html) { // <html> // <head> // <title>AbsurdJS is awesome</title> // </head> // </html> }) api.morph("component").add({ css: { ".page": { display: 'block' } }, html: { 'section.page': { h2: "That's a page" } } }).compile(function(err, css, html) { /\* css = .page { display: block; } html = <section class=\"page\"> <h2>That's a page</h2> </section>" \*/ })