Glen Maddern geelen

## chain.js
const chain = rules => {
  class ChainLink {
    constructor(rules) {
      this.rules = rules;
    }

    toString() {
      return this.rules
    }
  }

## _.md

      
              2 files
            
          
              0 forks
            
          
              0 comments
            
          
              1 star
            
          
                geelen
                / _.md
            
            
              Last active
              March 1, 2019 04:32
            
              
                Sync a document from Bear Writer's DB to a file on disk
              
          
    Sync a document from Bear Writer's DB to a file on disk

I really like Bear Writer's interface, but it stores all its notes in an SQLite DB. I spent ages rigging up a nice Markdown + Webpack pipeline for a React blog before I realised this, and rather than admit my mistake, potentially pushing forward to concentrate on the content rather than procrastinating on the pipeline, I built this.

Grab the Document ID from Bear, then run:
yarn add sqlite3 untildify


## stylable-components.md

      
              1 file
            
          
              0 forks
            
          
              0 comments
            
          
              0 stars
            
          
                geelen
                / stylable-components.md
            
            
              Last active
              November 13, 2017 11:29
                — forked from jamiebuilds/stylable-components.md
            
          
    stylable-components


CSS for Components

Example

/* Counter.css */
@import Button from './Button.css';

  
## index.html
<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8"/>
	<title>Query selector speed comparison #jsbench #jsperf</title>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/benchmark/1.0.0/benchmark.min.js"></script>
	<script src="./suite.js"></script>
</head>
<body>
	<h1>Open the console to view the results</h1>

## cm2sc.js
import React from 'react'

const cm2sc = names => Object.keys(names).reduce((comps, name) => (
  { ...comps, [name]: ({is = 'div', className, ...props}) => (
    React.createElement(is, { ...props, className: [names[name], className].filter(_=>_).join(' ') })
  ) }
), {})

export default cm2sc

## blend mode example.js
// Doesn't work unless the image host accepts CORS

      window.download = a => {
        const { opacity, country, blendMode } = current
        const canvas = document.createElement('canvas')
        canvas.width = 1280
        canvas.height = 720
        const ctx = canvas.getContext('2d')
        ctx.clearRect(0, 0, 1280, 720)
        ctx.globalCompositeOperation = 'source-over'

## button.js
import React, { PropTypes } from 'react'
import styled, { css } from 'styled-components'

const commonClasses = 'link dib f5 fw6 tracked tc br2 ttu ba pointer'

const sizes = ['large', 'small', 'extra-large']
const types = ['success', 'warning', 'danger', 'primary', 'default']

const sizedBtnClasses = {
  'large': 'h3 pa3',

## debug.jsx
import React from 'react'
import styled from 'styled-components'

const Pre = styled.pre`
  background-color: papayawhip;
  color: palevioletred;
  padding: .5rem;
  font-family: monospace;
`

## perf.js
function makeRandomColor() {
  return '#' + Math.random().toString(16).substr(-6)
}

let tag = document.createElement('style')
tag.type = 'text/css'
tag.appendChild(document.createTextNode(''));
(document.head || document.getElementsByTagName('head')[0]).appendChild(tag)
let styleSheet = [...document.styleSheets].filter(x => x.ownerNode === tag)[0]

## 1_locals.css
/* equivalent to postcss-local-scope. INPUT: */

.outer {
  color: papayawhip;
  box-shadow: 0 0 10px;
}

/* OUTPUT: */

@export .outer ".outer-abcs12r3adudas";
	const chain = rules => {
	class ChainLink {
	constructor(rules) {
	this.rules = rules;
	}

	toString() {
	return this.rules
	}
	}
	<!DOCTYPE html>
	<html>
	<head>
	<meta charset="utf-8"/>
	<title>Query selector speed comparison #jsbench #jsperf</title>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/benchmark/1.0.0/benchmark.min.js"></script>
	<script src="./suite.js"></script>
	</head>
	<body>
	<h1>Open the console to view the results</h1>
	import React from 'react'

	const cm2sc = names => Object.keys(names).reduce((comps, name) => (
	{ ...comps, [name]: ({is = 'div', className, ...props}) => (
	React.createElement(is, { ...props, className: [names[name], className].filter(_=>_).join(' ') })
	) }
	), {})

	export default cm2sc
	// Doesn't work unless the image host accepts CORS

	window.download = a => {
	const { opacity, country, blendMode } = current
	const canvas = document.createElement('canvas')
	canvas.width = 1280
	canvas.height = 720
	const ctx = canvas.getContext('2d')
	ctx.clearRect(0, 0, 1280, 720)
	ctx.globalCompositeOperation = 'source-over'
	import React, { PropTypes } from 'react'
	import styled, { css } from 'styled-components'

	const commonClasses = 'link dib f5 fw6 tracked tc br2 ttu ba pointer'

	const sizes = ['large', 'small', 'extra-large']
	const types = ['success', 'warning', 'danger', 'primary', 'default']

	const sizedBtnClasses = {
	'large': 'h3 pa3',
	import React from 'react'
	import styled from 'styled-components'

	const Pre = styled.pre`
	background-color: papayawhip;
	color: palevioletred;
	padding: .5rem;
	font-family: monospace;
	`
	function makeRandomColor() {
	return '#' + Math.random().toString(16).substr(-6)
	}

	let tag = document.createElement('style')
	tag.type = 'text/css'
	tag.appendChild(document.createTextNode(''));
	(document.head \|\| document.getElementsByTagName('head')[0]).appendChild(tag)
	let styleSheet = [...document.styleSheets].filter(x => x.ownerNode === tag)[0]
	/* equivalent to postcss-local-scope. INPUT: */

	.outer {
	color: papayawhip;
	box-shadow: 0 0 10px;
	}

	/* OUTPUT: */

	@export .outer ".outer-abcs12r3adudas";