Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Browse files

Lighter bin script using helpers and main steps module

  • Loading branch information...
commit cbc602d5484cbbed2199a72b27d1f52d2709dd1e 1 parent f53d4ec
Mickael Daniel authored
Showing with 31 additions and 126 deletions.
  1. +6 −101 bin/datauri
  2. +12 −12 examples/example-datauri.css
  3. +13 −13 examples/example.css
107 bin/datauri
View
@@ -3,7 +3,8 @@
var fs = require('fs'),
path = require('path'),
mime = require('mime'),
- spawn = require('child_process').spawn
+ spawn = require('child_process').spawn,
+ datauri = require('../lib/datauri');
// Monolithic script, first try and experiment at trying
// to automate the embedding of images in CSS files.
@@ -30,117 +31,21 @@ var fs = require('fs'),
var files = process.argv.slice(2);
-// This is non-sense, but mhtml have to use absolute path to the css files
-var config = {
- host: 'http://example.com'
-};
-
// before running anything, check if the first argument is 'help' or not. If it is, output man page.
if(files[0] === 'help') return help();
// first iterate over css files, get hash obj with filepath/content
-var css = files.map(function(file) {
- return {
- file: path.resolve(file),
- content: fs.readFileSync(path.resolve(file), 'utf8')
- };
-});
+var css = files.map(datauri.cssMap);
// first iteration, this time we'll generate mhtml equivalent
// and try to automatically add rules for `.ie6`, `.ie7` placeholder
-css.forEach(function(it) {
-
- // only work with single line declaration, eg.
- //
- // #book_go { background: url(../images/embed/book_go.png); }
- //
- it.content = it.content.replace(/(.+)\{(.+url\(.+\).+)\}/gm, function(w, selector, block) {
-
- var ieholder = [
- '.ie6 :selector, .ie7 :selector {'.replace(/:selector/g, selector.trim()),
- block.replace(/url\((.+)\)/, function(w, url) {
- // first pass, simply putting a marker, this is non valid
- // mhtml syntax. Will be replaced properly on next step
- return 'mhtml(' + url + ')';
- }),
- '}',
- ''
- ].join('\n');
-
- return w + '\n' + ieholder;
- });
-
-});
+css.forEach(datauri.cssEach);
// then, iterate over styles and replace inline references,
// also builds up the mhtml front comments.
-css.forEach(function(it) {
- var file = it.file,
- shortpath = it.file.replace(process.cwd(), ''),
- boundary = 'fooooobar',
- mhtml = ['Content-Type: multipart/related; boudary="' + boundary + '"\n\n'];
-
- // deal with datauris, replace inline url() by their base64 equivalent
- it.content = it.content.replace(/url\((.+)\)/g, function(w, url) {
- var cssfold = file.split('/').slice(0, -1).join('/'),
- imgpath = path.resolve(cssfold, url),
- base64 = toBase64(imgpath),
- mhtmlPart = [
- '--' + boundary,
- 'Content-Location:' + url.split('/').slice(-1).join('/'),
- 'Content-Transfer-Encoding:base64',
- '',
- base64,
- ''
- ].join('\n');
-
- mhtml.push(mhtmlPart);
-
- return 'url(data:{mediatype};base64,{base64})'
- .replace('{mediatype}', mime.lookup(imgpath))
- .replace('{base64}', base64);
- });
-
- mhtml.push('--' + boundary + '--');
-
- it.content = '/* \n' + mhtml.join('\n') + '\n*/\n\n' + it.content;
-
- // now replace inline mhtlm() reference
- it.content = it.content.replace(/mhtml\((.+)\)/g, function(w, url){
- return getMHTML(shortpath, url.split('/').slice(-1).join('/'));
- });
-});
+css.forEach(datauri.cssDatauri);
// write files, they're generated along the css files parsed,
// with a `-datauri.css` suffix.
-css.forEach(function(item) {
- var file = item.file.replace(/\.css$/, '-datauri.css');
- console.log(' >> Generate ', file);
- fs.writeFileSync(file, item.content);
-});
-
-// ## function helper
-function toBase64(path) {
- return fs.readFileSync(path, 'base64');
-}
-
-function getMHTML(shortpath, ref) {
- return 'url(mhtml:$host!$ref)'
- .replace('$host', config.host + shortpath.replace(/\.css$/, '-datauri.css'))
- .replace('$ref', ref);
-}
-
-function help() {
- // use of stdio instead of process.openStdin and stdout to avoid hitting
- // <Enter> to exit program after `:q` in man page.
- var stdio = process.binding('stdio'),
- ch = spawn('man', ['datauri'], {
- customFds: [stdio.stdinFD, stdio.stdoutFD, stdio.stderrFD]
- });
-
- ch.on('exit', function (code) {
- process.exit(code);
- });
+css.forEach(datauri.writeFiles);
- return ch;
-}
24 examples/example-datauri.css
View
@@ -83,7 +83,6 @@ iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABGdBTUEAAK/INwWK6QAAABl0RVh0U29m
--fooooobar--
*/
-
/* parts of jammit's example: http://jashkenas.s3.amazonaws.com/misc/jammit_example/jammit.html */
/*
@@ -98,61 +97,62 @@ div{display:block;float:left;width:16px;height:16px;margin:10px;}
#accept { background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABGdBTUEAAK/INwWK6QAAABl0RVh0U29mdHdhcmUAQWRvYmUgSW1hZ2VSZWFkeXHJZTwAAAKfSURBVDjLpZPrS1NhHMf9O3bOdmwDCWREIYKEUHsVJBI7mg3FvCxL09290jZj2EyLMnJexkgpLbPUanNOberU5taUMnHZUULMvelCtWF0sW/n7MVMEiN64AsPD8/n83uucQDi/id/DBT4Dolypw/qsz0pTMbj/WHpiDgsdSUyUmeiPt2+V7SrIM+bSss8ySGdR4abQQv6lrui6VxsRonrGCS9VEjSQ9E7CtiqdOZ4UuTqnBHO1X7YXl6Daa4yGq7vWO1D40wVDtj4kWQbn94myPGkCDPdSesczE2sCZShwl8CzcwZ6NiUs6n2nYX99T1cnKqA2EKui6+TwphA5k4yqMayopU5mANV3lNQTBdCMVUA9VQh3GuDMHiVcLCS3J4jSLhCGmKCjBEx0xlshjXYhApfMZRP5CyYD+UkG08+xt+4wLVQZA1tzxthm2tEfD3JxARH7QkbD1ZuozaggdZbxK5kAIsf5qGaKMTY2lAU/rH5HW3PLsEwUYy+YCcERmIjJpDcpzb6l7th9KtQ69fi09ePUej9l7cx2DJbD7UrG3r3afQHOyCo+V3QQzE35pvQvnAZukk5zL5qRL59jsKbPzdheXoBZc4saFhBS6AO7V4zqCpiawuptwQG+UAa7Ct3UT0hh9p9EnXT5Vh6t4C22QaUDh6HwnECOmcO7K+6kW49DKqS2DrEZCtfuI+9GrNHg4fMHVSO5kE7nAPVkAxKBxcOzsajpS4Yh4ohUPPWKTUh3PaQEptIOr6BiJjcZXCwktaAGfrRIpwblqOV3YKdhfXOIvBLeREWpnd8ynsaSJoyESFphwTtfjN6X1jRO2+FxWtCWksqBApeiFIR9K6fiTpPiigDoadqCEag5YUFKl6Yrciw0VOlhOivv/Ff8wtn0KzlebrUYwAAAABJRU5ErkJggg==); }
.ie6 #accept, .ie7 #accept {
+ background: url(mhtml:http://example.com/examples/example-datauri.css!accept.png);
}
#add { background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABGdBTUEAAK/INwWK6QAAABl0RVh0U29mdHdhcmUAQWRvYmUgSW1hZ2VSZWFkeXHJZTwAAAJvSURBVDjLpZPrS5NhGIf9W7YvBYOkhlkoqCklWChv2WyKik7blnNris72bi6dus0DLZ0TDxW1odtopDs4D8MDZuLU0kXq61CijSIIasOvv94VTUfLiB74fXngup7nvrnvJABJ/5PfLnTTdcwOj4RsdYmo5glBWP6iOtzwvIKSWstI0Wgx80SBblpKtE9KQs/We7EaWoT/8wbWP61gMmCH0lMDvokT4j25TiQU/ITFkek9Ow6+7WH2gwsmahCPdwyw75uw9HEO2gUZSkfyI9zBPCJOoJ2SMmg46N61YO/rNoa39Xi41oFuXysMfh36/Fp0b7bAfWAH6RGi0HglWNCbzYgJaFjRv6zGuy+b9It96N3SQvNKiV9HvSaDfFEIxXItnPs23BzJQd6DDEVM0OKsoVwBG/1VMzpXVWhbkUM2K4oJBDYuGmbKIJ0qxsAbHfRLzbjcnUbFBIpx/qH3vQv9b3U03IQ/HfFkERTzfFj8w8jSpR7GBE123uFEYAzaDRIqX/2JAtJbDat/COkd7CNBva2cMvq0MGxp0PRSCPF8BXjWG3FgNHc9XPT71Ojy3sMFdfJRCeKxEsVtKwFHwALZfCUk3tIfNR8XiJwc1LmL4dg141JPKtj3WUdNFJqLGFVPC4OkR4BxajTWsChY64wmCnMxsWPCHcutKBxMVp5mxA1S+aMComToaqTRUQknLTH62kHOVEE+VQnjahscNCy0cMBWsSI0TCQcZc5ALkEYckL5A5noWSBhfm2AecMAjbcRWV0pUTh0HE64TNf0mczcnnQyu/MilaFJCae1nw2fbz1DnVOxyGTlKeZft/Ff8x1BRssfACjTwQAAAABJRU5ErkJggg==); }
.ie6 #add, .ie7 #add {
- background: url(mhtml:http://example.com/example-datauri.css!add.png);
+ background: url(mhtml:http://example.com/examples/example-datauri.css!add.png);
}
#anchor { background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABGdBTUEAAK/INwWK6QAAABl0RVh0U29mdHdhcmUAQWRvYmUgSW1hZ2VSZWFkeXHJZTwAAAGdSURBVDjLpVMxa8JAFL6rAQUHXQoZpLU/oUOnDtKtW/MDBFHHThUKTgrqICgOEtd2EVxb2qFkKTgVChbSCnZTiVBEMBRLiEmafleCDaWxDX3w8e7dve+7l3cv1LZt8h/jvA56vV7DNM20YRgE/jyRSOR+ytvwEgAxvVwui/BF+LTvCtjNwKvj/X8CbgXPOHMEZl559HsTu93uPQi7jBiNRgMEx8PR0GIxRB+y2eze2gqQeAXoSCaqqu5bpsWIdyzGvvRrBW7rdDo2I6ZSKeq7B8x0XV/bwJWAJEnHSMwBDUEQWq5GfsJthUJhlVuv11uckyiGgiH2RWK73RYRb2cymbG7gnK5vIX9USwWI1yAI/KjLGK7teEI8HN1TizrnZWdRxxsNps8vI3YLpVKbB2EWB6XkMHzgAlvriYRSW+app1Mpy/jSCRSRSyDUON5nuJGytaAHI/vVPv9p/FischivL96gEP2bGxorhVFqYXDYQFCScwBYa9EKU1OlAkB+QLEU2AGaJ7PWKlUDiF2BBw4P9Mt/KUoije+5uAv9gGcjD6Kg4wu3AAAAABJRU5ErkJggg==); }
.ie6 #anchor, .ie7 #anchor {
- background: url(mhtml:http://example.com/example-datauri.css!anchor.png);
+ background: url(mhtml:http://example.com/examples/example-datauri.css!anchor.png);
}
#application { background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABGdBTUEAAK/INwWK6QAAABl0RVh0U29mdHdhcmUAQWRvYmUgSW1hZ2VSZWFkeXHJZTwAAAFiSURBVBgZpcEhbpRRGIXh99x7IU0asGBJWEIdCLaAqcFiCArFCkjA0KRJF0EF26kkFbVVdEj6/985zJ0wBjfp8ygJD6G3n358fP3m5NvtJscJYBObchEHx6QKJ6SKsnn6eLm7urr5/PP76cU4eXVy/ujouD074hDHd5s6By7GZknb3P7mUH+WNLZGKnx595JDvf96zTQSM92vRYA4lMEEO5RNraHWUDH3FV48f0K5mAYJk5pQQpqIgixaE1JDKtRDd2OsYfJaTKNcTA2IBIIesMAOPdDUGYJSqGYml5lGHHYkSGhAJBBIkAoWREAT3Z3JLqZhF3uS2EloQCQ8xLBxoAEWO7aZxros7EgISIIkwlZCY6s1OlAJTWFal5VppMzUgbAlQcIkiT0DXSI2U2ymYZs9AWJL4n+df3pncsI0bn5dX344W05dhctUFbapZcE2ToiLVHBMbGymS7aUhIdoPNBf7Jjw/gQ77u4AAAAASUVORK5CYII=); }
.ie6 #application, .ie7 #application {
- background: url(mhtml:http://example.com/example-datauri.css!application.png);
+ background: url(mhtml:http://example.com/examples/example-datauri.css!application.png);
}
#application_add { background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABGdBTUEAAK/INwWK6QAAABl0RVh0U29mdHdhcmUAQWRvYmUgSW1hZ2VSZWFkeXHJZTwAAAH9SURBVDjLpZM9aFRREIW/ue9FF2IULDQuaYIGtTBRWGFJAgqSUsEmjZVgo4mFWBiwVVjBHwjGwsbCShExIAghoEUMARGNGFJYhIC7isXGRbORvJ0Zi/dWY5fFCwOnuHz3nDsz4u78z5HTlx6NDB4v3KjWvd0dMMPNUFPcHHPDVTF3XBU1Y/uWZHVxsXzl6e3hibgwUBhvy7WH3bmWHm5fres4MBHXEw/16s+Wra8lHgBiV+f6mX0tA86VlkkBbgCsNxQH3Bw1MBwzR83Qhqflxro63Z0dqGkKIOuCBEHc8SC4OGJCCIJIQESRyIksEDfS+9bIAE1SAFwEBCIHEzBzIocgEbGAiqMhdWxqWQTL5kAE3P8BiYCrYwIuQBAii1JAM0JTpAxJxQaQxUJsxvTbSV7NP6e2ukLSSFjT/cBJ4kaS/HEggLsjIvgG0Is3T3hfnuLYwFG6dvbwcuEZcx+nKY7mbwbPskSAZC4k00GEIMLk64ccPtCHBqVvzxAqCcVD/QAjwcz+Rsg+M4gQbahv37/QJts4dfAiAJdP3Gfvrl6AXFxeWn58/k4ybKqYGqqKmaFJgplh7lRrKyxUZpmvzDA29IDS1Fly0VaAX7KZbSyO5q91de+42t87SE/nET59fcfshxk+L9VuyWbXuTiaLwEXgA7gB3Bv7m5l7Dd8kw6XoJxL0wAAAABJRU5ErkJggg==); }
.ie6 #application_add, .ie7 #application_add {
- background: url(mhtml:http://example.com/example-datauri.css!application_add.png);
+ background: url(mhtml:http://example.com/examples/example-datauri.css!application_add.png);
}
#application_cascade { background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABGdBTUEAAK/INwWK6QAAABl0RVh0U29mdHdhcmUAQWRvYmUgSW1hZ2VSZWFkeXHJZTwAAAGeSURBVDjLjZLdKwRRGIf3X1wXuNAikiKfWXaVLO1SIjYlG9LYaGKxNSXWx1rnwoUo+Zhdu2vkRsp32ePCvH5nYoaGNaeemjkz5/ee85zX5W6VS4bjuc3uhSzzz4NohnlnT1nHzAlrnz5mbZEj1jJ5yHwRxsS/ROT6jiu4lEuF12+YE5pHd1O2AFHZKXVDSWYL8EcvxKQjaga27AG+ubTxUUllMlOJq9fB1Us+sAJieR5azPJ+Oc0DC2e8N3rCmyYOOFxocOGxAiTVCBhTtMJ08pYXY1i55nChwUXeDGgM7xsBovJ/dErnHC40uNDMAGynr35kj3VJKn98eQOcPzwLCib3gqcCf3l9e8QiDS6sgK8HuBCTWnxHvRtT8joqEfqC0BeEYxJ6g9AXhL4g9AXBBaF4gxUgqUZAKJYjnNMRcPFuBsCFESAqOwUurPvEdsbhQkNfkNMBFz+b4tPFnwt0gS7Qjfeq4MYvARBWbHyFiOEJrNkD4MLxEdxtsj0ALmS4MATVDm5TdTBBlf3rVNGjUHl3nMp8y1TqjYkrFMgf+hUje+AiV2IAAAAASUVORK5CYII=); }
.ie6 #application_cascade, .ie7 #application_cascade {
- background: url(mhtml:http://example.com/example-datauri.css!application_cascade.png);
+ background: url(mhtml:http://example.com/examples/example-datauri.css!application_cascade.png);
}
#application_delete { background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABGdBTUEAAK/INwWK6QAAABl0RVh0U29mdHdhcmUAQWRvYmUgSW1hZ2VSZWFkeXHJZTwAAAH0SURBVBgZpcFPaM9xHMfx5/vz/Ywfv6ZwGC1mtRsXtRvFQSmlKK3JkRJymAul5EJcrFZrcnO0QpELDgrlKJcd5M9PtpHawew39v2+3y/7rlZuLI+HSeJ/2OGhO2d27+2/PtNWUwIiUAQejkKEArkTEnLHI1i3qpybmJg8f+/GwGju39U/0tFopq4GK9Gca/sIMJrbpVJ75gcrNV8qsSjLxZVjfazUiWstalkKaguVI0AhPCAQEcIj8Ep4JVzBgoveTZ14OLWMRM2SYRJKhkxYGCkZZgkzxwpRRCJXohaVU8seTi0BMgODQhAGEaIQJCvIBm7CU1ALD2pZIZaYgUQCZAYGZiAXYSADklFEQS3CqeUIZ5mZsUQiATIjspEjmHp4k+mHY7Q/vaWjq5sdq/cAB8lVWbLEDAMkYWaIRRIJmH50i9lX4+w8cpzVvduZf/OYNc+f8mRfx9kkD2oFYICZYYAByYxkRuvuMH17DtF49wy7fZS17+/T27MBmYZyRLDMAGORGX9amGrR2NQLB86xLF/eTBG2LU9+aI2fGi4Hwp3wwN2JCLwsiQhCYqCxnvbrRzQfnObX/BfawOz3Ai+YMkn8zYvB7surOpsXt2ysck6fmf1W8fFr4eVPXTJJ/IuXg1svzM1MnSzcerzQpGBs/+Pq6m9gRhRi/EsJnAAAAABJRU5ErkJggg==); }
.ie6 #application_delete, .ie7 #application_delete {
- background: url(mhtml:http://example.com/example-datauri.css!application_delete.png);
+ background: url(mhtml:http://example.com/examples/example-datauri.css!application_delete.png);
}
#arrow_in { background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABGdBTUEAAK/INwWK6QAAABl0RVh0U29mdHdhcmUAQWRvYmUgSW1hZ2VSZWFkeXHJZTwAAAHqSURBVDjL3ZHbThpRFIZ5i3kcLRYPqIgUGcDhNKBAqyKCobTR2NhiKmCstcWmBmtLPaCO4CQ6SBWVKInx0N70KbjhCf7O3ia0ZS686F0vVrL3Xvv7VvIvFQBVuOITQxfe6tj5IEPu9xW/ZxGcu2aJnAksxW9eYP42hmB5oBY48zAjJ240QoP7HH3j8xYhWgwiUgiAyxpFlTxZmL2ewvrPNBJX0wid+TF0zCsEHtEKGcbT4igWK0k8OwzBumGo0uZoeUCYuZzE0vUcVn6k8OSbUyFwyfDbSgKvShOIFsZgWTfU2K96pv5huOSm8KfvS/AXHAqBQ2CxcJFAsjwDe5YFgWkGdzCPoSMXHhed8BXs8B7YFALbVh/6Nx+RyWAzevR91qEu+Jf6XwRuecdkTSRp27YcVtaoCLE33Qn9sha6D+3oSrVB+07zO0RXzsx4chxmT18ifhqjSTcKej5qMbkfRVQM12EqILA8uRaRgnguhRE7mqJrahR0y5MjYgi+TTfsq1a0vVELVODYMVUJ/Lo0jZG8768d/1md71uhS2nBZxwYzwXRn2bxMNksqLgtoxgQ/RjOe2HK9FCrYaVLIehY1KB9oYVpnVfXnKscrMsmqBNNEm2a13ol05c7+L7SzD1gWpLNVXW8SST3X7gvtJUuvnAlAAAAAElFTkSuQmCC); }
.ie6 #arrow_in, .ie7 #arrow_in {
- background: url(mhtml:http://example.com/example-datauri.css!arrow_in.png);
+ background: url(mhtml:http://example.com/examples/example-datauri.css!arrow_in.png);
}
#arrow_inout { background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABGdBTUEAAK/INwWK6QAAABl0RVh0U29mdHdhcmUAQWRvYmUgSW1hZ2VSZWFkeXHJZTwAAAG5SURBVBgZpcG7b41xAMfhz/v2SJ1qI2nVedXtD0ClsdpIdDARBlKRaEIMLP4OCZNYJGIQl0EQiYnJytSRRA8nLnGrSy+/z1dHObH1eapLL86FVUlIQgyX91+v+I+zT2aiQcUSVGpWdQa3sL29kxhMmovPZ0Ofs09momkQOu2GzlAHi9RJSEJnsGFrewct1vU09LOIxd6m9jhbh7cxULVQqWPo/X7Pm4U3DFcb2L1xkij9imFq8z5GWiN0v3d5/fk1pUhtQimlefezy2CrTZUKS+hnkQTWt4bofuuiNhapknDh2ZnEoEElhmvTNyv+cere8ahosIjKnZkHVZWEtahZo5o1qlmjFqtmH52MBouoaLh17G7FP47cOJwYLKJB5fH5p1U9++hkLDYDGWDX2B4mx6ewSD9LmJzYy66J3ahomumrB1NbRNMbWz/Ot99fWV5ZwiL9VBbLEl9+fWHT8DhV6KnUFmmGJhgdHOXH4gKv3r9EpZ9F5ubnWFpeobOxw+jwGDG0ivJn+Q/zi/N8XPhAKTZqjz4aiovN/Ke3PUshBhOqE7ePRsUiGlTun35Y8R+HrhxIDCbEkIS/gKBKja+GF3wAAAAASUVORK5CYII=); }
.ie6 #arrow_inout, .ie7 #arrow_inout {
- background: url(mhtml:http://example.com/example-datauri.css!arrow_inout.png);
+ background: url(mhtml:http://example.com/examples/example-datauri.css!arrow_inout.png);
}
#arrow_join { background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABGdBTUEAAK/INwWK6QAAABl0RVh0U29mdHdhcmUAQWRvYmUgSW1hZ2VSZWFkeXHJZTwAAAIESURBVDjLpVLPS9NxGH7mjw3cZmvGclsFxcwQpFsQCRLBvIZJEC7LkyVdO5gnDx0i2qk/IAipyA5GBYoQkX0rWIaxTYvad9E85IbVcd/P834+HcZWKZtRz/V9n4f3eZ7XZYzB/6Cp0XB8/tzrsSeJxX8SuDg3stzZFj7S6Y0cO//g9Nt6e67NFi4tjLpFJBNuC8e6OrqhjUZ6LQ173f5AJb0zo4+chheQ8phK9pACGoKa8Lq9oMN9dPhw2wuqGLk/ZI53n4A2GtaKhdKP0tHZsblXm/da6nmjkrIjyqONoPS9VJ69sJVcN8Qz0yf7fG6fRxsN0QKfx++JJ/v7tg0xce9UTJRMkjx7KNrTHNoZgmii8HUNS5kloZLbJK9aU6mPWwQSdweHSJnev+uAO9IRgYZB8VsRIkRgRxDUCp/yOaQzGUcow2+uv5upCQzfGWwmud6793Cw3dcOUiFrryBfyM+LEkR2R+NdsRgMXCgW1/Fi0doQSih98700VQJjtAWtQb/XDwqxaq8i/yWfXLj8fODpFWsgZ+eSmWwWoolAMIBWtztISrQWolIEFaGk0rtdyEMpTlR9KsWJXM6GGAG1QJRAKL9aoEMop0KmEE7ZwbPJl7WPS11bdpyyArVA6wpZRP8ZYvxGv6EiqAQkYU2lXL/X1TN+0FSJWjRytz67Gn7i3+In2xhLsvVnPqcAAAAASUVORK5CYII=); }
.ie6 #arrow_join, .ie7 #arrow_join {
- background: url(mhtml:http://example.com/example-datauri.css!arrow_join.png);
+ background: url(mhtml:http://example.com/examples/example-datauri.css!arrow_join.png);
}
#arrow_left { background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABGdBTUEAAK/INwWK6QAAABl0RVh0U29mdHdhcmUAQWRvYmUgSW1hZ2VSZWFkeXHJZTwAAADrSURBVDjLY/z//z8DJYCJgUIwyAwoPZHJBsS7STGABY1/9e+fvzKkGMAIiwWgzRfF2ST0/vz5w/Dw/UOGXz9/M/z6AcK/GH4CMZj+jmCD5C70X2VkgWo+KcYqrqfArcTw598fBhluOTD9++9fIP7N8PsfEP/9AxUD0b8ZVq9ci/AC0Nm//zD+Yfj19xdY0R+got9gxb8RNNQAkNyf/0CxX39QvZC5M+68MJuIAQczJ8PDlw8ZXr9/g9XZIK+BNP/5/Yfh/sJHjIzIKTF2VchNoEI5oAbHDWk7TpAcjUDNukDNB4nVjOKFEZwXAOOhu7x6WtPJAAAAAElFTkSuQmCC); }
.ie6 #arrow_left, .ie7 #arrow_left {
- background: url(mhtml:http://example.com/example-datauri.css!arrow_left.png);
+ background: url(mhtml:http://example.com/examples/example-datauri.css!arrow_left.png);
}
#arrow_merge { background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABGdBTUEAAK/INwWK6QAAABl0RVh0U29mdHdhcmUAQWRvYmUgSW1hZ2VSZWFkeXHJZTwAAAF2SURBVDjLlZLNK4RhFMXPaMzU+EhJLyUKjYUSykeRsRCWUnbKzpTd8AfYWGPNRtnJQorNbMdsJ8xiForYSFNKM2Pe9zn3PhYoTfN56m5uPef+7n2Oz1qLctq5jSZUtPlo/mQaVdRUrhlLbKWcgDPrBJ2p7fjmXTUD33+C3dtoQFUfnGB3eKB9CGoVmWwGrx8vj0IZOV0796oSCOWKlD4RgehvkaDHXuPxuibBn6I3G3auPwKringmjrP1C1+lFfzlmjQ/01UF9IiGj2g8QkRASzhtDlaPV2INGhjQEjk3h872LhjXrC0fLsQaIqAQ2UIWbaFWjA9PzPV09hxE9mfs7N6krZsg/5XH88cT/EE/woNhLEaWYEpuUt7AJYwIMulHfL7lUSy4MDQQS9Cw9i8Yz0BUMDE6hkQyifv0/Tt86CAlINT6DKhEqCUE1ytCRPtTB+li3TkwLkFLqCqMISo9rkLwkwOxWjNIFZJIXF5eQSjQkp1L9Q34mO6FTUohDAAAAABJRU5ErkJggg==); }
.ie6 #arrow_merge, .ie7 #arrow_merge {
- background: url(mhtml:http://example.com/example-datauri.css!arrow_merge.png);
+ background: url(mhtml:http://example.com/examples/example-datauri.css!arrow_merge.png);
}
26 examples/example.css
View
@@ -10,22 +10,22 @@
div{display:block;float:left;width:16px;height:16px;margin:10px;}
-#accept { background: url(./images/embed/accept.png); }
-#add { background: url(./images/embed/add.png); }
-#anchor { background: url(./images/embed/anchor.png); }
-#application { background: url(./images/embed/application.png); }
-#application_add { background: url(./images/embed/application_add.png); }
-#application_cascade { background: url(./images/embed/application_cascade.png); }
-#application_delete { background: url(./images/embed/application_delete.png); }
-#arrow_in { background: url(./images/embed/arrow_in.png); }
-#arrow_inout { background: url(./images/embed/arrow_inout.png); }
-#arrow_join { background: url(./images/embed/arrow_join.png); }
-#arrow_left { background: url(./images/embed/arrow_left.png); }
-#arrow_merge { background: url(./images/embed/arrow_merge.png); }
+#accept { background: url(../images/icons/accept.png); }
+#add { background: url(../images/icons/add.png); }
+#anchor { background: url(../images/icons/anchor.png); }
+#application { background: url(../images/icons/application.png); }
+#application_add { background: url(../images/icons/application_add.png); }
+#application_cascade { background: url(../images/icons/application_cascade.png); }
+#application_delete { background: url(../images/icons/application_delete.png); }
+#arrow_in { background: url(../images/icons/arrow_in.png); }
+#arrow_inout { background: url(../images/icons/arrow_inout.png); }
+#arrow_join { background: url(../images/icons/arrow_join.png); }
+#arrow_left { background: url(../images/icons/arrow_left.png); }
+#arrow_merge { background: url(../images/icons/arrow_merge.png); }
/* sadly, the regex used to generate .ie6, .ie7 placeholder won't catch block declaration */
#book_key {
color: red;
font-size: 20px;
- background: url(./images/embed/book_key.png);
+ background: url(../images/icons/book_key.png);
}
Please sign in to comment.
Something went wrong with that request. Please try again.