Skip to content

Instantly share code, notes, and snippets.

@davidpots
davidpots / oocss-resources.md
Last active August 29, 2015 14:02
OOCSS Articles, Videos, and Resources

##Articles

An Introduction To Object Oriented CSS (OOCSS)
Great intro from Smashing Magazine on the topic of OOCSS. On the topic of a multi-class approach to declaring styles:

Some may feel that this type of styles abstraction clutters the HTML and goes against the principle of separating markup from presentation.

But putting aside any debates about how this might affect the markup, no one can question that this abstraction has now made it easier to track down and modify the common styles that are used to structure these three elements.

About HTML Semantics and Front-End Architecture
by Nicolas Gallagher. I love this article so much -- it says it all (IMO) perectly. Amongst other things, great talk about semantics as well as why he prefers a multi-class approach vs. that of @extend.

@davidpots
davidpots / 500 days of summer (timeline)
Created May 20, 2014 19:13
"500 Days of Summer" breakdown of the movie timeline
500 DAYS OF SUMMER -- breakdown of the movie timeline
by David Potsiadlo (@davidpots)
------------------------------------------------------------------------
============================================================================================================
THE ORDER SEEN IN THE MOVIE
============================================================================================================
488 0:00:51 on a bench, she has the ring
1 0:01:10 tom his his board meeting. jan 8th. when he first sees summer in his office.
@davidpots
davidpots / gist:8627712
Created January 26, 2014 03:01
Intro Tab variations for "Take On Me" by A-ha.
Intro Riff, Version 1
The Marty Schwartz version (http://www.youtube.com/watch?v=XWWM6sn0opU). The 2nd and 3rd bars use an open E string as liberally as possible, which is nice for minimizing movement of your left hand.
e-|---2--2----------------|---0--0---0--4--4--5--7---|-
B-|----------3------------|--------------------------|-
G-|--------------4---4----|--------------------------|-
D-|-----------------------|--------------------------|-
A-|-----------------------|--------------------------|-
E-|-----------------------|--------------------------|-
@davidpots
davidpots / gist:6809158
Created October 3, 2013 12:38
Shownotes JSON feed of podcasts. Keeping for reference here as I transition app away from Rails 4 and away from Sqlite (moving to Rails 3 + PG), starting from scratch.
[
{
"name": "99% Invisible",
"description": "A Tiny Radio Show about Design with Roman Mars",
"url_web": "http://99percentinvisible.org",
"url_rss": "http://feeds.99percentinvisible.org/99percentinvisible",
"url_itunes": "https://itunes.apple.com/us/podcast/id394775318",
"image": "http://cdn.99percentinvisible.org/wp-content/uploads/powerpress/99invisible-logo-1400.jpg"
},
{
@davidpots
davidpots / all songs, ungrouped (original source JSON)
Created September 11, 2013 12:34
Songs, grouped by key (year, artist, or title). This is the result of a Javascript exercise I'm doing to better get a handle on grouping/sorting/manipulating JSON. To see the original JSON source data I used to dynamically create each of these grouped sets, see the bottom-most file of this gist.
{
"songs": [
{
"title": "1904",
"artist": "The Tallest Man on Earth",
"year": "2012",
"web_url": "http://www.songnotes.cc/songs/78-the-tallest-man-on-earth-1904",
"img_url": "http://fireflygrove.com/songnotes/images/artists/TheTallestManOnEarth.jpg"
},
{
@davidpots
davidpots / gist:6243778
Created August 15, 2013 19:06
For viewing iPhone-sized webpages with Chrome, edit any existing Chrome bookmark and replace the URL with this. By default, Chrome cannot be manually minimized any smaller than 400px in width. This gets around that problem.
javascript:(function(){window.open('http://localhost:3000', '','width=320,height=480');})();
HEY SOUL SISTER
by Train
===============================================================================
(capo 4th fret)
INTRO
C G Am F
...Hey, hey... hey...
#
# Jekyll Generator for SCSS
#
# (File paths in this description relative to jekyll project root directory)
# Place this file in ./_plugins
# Place .scss files in ./_scss
# Compiles .scss files in ./_scss to .css files in whatever directory you indicated in your config
# Config file placed in ./_sass/config.rb
#
$(document).ready(function(){
var aboveHeight = 138;
$(window).scroll(function(){
if ($(window).scrollTop() > aboveHeight){
$('.sticky_nav').fadeIn("fast");
} else {
$('.sticky_nav').fadeOut("fast");
}
});
});
def create
@project_todo_comment = ProjectTodoComment.new(params[:project_todo_comment])
@project_todo = ProjectTodo.find(@project_todo_comment.project_todo_id)
@project = Project.find(@project_todo.project_id)
respond_to do |format|
if @project_todo_comment.save
format.html { redirect_to project_url(@project.id), notice: 'Project todo comment was successfully created.' }
format.json { render json: @project_todo_comment, status: :created, location: @project_todo_comment }
else