Skip to content

Instantly share code, notes, and snippets.

View matthewcrist's full-sized avatar

Matthew Crist matthewcrist

View GitHub Profile
* {
-webkit-box-sizing: border-box; /* Safari < 5.1, Chrome < 10 */
-moz-box-sizing: border-box; /* Firefox, other Gecko */
box-sizing: border-box; /* Opera/IE 8+/Safari5.1+/Chrome 10+ */
}
@font-face {
font-family: 'adelle';
src: url('adelle.eot');
src: url('adelle.eot?#iefix') format('embedded-opentype'), url('adelle.woff') format('woff'), url('adelle.ttf') format('truetype'), url('adelle.svg#Adelle') format('svg');
font-weight: 300;
font-style: normal;
}
@matthewcrist
matthewcrist / breakpoint-example.html
Created April 3, 2012 20:00 — forked from stonehippo/breakpoint-example.html
Targeting tablets with media queries, but not tripping those queries on the desktop
<!-- The breakpoint widths below are from a specific client project and probably should be moved to standard 320/460/768 breakpoints in other usage -->
<!DOCTYPE html>
<html lang="en">
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
<style>
body {color: #333; background-color: #eee; font-family: 'Georgia';}
.hidden { display: none; text-indent: 3em;}
@media screen and (max-width: 653px) {
@matthewcrist
matthewcrist / gist:2353575
Created April 10, 2012 18:40
CSS3 translate3d for WebKit
selector {
-webkit-transform: translate3d(0,0,0);
}
@matthewcrist
matthewcrist / data-uri.css
Created May 6, 2012 19:04
Example of Data URI Image in CSS
.selector {
background-repeat: no-repeat;
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAASwAAAEsCAIAAAD2HxkiAAAD7GlDQ1BpY2MAAHjajZTPbxRlGMc/u/POrAk4B1MBi8GJP4CQQrZgkAZBd7vLtlDLZtti25iY7ezb3bHT2fGd2fIjPXHRG6h/gIocPJh4MsFfES7AQQMJQUNsSEw4lPgjRBIuhtTDTHcHaMX39Mzzfp/v9/s875OBzOdV33fTFsx6oaqU8tb4xKSVuUGaZ1hDN2uqduDnyuUhgKrvuzxy7v1MCuDa9pXv//OsqcnAhtQTQLMW2LOQOga6a/sqBOMWsOdo6IeQeRboUuMTk5DJAl31KC4AXVNRPA50qdFKP2RcwLQb1Rpk5oGeqUS+nogjDwB0laQnlWNblVLeKqvmtOPKhN3HXP/PM+u2lvU2AWuDmZFDwFZIHWuogUocf2JXiyPAi5C67If5CrAZUn+0ZsZywDZIPzWtDoxF+PSrJxqjbwLrIF1zwsHROH/Cmxo+HNWmz8w0D1VizGU76J8Enof0zYYcHIr8aNRkoQj0gLap0RqI+bWDwdxIcZnnRKN/OOLR1DvVg2WgG7T3VbNyOPKsnZFuqRLxaxf9sBx70BY9d3go4hSmDIojy/mwMToQ1YrdoRqNa8XktHNgMMbP+255KPImzqpWZSzGXK2qYiniEX9Lbyzm1DfUqoVDwA7Q93MkVUXSZAqJjcd9LCqUyGPho2gyjYNLCYmHROGknmQGZxVcGYmK4w6ijsRjEYWDvQomUrgdY5pivciKXSIr9oohsU/sEX1Y4jXxutgvCiIr+sTedm05oW9R53ab511aSCwqHCF/uru1taN3Ur3t2FdO3XmguvmIZ7nsJzkBAmbayO3J/i/Nf7ehw3FdnHvr2tpL8xx+3Hz1W/qifl2/pd/QFzoI/Vd9QV/Qb5DDxaWOZBaJg4ckSDhI
@matthewcrist
matthewcrist / index.html
Created September 11, 2012 19:18
Responsive vertical/horizontal image centering with CSS only
<img width="500" height="335" title="" alt="" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAfQAAAFPCAIAAAA0uatrAAA4ZElEQVR42u2d919TW9aH5++aO6YSEnrvqAgCAiIiWLCigiJ2EVBAAbGLV7BgRzqKihQBUXpNIYE0Zub96V05x8twlRIgQHLyzef53GGQkpwcnr322muv/Y/JySkAAAAc4x+4BAAAALkDAACA3AEAAEDuAAAAIHcAAACQOwAAQO4AAAAgdwAAAJA7AAAAyB0AAADkDgAAkDuuAgAAQO4AAAAgdwAAAJA7AAAAyB0AAADkDgAAkDsAAADIHQAAAOQOAAAAcgcAAAC5AwAA5I6rAAAAkDsAAADIHQAAAOQOAAAAcgcAAAC5AwAA5A4AAAByBwAAALkDAACA3AEAAEDuAAAAuQMAAIDcAQAAQO4AAAAgdwAAAJA7AAAAyB0AACB3AAAAkDsAAADIHQAAAOQOAAAAcgcAAMgdAAAA5A4AAAByBwAAALkDAACA3AEAAEDuAAAAuQMAAIDcAQAAQO4AAAAgdwAAAJA7AABA7gAAACB3AAAAkDsAAADIHQAAAOQOAAAAcgcAAMgdAAAA5A4AAAByBwAAALkDAACA3AEAAHIHAAAAuQMAAIDcAQAAQO4AAAAgdwAAAJA7AABA7gAAACB3AAAAkDsAAADIHQAAAOQOAACQOwAAAMgdAAAA5A4AAAByBwAAALkDAACA3AEAAHIHAAAAuQMAAIDcAQAAQO4AAAAgdwAAgNwBAABA7gAAACB3AAAAkDsAAADIHQAAAOQOAACQOwAAAMgdAAAA5A4AAAByBwAAALkDAADkDgAAAHIHAAAAuQMAAIDcAQAAQO4AAAAgdwAAgNwBAABA7gAAACB3AAAAkDsAAADIHQCwUqamtOaDywW5AwBsgIkJ9fi4fFwuVypVC6NSTajVGu2U1mAw6vVGiB5yBwAsJ5rWanU6nUF
@matthewcrist
matthewcrist / Turbolinks
Last active December 15, 2015 09:19
Add this to your Gemfile
@matthewcrist
matthewcrist / gist:5237803
Created March 25, 2013 15:10
Add this to your application.js for the asset pipeline
//= require turbolinks
---
title: Images
layout: guide
---
<h1>Images</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec libero erat, adipiscing non pellentesque eu, rhoncus et metus. Nunc bibendum elementum ante sed pharetra. Morbi varius egestas diam, sit amet commodo nunc malesuada sed. Quisque et commodo mauris. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec libero erat, adipiscing non pellentesque eu, rhoncus et metus. Nunc bibendum elementum ante sed pharetra. Morbi varius egestas diam, sit amet commodo nunc malesuada sed. Quisque et commodo mauris.</p>
<figure class="hero-image">
@matthewcrist
matthewcrist / Stack trace
Created May 8, 2013 01:22
I was getting an error locally that I wasn't seeing on Heroku with Rails 4.0.0.rc1. Turns out, it was the gems for heroku that were causing the issue. Moving them to the production group in my Gemfile fixed it.
127.0.0.1 - - [07/May/2013 21:16:05] "GET / HTTP/1.1" 500 9297 0.1820
I, [2013-05-07T21:16:06.773109 #1714] INFO -- : Started GET "/" for 127.0.0.1 at 2013-05-07 21:16:06 -0400
F, [2013-05-07T21:16:06.811554 #1714] FATAL -- :
ArgumentError (wrong number of arguments (0 for 1)):
activesupport (4.0.0.rc1) lib/active_support/core_ext/kernel/reporting.rb:82:in `capture'
activerecord (4.0.0.rc1) lib/active_record/migration.rb:363:in `call'
actionpack (4.0.0.rc1) lib/action_dispatch/middleware/callbacks.rb:29:in `block in call'
activesupport (4.0.0.rc1) lib/active_support/callbacks.rb:392:in `_run__2942527772805940719__call__callbacks'
activesupport (4.0.0.rc1) lib/active_support/callbacks.rb:80:in `run_callbacks'
actionpack (4.0.0.rc1) lib/action_dispatch/middleware/callbacks.rb:27:in `call'