Skip to content

Instantly share code, notes, and snippets.

@eyecatchup

eyecatchup/0.md

Last active November 11, 2018 15:22
Show Gist options
  • Save eyecatchup/dbdaa558c374435696b2e3b3ae6f5d30 to your computer and use it in GitHub Desktop.
Save eyecatchup/dbdaa558c374435696b2e3b3ae6f5d30 to your computer and use it in GitHub Desktop.
Download ZIP
Fork of official cssmin.js demo (http://tools.w3clubs.com/cssmin/). Fixes mime type error for assets, thus fix broken demo. (Replaced raw.github.com links with rawgit.com links.)
Raw
0.md

Click to open cssmin.js demo (opens the raw gist URL of cssmin-demo.html via rawgit.com)

"Fork" of the official cssmin.js demo, which is broken since a while (because of hotlinking assets to raw.github.com).

Hotlinking assets to raw.github.com produces mime type errors, as files are returned as text/plain by the server. So I just replaced the raw.github.com link with a rawgit.com link to fix the mime type issue, thus the demo.
(Official demo is hosted outside the Github universe. No chance to send a PR, thus this "fork".)

Raw
cssmin-demo.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>CSS min demo</title>
</head>
<body>
<form target="frame">
<input type="button" value="crunch" id="crunch" />
<span id="savings"></span>
<p>
<label>Source</label>
<textarea style="width:100%;height:200px;" name="src"></textarea>
</p>
<label>Result</label>
<textarea style="width:100%;height:200px;" name="res"></textarea>
</form>
<p>This CSS minification tool uses a JavaScript port of the YUI Compressor. Read the <a href="http://phpied.com">blog post</a> for more.</p>
<iframe name="frame" style="width:0px;height:0px;display:none;"></iframe>
<script defer="" src="https://cdn.rawgit.com/stoyan/yuicompressor/master/ports/js/cssmin.js"></script>
<script>
document.getElementById('crunch').onclick = function() {
var res, s, r, f = document.forms[0];
f.res.value = YAHOO.compressor.cssmin(f.src.value);
s = f.src.value.length;
d = f.res.value.length;
res = "in: " + s + "; out: " + d + " (" + (100*d/s).toFixed(2) + "%)";
document.getElementById('savings').innerHTML = res;
}
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment