nathanstilwell

    .      .
    _\/  \/_
     _\/\/_
 _\_\_\/\/_/_/_
  / /_/\/\_\ \
     _/\/\_
     /\  /\
    '      '

nathanstilwell

//
// Ok look, I know this is a bad idea but I'm doing this as an experiment. I'm going to get really granular with these,
// which makes them basically unsuable. But it gives a decent overview of the diversity of iThangs.
// So chill.
//
// References:
// http://www.paintcodeapp.com/news/ultimate-guide-to-iphone-resolutions
// https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Media_queries#-moz-device-pixel-ratio
// http://stephen.io/mediaqueries/
//

nathanstilwell

Code Style references

• Why Code Style Matters, Smashing Magazine
• JavaScript Style Guides and Beautifiers, Addy Osmani

CSS

• Idiomatic CSS, Nicolas Gallagher
• CSS Guidelines, Harry Roberts
• PrimerCss Guideline, Github

nathanstilwell

Set up a new machine

App Store

Crack open the app store and install all your favorite. Don't forget Xcode.

XCode

1. Install XCode from the App Store
2. > xcode-select --install

nathanstilwell

{
  "rules": {
    "quotes": [2, "single"],
    "linebreak-style": [2, "unix"],
    "semi": [2, "always"]
  },
  "env": {
      "es6": true,
      "node": true,
      "browser": true

nathanstilwell

/*global require: true*/

'use strict';

var gulp = require('gulp');
var gutil = require('gulp-util');
var rename = require('gulp-rename');
var svgstore = require('gulp-svgstore');
var svgmin = require('gulp-svgmin');
var svgfallback = require('gulp-svgfallback');

nathanstilwell

(function (global) {

  //
  //  Vars
  //

  var prefix = 'meetup-makes-it-magical--';
  var magicStyleUrl = 'https://cdn.rawgit.com/nathanstilwell/54f147004fc83b5d3885/raw/22ab7a581c5377ff2c679a93f6c02f1d1c2f1cdc/magical.css';
  var supercornUrl = 'https://raw.githubusercontent.com/upright-netizen/uprightnetizen.com/102d1d84259c54189ad31110668455f167302d3c/img/supercorn.gif';
  var supercornClassname = prefix + 'supercorn';

nathanstilwell

/* Rainbows */
.meetup-makes-it-magical--rainbow-everything {
  background: -moz-linear-gradient(
    right,
    hsl(0, 100%, 50%) 1%,
    hsl(0, 100%, 50%) 14%,
    hsl(30, 100%, 50%) 14%,
    hsl(30, 100%, 50%) 28%,
    hsl(60, 100%, 50%) 28%,
    hsl(60, 100%, 50%) 42%,

nathanstilwell

Keybase proof

I hereby claim:

• I am nathanstilwell on github.
• I am nathanstilwell (https://keybase.io/nathanstilwell) on keybase.
• I have a public key ASB0Moj6IJNp1qXV0wwt-xmNdlOxIDljvs2V9THKUETbmAo

To claim this, I am signing this object:

nathanstilwell

function stringTohex(string) { 
  // convert to base64
  const base64encoded = btoa(string);

  // convert to array
  const arr = base64encoded.split('');

  // convert to string to char code
  const charCodes = arr.map((letter) => letter.charCodeAt());