Skip to content

Instantly share code, notes, and snippets.

View SteveBarnett's full-sized avatar

Steve Barnett SteveBarnett

52 followers · 10 following
View GitHub Profile
@SteveBarnett
SteveBarnett / responsinating.md
Created August 27, 2015 09:59
Thoughts from looking at some responsive apps
  • Block level elements can become select-like items of larger screens
  • Anchors / accordions become tabs
  • Simple layouts becomes centered, with side padding to keep a good measure
  • Block level display becomes inline-blocks, at break points
  • Simple step navigation (Next > Edit Campaign) becomes breadcrumbs (Name > Edit > Publish)
  • One columns becomes two, by row, to keep context
  • Use arrow instead of burgerto indicate directions / movement
  • Off-canvas stacked layers. Must have multiple navitation controls: <- arrow for back, Save and Cancel buttons.
  • Off-canvas menus come on screen when there's enough room for them.
  • Smart defauts -> Short list of popular / recent -> detailed selection if needed.
@SteveBarnett
SteveBarnett / _example.less
Last active August 29, 2015 14:04
Respond-min for less
[role="banner"] {
text-align: center;
.respond-min(50em, {
text-align: left;
});
}
@SteveBarnett
SteveBarnett / _mixins.scss
Created October 21, 2014 14:06
// https://github.com/jakearchibald/sass-ie/
$fix-mqs: false !default;
@mixin respond-min($width) {
@if $fix-mqs {
@if $fix-mqs >= $width {
@content;
}
}
@SteveBarnett
SteveBarnett / gist:8437eca78fb8254f2c9e
Created November 13, 2014 10:38
Basic HTML
<html>
<body>
<h1>Heading 1</h1>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h5>Heading 5</h4>
<h6>Heading 6</h6>
<ul>
@SteveBarnett
SteveBarnett / List of Nice FED Things
Last active August 29, 2015 14:11
List of things we need to take into account:
1. normalize.css
2. Border-Box http:/paulirish.com/2012/box-sizing-border-box-ftw/
3. IE Stylesheet Mixin for SASS: http://jakearchibald.github.io/sass-ie/
List of things we can use to make life better:
1. Sass http://sass-lang.com/ (preferred) or Less http://lesscss.org/
2. https://github.com/at-import/modular-scale
3. Powerful SASS Grid: http://susy.oddbird.net/
4. CSS philosophy http://www.smacss.com/
@SteveBarnett
SteveBarnett / Event Notes.md
Last active August 29, 2015 14:17 — forked from maban/Event Notes.md

About the speaker

About the talk

@SteveBarnett
SteveBarnett / post.html
Created April 23, 2015 13:25
Amazing woman in agile speakers
<a href="http://twitter.com/lissijean">@lissijean</a> <a href="http://twitter.com/lunivore">@lunivore</a> <a href="http://twitter.com/llillian">@llillian</a> <a href="http://twitter.com/nativeWired">@nativeWired</a> <a href="http://twitter.com/risingLinda">@risingLinda</a>
<a href="http://twitter.com/dianaOfPortland">@dianaOfPortland</a> <a href="http://twitter.com/estherderby">@estherderby</a> <a href="http://twitter.com/apaipi">@apaipi</a> <a href="http://twitter.com/darciD">@darciD</a> <a href="http://twitter.com/kkirk">@kkirk</a>
<a href="http://twitter.com/grushkay">@grushkay</a> <a href="http://twitter.com/samlaing">@samlaing</a> <a href="http://twitter.com/karen_greaves">@karen_greaves</a> (yay! We made the list;) )
<a href="http://twitter.com/joperold">@joperold</a> <a href="http://twitter.com/candicemesk">@candicemesk</a> <a href="http://twitter.com/stephbysouth">@stephbysouth</a> <a href="http://twitter.com/smamol">@smamol</a> <a href="http://twitter.com/kb2bkb">@kb2bkb</a>
<a href="http://twitter.c
@SteveBarnett
SteveBarnett / wishlist.md
Last active August 29, 2015 14:20
Talk Wishlist for CTFEDs

CTFEDs talk topic wishlist

  • Front-end testing
  • Offline
  • Accessibility
  • Browser-based games
  • Workflow strategies and techniques
  • Case studies
  • Prototyping in HTML, CSS, and JavaScript
  • Style Guides and Pattern Labs
@SteveBarnett
SteveBarnett / index.md
Last active August 29, 2015 14:20
Learn to code in Cape Town
@SteveBarnett
SteveBarnett / lists.md
Created May 18, 2015 08:50
Order list trickery

My ordered list:

  1. foo
  2. bar
  3. baz

My ordered list that keeps changing and I keep changing the numbers and arg what a pain:

  1. baz
  2. foo