Skip to content

Instantly share code, notes, and snippets.

View ptb's full-sized avatar

Peter T Bosse II ptb

57 followers · 0 following
View GitHub Profile
@ptb
ptb / features.txt
Created March 29, 2014 11:21
Supported browser features
box-sizing supported by: <bit.ly/HM42F3>
Chrome, IE 8+, Firefox (-moz), Safari 5.1+, Opera
iOS <= 4 & Android <= 2.3 (-webkit), Firefox (-moz)
:before and :after pseudo-elements supported by:
Chrome, IE 8+, Firefox, Safari, Opera 4.0+:
::before and ::after pseudo-elements supported by:
Chrome, IE 9+, Firefox, Safari, Opera 7.0+:
<mzl.la/Q5hf09> <bit.ly/YCpGPd> <bit.ly/XV046x>
@ptb
ptb / reference.html
Created March 26, 2014 12:50
CSS Reference and Sort Order
<!DOCTYPE html>
<html lang='en' xmlns='http://www.w3.org/1999/xhtml'>
<head>
<meta charset='utf-8'>
<title>CSS Reference and Sort Order</title>
<style>
body {
counter-reset: linenumbers;
margin-left: 2em; }
@ptb
ptb / messages.html
Last active October 25, 2023 05:36
Messages reimplementation of http://www.idangero.us/framework7 using SVG. See: http://rawgithub.com/ptb/9692359/raw/2cf382192ebea6305b8313d47a3c5d48de5d2577/messages.html
<!DOCTYPE html>
<html class='no-js' lang='en' xml:lang='en' xmlns='http://www.w3.org/1999/xhtml'>
<head>
<meta charset='UTF-8' />
<title>Messages</title>
<meta content='initial-scale=1, width=device-width' name='viewport' />
<style type='text/css'>
*, *:before, *:after {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
@ptb
ptb / gist:9162480
Created February 22, 2014 21:10
CA_COLOR_OPAQUE=1 /Applications/Xcode.app/Contents/Developer/Platforms/iPhoneSimulator.platform/Developer/Applications/iPhone\ Simulator.app/Contents/MacOS/iPhone\ Simulator
@ptb
ptb / _slide-horizontal.sass
Created February 22, 2014 20:53
=slide-horizontal
.slideleft, .slideright
-webkit-animation-timing-function: ease-in-out
.slideleft
&.in
-webkit-animation-name: slideLeftIn
&.out
-webkit-animation-name: slideLeftOut
@ptb
ptb / index.html
Last active August 29, 2015 13:56
<!DOCTYPE html>
<html>
<head>
<meta charset='UTF-8'/>
<title></title>
</head>
<body>
<div id='main'></div>
<script data-main='js/main.js' src='js/require.js'></script>
</body>
@ptb
ptb / activity-indicator.css
Last active January 3, 2016 15:39
.loading::after{display:inline-block;content:'';width:20px;height:20px;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%238c8c8c'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2f%3e%3cuse%20xlink%3ahref%3d'%23l'%20opacity%3d'.27'%20transform%3d'rotate(60%2060%2c60)'%2f%3e%3cuse%20xlink%3ahref%3d'%23l'%20opacity%3d'.27'%20transform%3d'rotate(90%2060%2c60)'%2f%3e%3cuse%20xlink%3ahref%3d'%23l'%20opacity%3d'.27'%20transform%3d'rotate(120%2060%2c60)'%2f%3e%3cuse%20xlink%3ahref%3d'%23l'%20opacity%3d'.27'%20transform%3d'rotate(150%2060%2c60)'%2f%3e%3cuse%20xlink%3ahref%3d'%23l'%20opacity%3d'.37'%20transform%3d'r
@ptb
ptb / reference.html
Created January 17, 2014 16:41
CSS Reference
<!DOCTYPE html>
<html lang='en' xmlns='http://www.w3.org/1999/xhtml'>
<head>
<meta charset='utf-8'>
<title>CSS Reference and Sort Order</title>
<style>
body {
counter-reset: linenumbers;
margin-left: 2em; }
@ptb
ptb / reference.html.haml
Created January 17, 2014 16:33
CSS Reference
!!! 5
%html{:lang => 'en', :xmlns => 'http://www.w3.org/1999/xhtml'}
%head
%meta{:charset => 'utf-8'}/
%title CSS Reference and Sort Order
:sass
body
counter-reset: linenumbers
@ptb
ptb / gist:5886864
Last active December 19, 2015 02:59
token based ActiveRecord
SEED = 12345678901
def self.find_by_token(token)
id = token.reverse.to_i(36) - Thing::SEED
find(id)
end
def token(input = self.to_param)
(input.to_i + Thing::SEED).to_s(36).reverse
end