Skip to content

Instantly share code, notes, and snippets.

Avatar

Daniel Eden daneden

View GitHub Profile
View Books on Type.markdown

Books on Type

A list of my favorite books on typography

  • “The Chicago Manual of Style”
  • “The Elements of Typographic Style” – Robert Bringhurst
  • “The Vignelli Canon” – Massimo Vignelli
  • “The Geometry of Type” – Stephen Coles
  • “Grid Systems in Graphic Design” – Josef Müller-Brockmann
  • Butterick’s Practical Typography
View index.html
<!DOCTYPE html>
<html>
<head>
<!-- Meta -->
<meta charset="utf-8">
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Toast.css Nested Divs</title>
<!-- /Meta -->
@daneden
daneden / keymap.cson
Created Apr 3, 2014
Add ctrl-{shift-}tab Tab/File Navigation to Atom
View keymap.cson
'body':
'ctrl-tab': 'pane:show-next-item'
'ctrl-shift-tab': 'pane:show-previous-item'
@daneden
daneden / debug.scss
Last active Aug 29, 2015
Directives inside property expressions
View debug.scss
.grid--debug-cols:before {
content: '';
position: absolute;
margin: 0 auto;
top: 0;
right: 0;
bottom: 0;
left: 0;
$cols: 5;
@daneden
daneden / SassMeister-input.scss
Created Jun 14, 2014
Generated by SassMeister.com.
View SassMeister-input.scss
// ----
// libsass (v0.8.6)
// ----
/*-----------------------------------*\
$TOAST-GRID
An insane grid.
You'd be mad to use it.
View type.variables.scss
// Group: Font & Baseline Sizes
$base-font-size: (13/16)*100%;
$baseline-unitless: 23 / (16*($base-font-size/100%));
$baseline: $baseline-unitless * 1rem;
View bgimage.mixin.scss
// Not shown here is the Grunt task that takes source SVGs, creates PNGs (later optimised by imageoptim) and minified SVGs
@mixin bg-image($image, $size: 16px, $repeat: no-repeat, $position: center) {
// SVG backgrounds with PNG fallback
// All browsers that support multiple backgrounds also support SVGs. Woohoo!
background-image: image-url("#{$image}.png");
// inline-image requires Compass
background-image: inline-image("#{$image}.min.svg"), none;
background-size: $size;
View grid.layout.scss
/*-----------------------------------*\
Grid (derived from Toast: http://daneden.github.io/Toast)
An insane grid.
You'd be mad to use it.
Usage
=====
View grid.debug.scss
// Involves some hacky manually-coded pixel values, but a lifesaver for debugging grids
@if $debug {
.debug--cols {
@each $group in $col-groups {
.grid--debug-#{$group}-cols:before {
content: '';
position: absolute;
margin: 0 auto;
top: 0;
right: 0;
View webhook.php
<?php
// Navigate to the git repo on the server
$command = 'cd /location/of/design-cabin-repo/ ';
// Pull changes
$command .= '&& git pull ';
// Sync changes to the Dropbox folder, deleting files that aren't present in the repo and excluding select files
$command .= '&& rsync ./* /location/of/Dropbox/Design\ Cabin/ --delete --exclude=".git"'
You can’t perform that action at this time.