Create a gist now

Instantly share code, notes, and snippets.

What would you like to do?
How to add custom CSS rules via Scratchpad
/**
* Appends CSS code to an existing stylesheet.
* @param styleSheetURL: URL of an existing styleSheet;
* @param code: CSS code to append.
*/
function appendCSS(styleSheetURL, code) {
let DOMUtils = Cc["@mozilla.org/inspector/dom-utils;1"].getService(Ci.inIDOMUtils);
Cu.import("resource://gre/modules/NetUtil.jsm");
let styleSheet;
for (let i = 0; i < document.styleSheets.length; i++) {
if (document.styleSheets[i].href == styleSheetURL) {
styleSheet = document.styleSheets[i];
}
}
if (!styleSheet) {
throw "Didn't find stylesheet";
}
NetUtil.asyncFetch(styleSheet.href, function onFetch(aStream, aStatus) {
let source = NetUtil.readInputStreamToString(aStream, aStream.available());
aStream.close();
DOMUtils.parseStyleSheet(styleSheet, source + "\n" + code);
});
}
// Multiline in JavaScript. Perfect to write some CSS.
// Finally, E4X is useful :)
let style = (<r><![CDATA[
/* This is a CSS comment, not a JS comment! */
#nav-bar {
border: 3px solid #F06 !important;
}
]]></r>);
appendCSS("chrome://browser/skin/browser.css", style);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment