Skip to content

Instantly share code, notes, and snippets.

Avatar
💭
Working

Jon Sherrard jonsherrard

💭
Working
View GitHub Profile
@jonsherrard
jonsherrard / render-props.js
Created Jun 6, 2018
render pros normalizing stuff
View render-props.js
import React from 'react'
const renderProps = (ComponentOrFunction, props) => (
ComponentOrFunction.propTypes || ComponentOrFunction.prototype.render
? <ComponentOrFunction {...props} />
: ComponentOrFunction({
...(ComponentOrFunction.defaultProps || {}),
...props,
})
)
View pride-border.css
background-image: repeating-linear-gradient(to right, #E70000 0px, #E70000 16.66666%, #FF8C00 16.666666%, #FF8C00 33.333333%, #FFEF00 33.3333333%, #FFEF00 50%, #00811F 50%, #00811F 66.6666666%, #0044FF 66.666666%, #0044FF 83.3333333333%, #760089 83.333333px,#760089 100%)
@jonsherrard
jonsherrard / markdown-libary.js
Created Aug 1, 2017
Does this markdown library exist?
View markdown-libary.js
import React from 'react'
import { render } from 'react-dom'
import SomeComponent from './some-component-in-the-project.js'
import Md from 'markdown-library'
const Blog = (props) =>
<Md>
# My blog post
View react-accordian.jsx
import React, { Component } from 'react'
class Accordian extends Component {
render() {
return (
<img src="https://68.media.tumblr.com/c4aed1e6b5b33f1d3902ecd8dcae6ef5/tumblr_o7odnl5H2N1rfd7lko1_500.gif"/>
)
}
}
View loadProps.sketch.js
class Post extends Component {
static loadProps(routeParams) { // from WordPress API
return [
`posts?filter[slug]=${routeParams.post.slug}`,
`menus?filter[name]=main`,
`options`
]
}
}
View lies.md

(also know as lies and/or alternative facts)

js

  • setImmediate - doesn't set anything immediately, waits for a tick before executing
  • setTimeout(fn, n) - never sets the timeout to exactly n
  • Math.random() - computers cannot generate random numbers
  • Promise - is a lie when rejected
  • Array.reduce - accumulates, does not reduce (via @sbmadhav)
@jonsherrard
jonsherrard / wp-setup.php
Created Jan 4, 2017
wordpress setup script
View wp-setup.php
<?php
class WordpressSite {
public $base_folder = "/Users/jonsherrard/projects/";
function __construct($project_name) {
$this->location = $this->base_folder.$project_name;
$this->project_name = $project_name;
}
@jonsherrard
jonsherrard / es-poll.html
Created Dec 5, 2016
CSS to improve poll embeds on es-2016
View es-poll.html
<style>
.senti-poll-question {
font-size: 32px;
}
.btn.senti-poll-vote-button {
background: #161616;
color: white;
border-radius: 0px !important;
cursor: pointer;
View email.tml
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>NEVER UNDERDRESSED</title>
<span class="preheader" style="display: none !important; visibility: hidden; font-size: 0; max-height: 0; line-height: 0; margin: 0; mso-hide: all">A Never Underdressed email</span>
<table width="100%" cellpadding="0" cellspacing="0" border="0" style="background-color: #FFFFFF; font-family: Arial, Helvetica, sans-serif" id="wrapper">
<tbody>
<tr>
<td height="30" class="spacer"></td>
</tr>
<tr>
<td>
@jonsherrard
jonsherrard / styles.js
Created Oct 4, 2016
Fewtch styling at Shortlist Studio
View styles.js
import { StyleSheet, css } from 'aphrodite/no-important'
export default StyleSheet.create({
base: {
fontFamily: 'Helvetica Neue',
fontSize: '1.1em',
fontWeight: 300,
'-webkit-font-smoothing': 'antialiased'
},
You can’t perform that action at this time.