Skip to content

Instantly share code, notes, and snippets.

View kohlmannj's full-sized avatar

Joseph Kohlmann kohlmannj

View GitHub Profile
@kohlmannj
kohlmannj / index.html
Created April 27, 2012 19:57 — forked from mbostock/.block
Polymaps + D3, Part 2
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="http://mbostock.github.com/d3/d3.js?1.29.5"></script>
<script type="text/javascript" src="http://polymaps.org/polymaps.min.js?2.5.0"></script>
<style type="text/css">
html, body {
height: 100%;
background: #E6E6E6;
@kohlmannj
kohlmannj / iframeScale.js
Created December 8, 2014 19:13
jQuery Plugin: iframe Scaler (transforms iframes to fit inside their containing elements)
(function($) {
$.fn.iframeScale = function() {
this.each(function() {
var $iframe = $(this).find("iframe");
var scaleFactor = $(this).width() / $iframe.width();
$iframe.css({
webkitTransform: "scale(" + scaleFactor + ")",
mozTransform: "scale(" + scaleFactor + ")",
msTransform: "scale(" + scaleFactor + ")",
transform: "scale(" + scaleFactor + ")"
// Sass Code
.selector {
// This mixin's content block will be wrapped in this media query:
// `@media (min-width: 540px)`
@include size-class(regular) {
width: span(5);
@include font-size(auto, vw) {
// Will output a font-size property and value within a media query:
@kohlmannj
kohlmannj / .stylelintrc
Created January 24, 2017 03:30
.stylelintrc Snapshot 2017-01-23
{
"plugins": [
"stylelint-scss"
],
"extends": [
"stylelint-config-sass-guidelines",
"stylelint-config-standard"
],
"rules": {
"indentation": 2,
@kohlmannj
kohlmannj / .eslintrc
Created January 24, 2017 03:32
.eslintrc Snapshot 2017-01-23
{
"parser": "babel-eslint",
"extends": [
"airbnb"
],
"rules": {
"import/newline-after-import": "off"
}
}
@kohlmannj
kohlmannj / .babelrc
Created January 24, 2017 03:34
.babelrc Snapshot 2017-01-23
{
"presets": [
["latest", { "modules": false }],
"react",
"stage-2"
],
"env": {
"development": {
"plugins": [
"react-hot-loader/babel"
$ yarn run test
yarn run v0.24.6
$ NODE_ENV=test jest
PASS src/__tests__/Storyshots.test.js
● Console
console.info node_modules/@storybook/react/dist/server/babel_config.js:67
=> Loading custom .babelrc
PASS src/components/standard/Figure/__tests__/Figure.test.jsx
$ yarn run test -- src/__tests__/Storyshots.test.js
yarn run v0.24.6
$ NODE_ENV=test jest src/__tests__/Storyshots.test.js
PASS src/__tests__/Storyshots.test.js
Storyshots
Figure
✓ with all props (story) (22ms)
✓ with a Picture (story) (8ms)
Test Suites: 1 passed, 1 total
import React from 'react';
import { storiesOf } from '@storybook/react';
import withPaidPostArticle from '../../../../../.storybook/withPaidPostArticle';
import withPlacement from '../../../../../.storybook/withPlacement';
import Figure from '../Figure';
import { paragraphs as lipsum } from '../../../../utils/placeholders/lorem-ipsum.json';
import breakpoints from '../../../../utils/layout/breakpoints.json';
const srcObj = {
@kohlmannj
kohlmannj / RuntimeSingletonComponent.jsx
Last active July 3, 2017 19:10
A React class component that loads a runtime library on componentDidMount(), but only once for multiple instances.
import React, { Component } from 'react';
// A "global" promise for the runtime library.
const runtimePromise;
export default RuntimeSingletonComponent extends Component {
componentDidMount() {
// Have we previously loaded the runtime library?
if (!runtimePromise) {
// import() the runtime library for the first time.