saywassup

CSS Media Queries: Best Practices

• Media queries have many features, but min-width is the most practical one, the one you should assume to use most of the time.
• Only use em within media query definitions, never pixels.
• Until there's wider rem support within media query, rem should be avoided in media query definitions as well.
• Assuming mobile is 320px and the body font size is 16px, then the breakpoint indicating mobile width in profile orientation would be 20em (320/16).
• Choose breakpoint values to serve the content, not to serve device deminsions.
• Never use media queries to define styles for the smallest viewport size.
• Use media queries to “enhance” or add or alter styles when the browser has a wider (or taller) vi

lolmaus

This is a fork of SaladFork's reporter: https://gist.github.com/SaladFork/15683b00388bfe1d1458

This fork has the "No try/catch" checkbox which lets you debug failed assertions in browser dev tools.

Instructions

1. Put reporter.js in tests/helpers/reporter.js

basham

CSS units

Recommendations of unit types per media type:

Media	Recommended	Occasional use	Infrequent use	Not recommended
Screen	em, rem, %	px	ch, ex, vw, vh, vmin, vmax	cm, mm, in, pt, pc
Print	em, rem, %	cm, mm, in, pt, pc	ch, ex	px, vw, vh, vmin, vmax

Relative units

Relative units

elmendalerenda

set encoding=utf-8
set nocompatible                  " Must come first because it changes other options.

syntax enable                     " Turn on syntax highlighting.

set tabstop=2                     " Global tab width.
set shiftwidth=2                  " And again, related.
set expandtab                     " Use spaces instead of tabs
set softtabstop=2                 " Makes the spaces feel like real tabs

chadmaughan

#!/bin/sh
# this hook is in SCM so that it can be shared
# to install it, create a symbolic link in the projects .git/hooks folder
#
#       i.e. - from the .git/hooks directory, run
#               $ ln -s ../../git-hooks/pre-commit.sh pre-commit
#
# to skip the tests, run with the --no-verify argument
#       i.e. - $ 'git commit --no-verify'

martinnormark

(function () {

  MyApp.AlertView = Backbone.View.extend({

		tagName: "div",

		className: "alert fade",

		template: ["<a href=\"#\" data-dismiss=\"alert\" class=\"close\">&times;</a>", "<strong>{{ title }}</strong>", "{{ message }}"].join("\n"),

jlong

var parser = document.createElement('a');
parser.href = "http://example.com:3000/pathname/?search=test#hash";

parser.protocol; // => "http:"
parser.hostname; // => "example.com"
parser.port;     // => "3000"
parser.pathname; // => "/pathname/"
parser.search;   // => "?search=test"
parser.hash;     // => "#hash"
parser.host;     // => "example.com:3000"

joelnet

Choose a ticket class: <select id="tickets"></select> 

<p id="ticketOutput"></p> 
        
<script id="ticketTemplate" type="text/x-jquery-tmpl"> 
    {{if chosenTicket}}
        You have chosen <b>${ chosenTicket().name }</b>
        ($${ chosenTicket().price })
        <button data-bind="click: resetTicket">Clear</button>
    {{/if}}

zhengjia

=Navigating=
    visit('/projects')
    visit(post_comments_path(post))

=Clicking links and buttons=
    click_link('id-of-link')
    click_link('Link Text')
    click_button('Save')
    click('Link Text') # Click either a link or a button
    click('Button Value')