suzanne.soy/shields
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add SVGO to the pipeline

Browse Source
This commit is contained in:
Mathias Bynens 2014-01-02 18:22:46 +01:00
parent eb6848f8c9
commit 2b99c27e8d
5 changed files with 32 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
.gitignore vendored Normal file
View File

@ -0,0 +1,14 @@
# Installed npm modules
node_modules
# Folder view configuration files
.DS_Store
Desktop.ini
# Thumbnail cache files
._*
Thumbs.db
# Files that might appear on external disks
.Spotlight-V100
.Trashes

2
build-passed.svg
View File

@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="77" height="19"> <linearGradient id="a" x2="0" y2="100%"> <stop offset="0" stop-color="#aaa"/> <stop offset=".1" stop-color="#666"/> <stop offset=".9" stop-color="#444"/> <stop offset="1" stop-color="#222"/> </linearGradient> <linearGradient id="b" x2="0" y2="100%"> <stop offset="0" stop-color="#8f6"/> <stop offset=".1" stop-color="#4c1"/> <stop offset=".9" stop-color="#3b0"/> <stop offset="1" stop-color="#370"/> </linearGradient> <filter id="shadow"> <feOffset dx="0" dy="1" in="SourceAlpha"/> <feColorMatrix type="matrix" values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 .3 0"/> <feMerge> <feMergeNode/> <feMergeNode in="SourceGraphic"/> </feMerge> </filter> <rect rx="4" width="77" height="18" fill="url(#a)"/> <rect rx="4" x="33" width="44" height="18" fill="url(#b)"/> <rect x="33" width="4" height="18" fill="url(#b)"/> <g fill="#fff" text-anchor="middle" font-family="Trebuchet MS, sans-serif" font-size="10"> <text x="16.5" y="12" filter="url(#shadow)">build</text> <text x="55" y="12" filter="url(#shadow)">passed</text> </g></svg>
<svg xmlns="http://www.w3.org/2000/svg" width="77" height="19"><linearGradient id="a" x2="0" y2="100%"><stop offset="0" stop-color="#aaa"/><stop offset=".1" stop-color="#666"/><stop offset=".9" stop-color="#444"/><stop offset="1" stop-color="#222"/></linearGradient><linearGradient id="b" x2="0" y2="100%"><stop offset="0" stop-color="#8f6"/><stop offset=".1" stop-color="#4c1"/><stop offset=".9" stop-color="#3b0"/><stop offset="1" stop-color="#370"/></linearGradient><filter id="c"><feOffset dy="1" in="SourceAlpha"/><feColorMatrix values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 .3 0"/><feMerge><feMergeNode/><feMergeNode in="SourceGraphic"/></feMerge></filter><rect rx="4" width="77" height="18" fill="url(#a)"/><rect rx="4" x="33" width="44" height="18" fill="url(#b)"/><rect x="33" width="4" height="18" fill="url(#b)"/><g fill="#fff" text-anchor="middle" font-family="Trebuchet MS, sans-serif" font-size="10"><text x="16.5" y="12" filter="url(#c)">build</text><text x="55" y="12" filter="url(#c)">passed</text></g></svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.1 KiB

After

Width:  |  Height:  |  Size: 1023 B

10
make.js
View File

@ -1,5 +1,6 @@
var fs = require('fs');
var dot = require('dot');
var SVGO = require('svgo');
var badges = require('./badges.json');
var template = fs.readFileSync('./template.svg');
var imageTemplate = dot.template(''+template);
@ -9,12 +10,21 @@ var imageTemplate = dot.template(''+template);
var imageSheet = './sheet.html';
var resultSheet = '';
function optimize(string, callback) {
var svgo = new SVGO();
svgo.optimize(string, callback);
}
function makeImage(name, data) {
var result = imageTemplate(data);
// Run the SVG through SVGO.
optimize(result, function(object) {
var result = object.data;
// Put this image on the sheet.
resultSheet += result;
// Write the image individually.
fs.writeFileSync(name + '.svg', result);
});
}
function buildImages() {

3
package.json
View File

@ -9,6 +9,7 @@
},
"license": "CC0",
"dependencies": {
"dot": ">=1.0.2"
"dot": ">=1.0.2",
"svgo": "~0.4.2"
}
}

2
sheet.html
View File

@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="77" height="19"> <linearGradient id="a" x2="0" y2="100%"> <stop offset="0" stop-color="#aaa"/> <stop offset=".1" stop-color="#666"/> <stop offset=".9" stop-color="#444"/> <stop offset="1" stop-color="#222"/> </linearGradient> <linearGradient id="b" x2="0" y2="100%"> <stop offset="0" stop-color="#8f6"/> <stop offset=".1" stop-color="#4c1"/> <stop offset=".9" stop-color="#3b0"/> <stop offset="1" stop-color="#370"/> </linearGradient> <filter id="shadow"> <feOffset dx="0" dy="1" in="SourceAlpha"/> <feColorMatrix type="matrix" values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 .3 0"/> <feMerge> <feMergeNode/> <feMergeNode in="SourceGraphic"/> </feMerge> </filter> <rect rx="4" width="77" height="18" fill="url(#a)"/> <rect rx="4" x="33" width="44" height="18" fill="url(#b)"/> <rect x="33" width="4" height="18" fill="url(#b)"/> <g fill="#fff" text-anchor="middle" font-family="Trebuchet MS, sans-serif" font-size="10"> <text x="16.5" y="12" filter="url(#shadow)">build</text> <text x="55" y="12" filter="url(#shadow)">passed</text> </g></svg>
<svg xmlns="http://www.w3.org/2000/svg" width="77" height="19"><linearGradient id="a" x2="0" y2="100%"><stop offset="0" stop-color="#aaa"/><stop offset=".1" stop-color="#666"/><stop offset=".9" stop-color="#444"/><stop offset="1" stop-color="#222"/></linearGradient><linearGradient id="b" x2="0" y2="100%"><stop offset="0" stop-color="#8f6"/><stop offset=".1" stop-color="#4c1"/><stop offset=".9" stop-color="#3b0"/><stop offset="1" stop-color="#370"/></linearGradient><filter id="c"><feOffset dy="1" in="SourceAlpha"/><feColorMatrix values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 .3 0"/><feMerge><feMergeNode/><feMergeNode in="SourceGraphic"/></feMerge></filter><rect rx="4" width="77" height="18" fill="url(#a)"/><rect rx="4" x="33" width="44" height="18" fill="url(#b)"/><rect x="33" width="4" height="18" fill="url(#b)"/><g fill="#fff" text-anchor="middle" font-family="Trebuchet MS, sans-serif" font-size="10"><text x="16.5" y="12" filter="url(#c)">build</text><text x="55" y="12" filter="url(#c)">passed</text></g></svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.1 KiB

After

Width:  |  Height:  |  Size: 1023 B