Skip to content

Instantly share code, notes, and snippets.

View mathewsanders's full-sized avatar

Mathew Sanders mathewsanders

View GitHub Profile
@mathewsanders
mathewsanders / gist:82311409978066b02932
Last active August 29, 2015 14:05
Calculate a random delay for animation
// Playground - noun: a place where people can play
// Running in Xcode6-Beta5
import UIKit
var delay : NSTimeInterval
// best appraoch: use arc4random_uniform (benefit you don't have to seed rand())
delay = NSTimeInterval(arc4random_uniform(900)+100) / 1000
@mathewsanders
mathewsanders / Random Playground
Last active August 29, 2015 14:06
Playground for random numbers
// Playground - noun: a place where people can play
import UIKit
// delay is type NSTimeInterval (alias for type 'Double')
var delay:NSTimeInterval
// random number btween 1.0 and 20.0
delay = NSTimeInterval(arc4random_uniform(20))
@mathewsanders
mathewsanders / gist:3f557b632f9be8180d2c
Last active August 29, 2015 14:06
animateWithDuration and delay
let openAnimationDuration = 0.5
let numberOfSecondsToPresent = 1
let closeAnimationDuration = 0.5
UIView.animateWithDuration(openAnimationDuration, animations: {
// do changes to animate showing the popover here...
}, completion: { finished in
<template>
<div class="cafe-card">
<h2> {{ name }}</h2>
<p>Airy neighborhood coffee house with daily roasted espresso &amp; drip coffee, plus bagels &amp; pastries.</p>
<h3>Hours</h3>
<p>Mon-Fri: 6:30-8</p>
<p>Sat-Sun: 8-8</p>
<p>{{ address }}</p>
</div>
</template>
<template>
<div class="cafe-card">
<h2> {{ name }}</h2>
<p>Airy neighborhood coffee house with daily roasted espresso &amp; drip coffee, plus bagels &amp; pastries.</p>
<h3>Hours</h3>
<p>Mon-Fri: 6:30-8</p>
<p>Sat-Sun: 8-8</p>
<p>{{ address }}</p>
</div>
</template>
@mathewsanders
mathewsanders / index.html
Created February 20, 2016 17:13
Design in the browser, activity 1: semantic markup
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Coffee Finder ☕️ New York</title>
</head>
<body>
<nav>
<h1>☕️ Coffee Finder <a >New York</a></h1>
@mathewsanders
mathewsanders / default.css
Last active February 20, 2016 17:30
Design in the browser, activity 2: add basic styles
/* Not great practice, but for a quick start I like to reset all elements to 1rem */
* {
font-size: 1rem;
color: #4A4A4A;
}
h1, h2, h3, h4, h5 {
margin: 0;
}
@mathewsanders
mathewsanders / index.html
Created February 20, 2016 17:19
Design in the browser, activity 3: cafe card extract
<div class="cafe-card">
<h1>Daily Press</h1>
<p class="description">Airy neighborhood coffee house with daily roasted espresso & drip coffee, plus bagels & pastries.</p>
<dl class="address">
<dt>Address</dt>
<dd>505 Franklin Ave, Brooklyn, NY 11238</dd>
</dl>
<div class="map"></div>
</div>
@mathewsanders
mathewsanders / index.html
Last active February 20, 2016 17:22
Design in the browser, activity 3: cafe card component tag
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>☕️ Coffee Finder New York</title>
</head>
<body>
<nav>
<h1>☕️ Coffee Finder <a href="#">New York</a></h1>
@mathewsanders
mathewsanders / CafeCard.vue
Last active February 20, 2016 17:28
Design in the browser, activity 3: extract repeating elements
<!-- template code -->
<template>
<div class="cafe-card">
<h1>Cafe Grumpy</h1>
<p class="description">Hip local coffeehouse chain serving a range of house-roasted brews in a relaxed setting.</p>
<dl class="address">
<dt>Address</dt>
<dd>224 W 20th St, New York, NY 10011</dd>
</dl>
<div class="map"></div>