Skip to content

Instantly share code, notes, and snippets.

View stanosmith's full-sized avatar
☯️
👽

Stanley Smith stanosmith

☯️
👽
View GitHub Profile
@stanosmith
stanosmith / api-first-with-swagger.md
Last active March 19, 2016 17:40
Notes from Boise Code Camp 2016 talk: API-First Development with Swagger by Fred Willerup.

API-First Development with Swagger

Presented by: Fred Willerup

  • Development is about balance
  • API-first (or Spec-first) as a methodology
  • Swagger issues
    • Swagger errors aren't very helpful
    • Lot's of duplicate code in the spec
  • Enable CORs in Node app
@stanosmith
stanosmith / intro-to-react-and-webpack.md
Last active July 31, 2017 06:48
Notes from Boise Code Camp 2016 talk: Intro To React and webpack

Intro To React and webpack

Presented by: Sean Timm

  • ES6/ECMAScript2015
    • Backticks enable multiline strings
    • All variables in modules are private
    • Default values in functions
    • Rest parameter
  • Spread operator
@stanosmith
stanosmith / building-apps-quickly-in-meteor.md
Last active July 31, 2017 06:48
Notes from Boise Code Camp 2016 talk: Building Apps Quickly In Meteor by Dom Ramirez

Building Apps Quickly In Meteor

Presented by: Dom Ramirez

  • Directory names are important!
  • accounts-ui package is amazing!
  • With great power comes great responsibility

Links

@stanosmith
stanosmith / brown-bag-design-dev-workflow-layer-comps.md
Last active July 31, 2017 06:46
Overview of the topics covered in my brown bag, Design & Development Workflow - Photoshop Layer Comps.

Design & Development Workflow - Photoshop Layer Comps

Since we won't be dropping Photoshop entirely out of our workflow (anytime soon), Layer Comps are something we should leverage to ease the designer/developer workflow.

What even are Layer Comps?

  • Ability to save document state
    • Visibility, Position and Appearance (Layer Style)
  • Export layer comps to files (PSD, PNG, JPG, etc) or PDF
@stanosmith
stanosmith / box-sizing.css
Created March 1, 2017 23:25
CSS box-sizing
html {
box-sizing: border-box;
}
*, *:before, *:after {
box-sizing: inherit;
}
@stanosmith
stanosmith / clearfix.css
Last active March 29, 2018 17:58
The Clearfix: Force an Element To Self-Clear its Children
/* All credit to Chris Coyier - via: https://css-tricks.com/snippets/css/clear-fix */
.selector:after {
content: "";
display: table;
clear: both;
}
@stanosmith
stanosmith / find-and-delete-orig.sh
Created March 29, 2018 18:24
Find and delete side effect files
find . -name "*.orig" -delete
// Alerts
@include alert-variant($background, $border, $text-color);
// Background Variant
@include bg-variant($parent, $color);
// Border Radius
@include border-top-radius($radius);
@include border-right-radius($radius);
@include border-bottom-radius($radius);
// Gradients
// Horizontal gradient, from left to right
//
// Creates two color stops, start and end, by specifying a color and position for each color stop.
// Color stops are not available in IE9 and below.
@mixin gradient-horizontal($start-color: #555, $end-color: #333, $start-percent: 0%, $end-percent: 100%) {
background-image: -webkit-linear-gradient(left, $start-color $start-percent, $end-color $end-percent); // Safari 5.1-6, Chrome 10+
@stanosmith
stanosmith / flexgrid.scss
Created June 14, 2018 19:12 — forked from RomanHargrave/flexgrid.scss
Tiny SCSS Flexbox Grid
/*
* Flexbox grid SCSS library
* Author: Roman Hargrave
* License: ASL 2.0
* The smallest grid system ever designed?
* */
@mixin flex-grid($classname: 'flexg', $columns: 16, $gutter: 0, $col-gutter: 10px) {
$column_name-format: #{$classname}-c-;