Mutalis mutalis

## howto-center-div.html
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Centering divs</title>
    <style>
      * {
        box-sizing: border-box;

## transducers.js
const dragons = [
  { name: 'fluffykins', size: 1 },
  { name: 'wargle', size: 3 }
]
for(let i=0; i<500; i++) {
  dragons.push({ name: 'fluffykins', size: Math.random()*10 })
}

const getDragonTitle = dragon => {
  if (dragon.size > 1) {

## humanSize.js
const humanSize = bytes => {
  if (bytes === 0) return 'n/a'

  const i = Math.floor(Math.log(Math.abs(bytes)) / Math.log(1024))

  const sizes = ['B', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB']

  return `${(bytes / Math.pow(1024, i)).toFixed(1)} ${sizes[i]}`
}
	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="UTF-8" />
	<meta http-equiv="X-UA-Compatible" content="IE=edge" />
	<meta name="viewport" content="width=device-width, initial-scale=1.0" />
	<title>Centering divs</title>
	<style>
	* {
	box-sizing: border-box;
	const dragons = [
	{ name: 'fluffykins', size: 1 },
	{ name: 'wargle', size: 3 }
	]
	for(let i=0; i<500; i++) {
	dragons.push({ name: 'fluffykins', size: Math.random()*10 })
	}

	const getDragonTitle = dragon => {
	if (dragon.size > 1) {
	const humanSize = bytes => {
	if (bytes === 0) return 'n/a'

	const i = Math.floor(Math.log(Math.abs(bytes)) / Math.log(1024))

	const sizes = ['B', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB']

	return `${(bytes / Math.pow(1024, i)).toFixed(1)} ${sizes[i]}`
	}