netsi1964

var styleKeysSVG_chrome = [
  "alignContent",
  "alignItems",
  "alignSelf",
  "alignmentBaseline",
  "all",
  "animation",
  "animationDelay",
  "animationDirection",
  "animationDuration",

netsi1964

// Works at: https://facebook.github.io/react/docs/events.html
var domNodes = document.querySelectorAll('blockquote:nth-of-type(2)~ul li a');
var documentation = {};
Array.prototype.map.call(domNodes, function(ele) {
  var name = ele.getAttribute('href').replace(/\#/ig, '');
  var group = [];
  var groupName = ele.innerText.replace(' Events','');
  var h3 = document.querySelector(`[name="${name}"]`).parentNode;
  var events = h3.nextElementSibling.nextElementSibling.querySelector('.language-text').innerText;

netsi1964

var CSSSelector = window.localStorage.getItem('CSSSelector');
CSSSelector = prompt('Enter a selector', (window.localStorage.getItem('CSSSelector').toString()!=='null') ? CSSSelector : 'body');
window.localStorage.setItem('CSSSelector', CSSSelector);
var elements = document.querySelectorAll(CSSSelector);
var q = '`';
var report = `Selector: ${q}${CSSSelector}${(elements.length>1) ? ' (FOUND '+elements.length+' OCCURANCES)' : ''}${q}\n------------\n`;
if (elements.length>0) {
  var element = elements[0];
  var computedRules = window.getComputedStyle(element);
  report+=`${q}${q}${q}\npadding: ${computedRules['padding']}\nmargin: ${computedRules['margin']}\nwidth:${computedRules['width']}\nheight:${computedRules['height']}\nbox-sizing:${computedRules['box-sizing']}\n${q}${q}${q}\n`;

netsi1964

var computedRules = window.getComputedStyle(document.body);
var md = '| Rule | Value |\n';
md+='|---------|---:|\n';
Array.from(computedRules).sort().map(function cssRule(rule) {
  md+=`| ${rule.replace(/-/g,'\-')} | ${computedRules[rule].replace(/-/g,'\-')} |\n`;
});
copy(md)

netsi1964

var allClasses = {}, css = '';
var startFrom = prompt('Where should I start?', '#application');
Array.prototype.forEach.call(document.querySelectorAll(startFrom+' *[class]'), function(element) {
  Array.prototype.forEach.call(element.classList, function(className) {
     if (!allClasses[className]) {
       allClasses[className] = 0;
     }
     allClasses[className]++;
  })
});

netsi1964

// obj: JSON object
// selector: The path to the data you want to extract
function JSONselect(obj, selector) {
   var levels = selector.split('.')
   var object = obj;
   levels.map(function(path) {
     console.log(path)
     object = object[path];
   })
   return object;

netsi1964

function cleanReactHTML(html) {
	var result = html.replace(/data-reactid="[\.\d:\D]{1,23}"/g,'');
	result = result.replace(/data-reactroot="[\.\d:\D]{1,23}"/g,'');
 	result = result.replace(/<!--[\s\S]*?-->/g,'');
	return result
}

copy(cleanReactHTML(document.querySelector('.app').innerHTML));

netsi1964

function waitFor(ms, cb) {
  var waitTill = new Date(new Date().getTime() + ms);
  while(waitTill > new Date()){};
  if (cb) {
    cb()
  } else {
   return true
  }
}

netsi1964

The world in SVG

Found on a pen by Magnus Kjelland on codepen

netsi1964

:root {
 /*
	From: https://www.lightningdesignsystem.com/design-tokens/
 	Using Gist: https://gist.github.com/netsi1964/d8b688c3cd7a22f80087436af249b877 
 	Date: Wed Nov 02 2016 13:58:42 GMT+0100 (Romance Standard Time)
*/

--color-background: rgb(244, 246, 249);
--color-background-alt: rgb(255, 255, 255);
--color-background-alt-2: rgb(238, 241, 246);