function renderGallery () {
var tachyons = require('../package.json')
var css = fs.readFileSync('./css/tachyons.css', 'utf8')
var cssMin = fs.readFileSync('./css/tachyons.min.css', 'utf8')
var obj = cssstats(cssMin)
var size = filesize(obj.gzipSize)
var template = fs.readFileSync('./src/templates/gallery.html', 'utf8')
var head = fs.readFileSync('./src/templates/head.html', 'utf8')
var siteFooter = fs.readFileSync('./src/templates/footer.html', 'utf8')
var siteHeader = fs.readFileSync('./src/templates/header.html', 'utf8')
var tpl = _.template(template)
var html = tpl({
size: size,
version: tachyons.version,
siteFooter: siteFooter,
siteHeader: siteHeader,
head: head,
})
fs.writeFileSync('./gallery/index.html', html)
}
compile = function() {
var dir = path.join(__dirname, '../src/')
var dest = path.join(__dirname, '../css/')
var src = fs.readFileSync(dir + 'basscss.css', 'utf8')
var css = cssnext(src, {
features: {
customProperties: {
strict: false, // disable variable fallbacks from being redundantly added
},
rem: false,
pseudoElements: false,
colorRgba: false
}
})
css =
postcss()
.use(removeComments())
.use(removeRoot())
.process(css)
.css
var minified = new Cleancss({
advanced: false,
}).minify(css).styles
var stats = cssstats(css)
console.log('Size: ' + filesize(stats.size))
console.log('Gzipped: ' + filesize(stats.gzipSize))
console.log('Rules: ' + stats.rules.length)
console.log('Selectors: ' + stats.aggregates.selectors)
console.log('Declarations: ' + stats.aggregates.declarations)
css =
[
'/*',
'',
' Basscss v' + pkg.version,
' ' + pkg.description,
' http://basscss.com',
'',
' ' + filesize(stats.size),
' ' + filesize(stats.gzipSize) + ' Gzipped',
' ' + stats.rules.length + ' Rules',
' ' + stats.aggregates.selectors + ' Selectors',
' ' + stats.aggregates.declarations + ' Declarations',
' ' + stats.aggregates.properties.length + ' Properties',
'',
'*/',
'',
'',
css
].join('\n')
fs.writeFileSync(dest + 'basscss.css', css)
fs.writeFileSync(dest + 'basscss.min.css', minified)
console.log('Compiled to css/basscss.css and css/basscss.min.css')
}
cssFiles.forEach(function(file) {
try {
var css = fs.readFileSync(file, 'utf8')
var stats = cssstats(css)
fs.writeFileSync('cssstats/' + file.split('./css/')[1] + '.json', JSON.stringify(stats))
} catch(e) {
console.log(e)
}
})
}).then(function () {
frontMatter.stats = cssstats(frontMatter.componentCss)
// TODO: Update me once src/ uses the npm modules
frontMatter.modules = Object.keys(moduleSrcs).map(function (module) {
return 'tachyons-' + module.split('/_')[1].replace('.css', '')
})
var compiledPage = _.template(template)(frontMatter)
mkdirp.sync(newDir)
fs.writeFileSync(newFile, compiledPage)
})
module.exports = async function (req, res) {
try {
const url = normalizeUrl(req.url.replace('/?url=', ''))
const styles = await getInline(url)
const stats = cssstats(styles.map(style => `${style.tag} { ${style.style} }`).join(''))
res.setHeader('Access-Control-Allow-Origin', '*')
send(res, 200, stats)
} catch (e) {
send(res, 422)
}
}
}).then(function (result) {
console.log('component css selection complete for', component)
frontMatter.componentCss = result.css
frontMatter.stats = cssstats(frontMatter.componentCss)
// TODO: Update me once src/ uses the npm modules
frontMatter.modules = Object.keys(moduleSrcs).map(function (module) {
return 'tachyons-' + module.split('/_')[1].replace('.css', '')
})
var compiledPage = _.template(template)(frontMatter)
console.log('creating new dir', newDir)
mkdirp.sync(newDir)
fs.writeFileSync(newFile, compiledPage)
console.log('finished component build for', component)
}).catch(function (e) { console.log(e) })
}).then(function (result) {
if (cli.flags.generateDocs) {
const stats = cssstats(result.css)
const pkg = require(cli.flags.package)
const template = fs.readFileSync(__dirname + '/templates/readme.md', 'utf8')
const tpl = _.template(template)
let authors = `* [mrmrs](http://mrmrs.io)
* [johno](http://johnotander.com)
`
if (cli.flags.authors) {
authors = authorsToMd(pkg)
}
const srcMd = /^\/\*!!![\s\S]*?\*\/.*/.exec(input)
const defaultMd = `
# ${pkg.name} ${pkg.version}
${pkg.description}
`
const md = tpl({
stats,
authors,
module: pkg,
srcMd: dedent(srcMd && srcMd[0] || defaultMd).replace(/^\/\*!!!/, '').replace(/\*\/$/, ''),
srcCss: trailingLines(result.css)
})
console.log(trailingLines(md))
process.exit(0)
} else {
console.log(trailingLines(result.css))
process.exit(0)
}
})
module.exports = function(obj) {
var model = obj;
model.cssPretty = beautify(obj.css);
model.stats = cssstats(obj.css, {
safe: true
});
if (!model.stats) {
console.log('no stats');
}
model.totals = parseTotals(model.stats);
model.uniques = parseUniques(model.stats);
model.uniquesGraph = uniquesGraph(model.stats);
model.specificityGraph = model.stats.selectors.getSpecificityGraph();
model.rulesizeGraph = model.stats.rules.size.graph;
model.mediaQueries = _.uniq(model.stats.mediaQueries.values);
model.spacingResets = spacingResets(model.stats);
return model;
};
this.files.forEach(function (file) {
// Concat specified files.
var src = file.src.filter(function (filepath) {
// Warn on and remove invalid source files (if nonull was set).
if (!grunt.file.exists(filepath)) {
grunt.log.warn('Source file "' + filepath + '" not found.');
return false;
} else {
return true;
}
}).map(function (filepath) {
// Read file source.
return grunt.file.read(filepath);
});
// Write the destination file.
var results = cssstats(src.toString(), options);
var results = JSON.stringify(results, undefined, 2);
grunt.file.write(file.dest, results);
// Print a success message.
grunt.log.writeln('File "' + file.dest + '" created.');
});
var _ = require('lodash')
var fs = require('fs')
var gzip = require('gzip-size')
var filesize = require('filesize')
var cssstats = require('cssstats')
var module = require('tachyons-links/package.json')
var moduleCss = fs.readFileSync('node_modules/tachyons-links/css/tachyons-links.min.css', 'utf8')
var moduleObj = cssstats(moduleCss)
var moduleSize = filesize(moduleObj.gzipSize)
var moduleName = module.name
var srccss = fs.readFileSync('./src/css/_links.css', 'utf8')
var navDocs = fs.readFileSync('./src/templates/nav_docs.html', 'utf8')
var siteFooter = fs.readFileSync('./src/templates/footer.html', 'utf8')
var siteHeader = fs.readFileSync('./src/templates/header.html', 'utf8')
var head = fs.readFileSync('./src/templates/head.html', 'utf8')
var googleAnalytics = fs.readFileSync('./src/templates/ga.html', 'utf8')
var template = fs.readFileSync('./src/templates/docs/links/index.html', 'utf8')
var tpl = _.template(template)
var html = tpl({
moduleVersion: module.version,
moduleSize: moduleSize,
name: moduleName,
moduleObj: moduleObj,
srccss: srccss,
navDocs: navDocs,
siteFooter: siteFooter,
compile = function() {
var dir = path.join(__dirname, '../')
var dest = path.join(__dirname, '../css/')
var src = fs.readFileSync(dir + 'index.css', 'utf8')
var result =
postcss()
.use(cssnext({
features: {
customProperties: {
strict: false, // disable variable fallbacks from being redundantly added
},
rem: false,
pseudoElements: false,
colorRgba: false
}
}))
.use(removeComments())
.use(cssstats())
.use(autoprefixer())
.use(nested())
.use(packer())
.use(mover())
.use(reporter())
.process(src)
var css = result.css
var minified = new Cleancss({
advanced: true,
}).minify(css).styles
var stats = result.messages.filter(function (message) {
return message.stats
})
.map(function (message) {
return message.stats
})[0]
console.log('Size: ' + filesize(stats.size))
console.log('Gzipped: ' + filesize(stats.gzipSize))
console.log('Rules: ' + stats.rules.total)
console.log('Selectors: ' + stats.selectors.total)
console.log('Declarations: ' + stats.declarations.total)
css =
[
'/*',
'',
' Utility OpenType v' + pkg.version,
' ' + pkg.description,
' ' + pkg.homepage,
'',
'*/',
'',
'',
css
].join('\n')
fs.writeFileSync(dest + pkg.name + '.css', css)
fs.writeFileSync(dest + pkg.name + '.min.css', minified)
console.log('Compiled to css/' + pkg.name + '.css and css/' + pkg.name + '.min.css')
}
setUp: function(done) {
this.testCss = grunt.file.read('test/fixtures/test.css');
this.cssJson = cssStats(this.testCss);
done();
},
Object.keys(stylesheets).map(function(key) {
var css = stylesheets[key];
var stats = cssstats(css);
fs.writeFileSync(path.join(__dirname, './visual/' + key + '.css'), css);
fs.writeFileSync(path.join(__dirname, './visual/' + key + '-stats.json'), JSON.stringify(stats.aggregates, null, 2));
});
assert.doesNotThrow(function() {
stats = cssstats(css, { safe: false })
})
assert.doesNotThrow(function() {
stats = cssstats(css)
})
(done) => {
let css = fs.readFileSync(paths.buildDist(CSS_PATH), 'utf8');
let stats = cssstats(css);
done(null, formatStats(stats));
}
function compile() {
var src = fs.readFileSync(path.join(__dirname, 'base.css'), 'utf8');
var dest = path.join(__dirname, '/');
var result =
postcss()
.use(importCSS())
.use(cssnext({
features: {
customProperties: {
strict: false // disable variable fallbacks from being redundantly added
},
rem: false,
pseudoElements: false,
colorRgba: false
}
}))
.use(removeComments({ removeAll: true }))
.use(removeRoot())
.use(selectorPrefix('.pgp'))
.use(cssstats())
.use(reporter())
.process(src)
var css = result.css
var minified = new Cleancss({
advanced: false,
}).minify(css).styles
var stats = result.messages.filter(function (message) {
return message.stats
})
.map(function (message) {
return message.stats
})[0]
console.log('Size: ' + filesize(stats.size))
console.log('Gzipped: ' + filesize(stats.gzipSize))
console.log('Rules: ' + stats.rules.total)
console.log('Selectors: ' + stats.selectors.total)
console.log('Declarations: ' + stats.declarations.total)
css =
[
'/*',
'',
' Basscss for cypher',
' http://basscss.com',
'',
' ' + filesize(stats.size),
' ' + filesize(stats.gzipSize) + ' Gzipped',
' ' + stats.rules.total + ' Rules',
' ' + stats.selectors.total + ' Selectors',
' ' + stats.declarations.total + ' Declarations',
' ' + Object.keys(stats.declarations.properties).length + ' Properties',
'',
'*/',
'',
'',
css
].join('\n')
fs.writeFileSync(dest + 'compiled.css', css)
fs.writeFileSync(dest + 'compiled.min.css', minified)
console.log('Compiled to compiled.css and compiled.min.css')
}