Skip to content

Instantly share code, notes, and snippets.

View erikakers's full-sized avatar

Erik Akers erikakers

View GitHub Profile
echo "Installing Dependencies"
xcode-select --install
echo "Installing Homebrew"
if test ! $(which brew); then
/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"
fi
echo "Installing Homebrew Packages"
packages=(
@function palette($palette, $tone: 'base') {
@return map-get(map-get($palettes, $palette), $tone);
}
// Project Color Map
// This is used to create font modifier classes to get around setting colors
// on specific elements or styles.
$palettes: (
white: (
base: #fff
$iterator: 1;
$header-ratio: 4;
$max-heading: 7;
$max-font-size: 40px;
@while $iterator < $max-heading {
$font-size: ($max-font-size + $header-ratio) - $iterator * $header-ratio;
h#{$iterator}, .h#{$iterator} {
@include adjust-font-size-to($font-size);
@erikakers
erikakers / Constants.js
Last active August 29, 2015 14:02
Javascript: App Width Constants
App.Constants.DESKTOP = 990,
App.Constants.TABLETLG = 980,
App.Constants.TABLETSM = 768,
App.Constants.MOBILE = 767;
App.Constants.MOBILEMQ = 'only screen and (max-width: ' + App.Constants.MOBILE + 'px)',
App.Constants.TABLETMQ = 'only screen and (max-width: ' + App.Constants.TABLETLG + 'px)',
App.Constants.DESKTOPMQ = 'only screen and (min-width: ' + App.Constants.DESKTOP + 'px) and (max-width: 1199px)';
App.Constants.DESKTOPLGMQ = 'only screen and (min-width: 1200px)';
@erikakers
erikakers / Helper.ResizeThrottle.js
Last active August 29, 2015 14:01
Javascript: Throttle Resize Handler with PubSub event broadcast
App.Helpers.resizeThrottle = (function(throttle) {
throttle.init = function() {
var updateLayout = _.debounce(function(e) {
console.log('Throttled resize event. Broadcasting...');
$.publish('resize');
}, 500);
if (window.addEventListener) {
window.addEventListener("resize", updateLayout, false);
}
};
@erikakers
erikakers / ConstructorFeatureModule.js
Last active August 29, 2015 14:01
Javascript: Loose Augmentation Module Pattern with LoDash Extends Object using the constructor method. Used for data intensive functions.
App.Features.sampleFeature = (function(sample) {
function Feature(element) {
this.$el = element;
};
Feature.Constants = {
};
_.extend(Feature.prototype, App.Class, {
@erikakers
erikakers / Helpers.GetWidth.js
Last active August 29, 2015 14:01
Get Widths Helper
/**
* Get Width Helper - This is re-run on every debouced resize event that will help setup our responsiveness
*/
App.Helpers.getWidth = function() {
// Lets setup our widths
App.Helpers.innerWidth = !window.innerWidth ? document.documentElement.clientWidth : window.innerWidth;
// Queries based on screen width
App.Devices.desktop = App.Helpers.innerWidth > App.Constants.DESKTOP,
@erikakers
erikakers / Helper.CheckWidths.js
Last active August 29, 2015 14:01
Responsive Width Conditions
App.Helpers.checkWidth = (function(conds) {
conds.init = function() {
$.subscribe('resize', function(){
console.log('resize event fired');
App.Helpers.getWidth();
// if mobile width, mobile media query or mobile ua returns true, broadcast a resize:mobile event
if ( App.Devices.mobile || App.Devices.mobileMQ || App.Devices.mobileCheck ) $.publish('resize:mobile');
@erikakers
erikakers / gist:812acd28f46e95e28fe8
Created May 14, 2014 14:37
SCSS: Mixin for Transparency in most Browsers
@mixin transparent($color, $alpha) {
$rgba: rgba($color, $alpha);
$ie-hex-str: ie-hex-str($rgba);
background-color: transparent;
background-color: $rgba;
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#{$ie-hex-str},endColorstr=#{$ie-hex-str});
zoom: 1;
}
@erikakers
erikakers / gist:9690805
Created March 21, 2014 17:04
Underscore extended object module
var Feature = (function(){
var Feature = function(){
this.init();
};
_.extend(Feature.prototype, {
init: function() {
console.log("Feature!");
}