adaptive-pixel-perfect v0.5.9

Pixel perfect for multiple resolutions

Install

$ npm i adaptive-pixel-perfect --save-dev

Usage

 a_pp.start(port, designFolder, portForBrowserSync);

Use the plugin on port 3010 together with browserSync, (pre-create a design folder and add design images to it):

var a_pp = require('adaptive-pixel-perfect').create();
var browserSync = require('browser-sync').create();

var port = 3010;
var folderForDesignScreenshots = "design";
var portForBrowserSync = 3000;

browserSync.init({
    server: "./",
    cors: true,
    middleware: function (req, res, next) {
        res.setHeader('Access-Control-Allow-Origin', '*');
        next();
    },
    socket: {
        domain: 'localhost:' + portForBrowserSync
    },
    scriptPath: function (path, port, options) {
        return "http://" + options.getIn(['socket', 'domain']) + path;
    }
});

a_pp.start(port, folderForDesignScreenshots, portForBrowserSync);

The plugin will be available at http://localhost:3010/?a-pp=1

Supported key combinations

• left mouse button + 1 - 9, 0 (switch between resolutions)
• left mouse button + W, A, S, D (change the position of the iframe window)
• left mouse button + Z, X, C (site layout, site layout on top of the design, the design)
• Ctrl + R + move mouse (resize iframe)

Release Notes

###Sorry for the hacks and english

Licence

MIT

####Sorry for the hacks and english