You start with this:
And must end up with this:
<!DOCTYPE html> | |
<html> | |
<head> | |
<meta charset="utf-8"> | |
<style> | |
* { | |
margin: 0; padding: 0; | |
-webkit-box-sizing: border-box; | |
-moz-box-sizing: border-box; | |
-ms-box-sizing: border-box; |
# As of right now, it will only work with a rdio-cli build from https://github.com/EtienneLem/rdio-cli/tree/commands-list | |
# Rdio completions | |
rdio_commands=(`rdio commands`) | |
compctl -k rdio_commands rdio |
// Fairly safe way to visually hide content, but make it accessible to screen readers | |
.visually-hidden { | |
position: absolute; | |
left: -9999px; | |
height: 1px; | |
} | |
@media screen and (max-width: 700px) { | |
// Again, accessible to screen readers | |
// Example: <a href="/login" class="icon icon-twitter"><span class="mobile-offscreen">Single-click </span> log in with Twitter</a> |
<?xml version="1.0" encoding="UTF-8"?> | |
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd"> | |
<plist version="1.0"> | |
<dict> | |
<key>beforeRunningCommand</key> | |
<string>saveActiveFile</string> | |
<key>command</key> | |
<string>#!/usr/bin/env ruby | |
# encoding: utf-8 |
# Original BrowserDetect.js: @Teevio (http://teev.io/blog/text/13423292) | |
# Original idea: @rogie (http://rog.ie/post/9089341529/html5boilerplatejs) | |
# CoffeeScript implementation: @EtienneLem | |
class BrowserDetect | |
@init: -> | |
browser = @searchString(@dataBrowser) || "An unknown browser" | |
version = @searchVersion(navigator.userAgent) || @searchVersion(navigator.appVersion) || "An unknown version" | |
os = @searchString(@dataOS) || "An unknown OS" |
<?xml version="1.0" encoding="UTF-8"?> | |
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd"> | |
<plist version="1.0"> | |
<dict> | |
<key>beforeRunningCommand</key> | |
<string>saveActiveFile</string> | |
<key>command</key> | |
<string>#!/usr/bin/env ruby | |
# encoding: utf-8 |
// Scss Utils | |
// @author EtienneLem | |
// CSS3 misc | |
@mixin rounded ( $radius, $prefix:'' ) { | |
@include prefixes(border-radius, $radius, $prefix); | |
} | |
@mixin box-shadow ( $value ) { | |
@include prefixes(box-shadow, $value); |
# GIFme | |
# This is a really simple/stupid command line (specifically zsh) function to copy public Dropbox links to your gifs. | |
# | |
# Put this somewhere in your .zshrc and replace {{YOUR_PUBLIC_ID}} with your public Dropbox ID (find this by going to dropbox.com, finding a file in your "Public" folder, selecting it and clicking "Copy public link", and looking for the long number in the URL) | |
# | |
# This assumes your gifs (and other images you want to share) are stored in your Dropbox "Public" folder in a directory called "gifs". | |
# This whole thing ain't pretty, and it could be much better. But it's a start. | |
# | |
# Usage: | |
# "$ gifme yup.gif" will copy a public link to "{{Dropbox Directory}}/Public/gifs/yup.gif" |