This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <% wrap_layout :layout do %> | |
| <article> | |
| <h1><%= current_article.title %></h1> | |
| <%= yield %> | |
| </article> | |
| <% end %> |
davidpett
/ requestAnimFrame
Last active
December 10, 2015 00:59
cross browser requestAnimationFrame
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| window.requestAnimFrame = (function() { | |
| return window.RequestAnimationFrame || | |
| window.webkitRequestAnimationFrame || | |
| window.mozRequestAnimationFrame || | |
| window.oRequestAnimationFrame || | |
| window.msRequestAnimationFrame || | |
| function(callback) { | |
| window.setTimeout(callback, 1000/60); | |
| }; | |
| })(); |
davidpett
/ viewport workaround
Created
January 16, 2013 01:30
I ran into an issue that device-width would return the portrait width of the device, but I needed to target the landscape width. In order to accomplish this, initial-scale needs to be set, but setting it doesn't allow for a retina display on iPhone to accurately get the width of the device, so I created this workaround.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <meta name="viewport" content=""> | |
| <script> | |
| var viewportmeta = document.querySelector("meta[name=viewport]"); | |
| if (/iPhone/i.test(navigator.userAgent) && window.devicePixelRatio > 1) { | |
| if (viewportmeta) { | |
| viewportmeta.setAttribute('content', 'width=device-width'); | |
| } | |
| } else { | |
| if (viewportmeta) { | |
| viewportmeta.setAttribute('content', 'width=device-width,initial-scale=1'); |
davidpett
/ SCSerializer.js
Created
February 1, 2013 18:25
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| DS.SCSerializer = DS.JSONSerializer.extend({ | |
| extractMany: function(loader, pre_json, type, records) { | |
| var root = this.rootForType(type), | |
| plural = this.pluralize(root), | |
| json = {}; | |
| json[plural] = pre_json; | |
| this.sideload(loader, type, json, plural); | |
| this.extractMeta(loader, type, json); |
davidpett
/ SCAdapter.js
Created
February 1, 2013 18:35
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| DS.SCAdapter = DS.RESTAdapter.extend({ | |
| serializer: DS.SCSerializer, | |
| ajax: function(url, type, hash) { | |
| hash.url = url; | |
| hash.type = type; | |
| hash.dataType = 'json'; | |
| hash.contentType = 'application/json; charset=utf-8'; | |
| hash.context = this; |
davidpett
/ app.js
Last active
December 15, 2015 05:39
— forked from Atinux/app.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /* | |
| ** Client side - /public/src/app.js | |
| */ | |
| var myApp = { | |
| // Collections | |
| Collections: { | |
| list: Backbone.Collection.extend() | |
| }, | |
| // Views |
davidpett
/ _link.scss
Last active
December 16, 2015 01:39
a mixin that removes hover/focus states of links on mobile size to get around the "virtual cursor"
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| @mixin link($color, $color-hover) { | |
| color: $color; | |
| @include responsive($large) { | |
| &:hover, | |
| &:focus { | |
| color: $color-hover; | |
| } | |
| } | |
| } |
davidpett
/ _over.scss
Last active
December 16, 2015 20:59
hide hover states on touch devices.
leverages modernizr's html classes and SCSS magical &
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| @mixin over { | |
| html.no-touch & { | |
| &:hover, | |
| &:focus { | |
| @content; | |
| } | |
| } | |
| html.touch & { | |
| &:active { | |
| @content; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /* | |
| * Easing Equations ported to CSS by @matthewlein - http://matthewlein.com/ceaser/ | |
| * Converted to SCSS vars by @pettpett | |
| * | |
| * sample usage: | |
| * a { | |
| * color: #ff0000; | |
| * transition: color 0.5s $easeOutQuint; | |
| * &:hover, |
OlderNewer