Skip to content

Instantly share code, notes, and snippets.

View KyleAMathews's full-sized avatar

Kyle Mathews KyleAMathews

3.5k followers · 113 following
View GitHub Profile
@KyleAMathews
KyleAMathews / sample-emotion.js
Created April 10, 2020 04:22
import React from "react"
export default () => (
<div
css={{
backgroundColor: 'hotpink',
'&:hover': {
color: 'lightgreen'
}
}}
@KyleAMathews
KyleAMathews / machine.js
Created April 3, 2020 23:06
Generated by XState Viz: https://xstate.js.org/viz
// Available variables:
// - Machine
// - interpret
// - assign
// - send
// - sendParent
// - spawn
// - raise
// - actions
@KyleAMathews
KyleAMathews / gatsby-recipe-emotion
Last active March 20, 2020 02:47
Gatsby Recipes
# Emotion
This recipe helps you start developing with the Emotion CSS in JS library
<Config
conflictsWith="gatsby-recipe-styled-components"
/>
---
@KyleAMathews
KyleAMathews / gist:1883663faa0b086b6a9aad99c6677a2c
Created July 25, 2019 18:25
<!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, shrink-to-fit=no" />
<style id="typography.js">
html {
font-family: sans-serif;
@KyleAMathews
KyleAMathews / SketchSystems.spec
Created June 12, 2019 17:44
Incremental Builds
Incremental Builds
Running Full Build
finished build -> Deployed
Running Incremental Build
finished build -> Deployed
Deployed
data change not affecting static queries -> Running Incremental Build
data change affecting static queries -> Running Full Build
code change -> Running Full Build
@KyleAMathews
KyleAMathews / persist.html
Last active March 24, 2019 00:56
<html>
<head>
<link
rel="prefetch"
as="image"
href="https://images.pexels.com/photos/248797/pexels-photo-248797.jpeg"
onload="fetch('https://images.pexels.com/photos/248797/pexels-photo-248797.jpeg')"
/>
</head>
<body>
@KyleAMathews
KyleAMathews / gatsby-ink.jsx
Created March 8, 2019 23:33
import React from "react"
import { render, Static, Box, Color, Text } from "ink"
import BigText from "ink-big-text"
import BBox from "ink-box"
import TextInput from "ink-text-input"
import { Tabs, Tab } from "ink-tab"
import _ from "lodash"
const purple = [102, 51, 153]
const hexPurple = `#663399`
@KyleAMathews
KyleAMathews / results.json
Last active March 3, 2019 02:57
{"total":740,"results":[{"package":{"name":"gatsby-plugin-react-helmet","scope":"unscoped","version":"3.0.6","description":"Manage document head data with react-helmet. Provides drop-in server rendering support for Gatsby.","keywords":["gatsby","gatsby-plugin","favicon","react-helmet","seo","document","head","title","meta","link","script","base","noscript","style"],"date":"2019-02-01T12:25:14.983Z","links":{"npm":"https://www.npmjs.com/package/gatsby-plugin-react-helmet","homepage":"https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-plugin-react-helmet#readme","repository":"https://github.com/gatsbyjs/gatsby","bugs":"https://github.com/gatsbyjs/gatsby/issues"},"author":{"name":"Kyle Mathews","email":"matthews.kyle@gmail.com"},"publisher":{"username":"pieh","email":"misiek.piechowiak@gmail.com"},"maintainers":[{"username":"dschau","email":"dustinschau@gmail.com"},{"username":"freiksenet","email":"freiksenet@gmail.com"},{"username":"kylemathews","email":"mathews.kyle@gmail.com"},{"username":"m-allan
@KyleAMathews
KyleAMathews / page.html
Created December 3, 2018 00:27
<!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, shrink-to-fit=no" />
<style data-href="/component---src-posts-2018-09-13-why-i-migrated-away-from-medium-mdx.942e966dd04428ca9417.css">
.body-module--h1--26YIz {
margin-bottom: 2rem;
@KyleAMathews
KyleAMathews / gatsby-node.js
Created November 9, 2018 18:59
exports.onCreateNode = ({ node, actions, createNodeId, createContentDigest }) => {
const { createNode, createNodeField } = actions
if (node.internal.type === `NodeTypeWithMarkdownField`) {
const newNode = createNode({
id: createNodeId(`${node.id} markdown field`),
children: [],
parent: node.id,
internal: {
content: node.markdownField,
mediaType: `text/markdown`,