Liquidify a certain fixed width project quickly debug

liquidify

// LIQUIFY
// Quickly Debug Responsive issues
// (Quite specific for a certain project :))

// This script removes all(!) fixed width, sets them to auto
// and sets some basic fluid layout styles

// This allows us to quickly debug issues with fixed width components.
// It's a starting point for 'bolt-on' (I _know_) RWD

// Use as Bookmarklet by adding a new Bookmark with URL:
// javascript:var debugInfo=false,debugBG="rgba(255,0,0,0.2)",debugCL="rgba(255,0,0,0.333)";var widthRE=/\swidth:.?([0-9]*\.?[0-9]+)(px|em|rem|pt)\s?;/gi;var doc=document,ss=doc.styleSheets,r=".debug",i,j;for(i=0;i<ss.length;i++){var sr=ss[i].cssRules;if(sr){for(j=0;j<sr.length;j++){var aRule=sr[j].cssText;var widthResult=widthRE.exec(aRule);if(widthResult){var cElSel=sr[j].selectorText;if(widthResult[1]>60)$(cElSel).css({width:"auto"});$("img").css({"max-width":"100%"});$("iframe").css({"max-width":"100%"});$(".search .text").css({width:"auto"});$("body").css({"min-width":"320px","max-width":"1002px",margin:"0 auto"});$("#content").css({"box-sizing":"border-box"});$("#content").css({width:"60%"});$("#sidebar").css({"box-sizing":"border-box"});$("#sidebar").css({width:"38%"})}}}}

var debugInfo = false, // Show logs of Selectors with fixed widths?
	debugBG = "rgba(255,0,0,0.2)",
	debugCL = "rgba(255,0,0,0.333)";

// Matches absolute Width: rule (case insensitive, allows for spaces etc)
// 2 Capturing groups: $1 = width (123), $2 = unit (px|em|rem|pt)
var widthRE = /\swidth:.?([0-9]*\.?[0-9]+)(px|em|rem|pt)\s?;/gi;
var doc = document, ss = doc.styleSheets, r = ".debug", i, j;
for (i = 0; i < ss.length; i++) {
	var sr = ss[i].cssRules;
	if(sr){
		for (j = 0; j < sr.length; j++) {
			var aRule = sr[j].cssText;
			var widthResult = widthRE.exec(aRule);
			if(widthResult){
				var cElSel = sr[j].selectorText;

				// Some Quick & Dirrty Responsivisation

				// Reset Width only reset if set width > 60px
				if ( widthResult[1] > 60) $(cElSel).css({'width':'auto'});

				// Setup some fixed things
				$('img').css({'max-width':'100%'});
				$('iframe').css({'max-width':'100%'});
				$('.search .text').css({'width':'auto'});
				$('body').css({'min-width':'320px', 'max-width':'1002px', 'margin':'0 auto'});

				// Some Exceptions!
				$('#content').css({'box-sizing':'border-box'});
				$('#content').css({'width':'60%'});
				$('#sidebar').css({'box-sizing':'border-box'});
				$('#sidebar').css({'width':'38%'});
			}
		}
	}
};