Skip to content

Instantly share code, notes, and snippets.

View kgcreative's full-sized avatar

Kevin Garcia kgcreative

View GitHub Profile
@kgcreative
kgcreative / SassMeister-input.scss
Created August 29, 2015 08:49
Generated by SassMeister.com.
// ----
// libsass (v3.2.5)
// ----
@import "bourbon/bourbon";
@import "neat/neat";
/* Marionette */
/* A responsive framework to extend skeleton grid. */
/* Updated 8/25/2015 by Kevin Garcia */
@kgcreative
kgcreative / SassMeister-input.scss
Created September 19, 2015 00:24
Generated by SassMeister.com.
// ----
// libsass (v3.2.5)
// ----
@import "bourbon/bourbon";
@import "neat/neat";
/* Marionette */
/* A responsive framework to extend skeleton grid. */
/* Updated 8/25/2015 by Kevin Garcia */
https://www.google.com/calendar/render?action=TEMPLATE&text=Ocean+Day+California+—+Monterey+Bay+Aquarium+Reception&dates=20160316T000000Z/20160316T023000Z&details=This+evening,+Monterey+Bay+Aquarium+will+host+an+invitation-only+reception+to+honor+those+who+have+helped+advance+ocean+and+coastal+health+in+our+state.+This+special+event+will+feature+sustainable+seafood+from+California+Seafood+Watch+partners+and+fine+wines+from+California%27s+coastal+communities.&location=The+Sutter+Club,+1220+9th+Street,+Sacramento,+CA,+95814#eventpage_6
@kgcreative
kgcreative / SassMeister-input.scss
Created November 13, 2015 21:17
Generated by SassMeister.com.
// ----
// libsass (v3.2.5)
// ----
@import "bourbon/bourbon";
@import "neat/neat";
// -------------------------------------------------------------------
// Global nav
@kgcreative
kgcreative / favicon.html
Created December 30, 2015 01:26
MBA Generated favicon stack
<link rel="apple-touch-icon" sizes="57x57" href="/apple-touch-icon-57x57.png">
<link rel="apple-touch-icon" sizes="60x60" href="/apple-touch-icon-60x60.png">
<link rel="apple-touch-icon" sizes="72x72" href="/apple-touch-icon-72x72.png">
<link rel="apple-touch-icon" sizes="76x76" href="/apple-touch-icon-76x76.png">
<link rel="apple-touch-icon" sizes="114x114" href="/apple-touch-icon-114x114.png">
<link rel="apple-touch-icon" sizes="120x120" href="/apple-touch-icon-120x120.png">
<link rel="apple-touch-icon" sizes="144x144" href="/apple-touch-icon-144x144.png">
<link rel="apple-touch-icon" sizes="152x152" href="/apple-touch-icon-152x152.png">
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon-180x180.png">
<link rel="icon" type="image/png" href="/favicon-32x32.png" sizes="32x32">
@kgcreative
kgcreative / 00 • Skeleton Grid • Marionette Grid • Item Grid • .scss
Last active February 27, 2016 00:03
• Skeleton Grid • Marionette Grid • Item Grid •
// -------------------------------------------------------------------
// About
// -------------------------------------------------------------------
// Grid Skeleton: http://getskeleton.com/
// Our old montereybayaquarium.org site was built using skeleton. When we
// migrated from our old system to our new sitecore CMS, we used bourbon/neat to
// write a Skeleton class framework to complement our existing styles.
//
// Unfortunately, this meant taking advantage of new features and writing responsive
// code requred us to create custom one-off classes using sass, bourbon, and neat,
@kgcreative
kgcreative / Lazy Load Image and Video
Last active January 25, 2024 16:42
Lazy Load Image and Lazy Load/Viewport autoplay video using waypoints.js. Both of these load using class-based triggers.
JQuery Lazy Load Image
--------------------------------------------------------------
jquery.lazyLoadImg - 1.1.3
Copyright © 2016 Kevin Garcia, Stanford University
Released under the The MIT License (MIT)
Requires jquery.waypoints
--------------------------------------------------------------
Jquery Lazy Load Video
--------------------------------------------------------------
@kgcreative
kgcreative / 0_smart-merge.scss
Last active April 23, 2017 20:20
Element System in SCSS
@charset 'UTF-8';
////
/// Smart merge
/// @author Kevin Garcia
////
/// Returns a merged map, a single map, or a null value, depending on the results of the function's operations
///
/// @param {map} default-map - The default map the mixin consumes
// ---------------------------------------------------------------------------
// Sweet Spot - Scroll Events
// ---------------------------------------------------------------------------
$(this).waypoint(function (direction) {
if (direction === 'down') {
console.log('Sweet Spot, scrolling down');
console.log('Reveal Panel Contents');
$this.removeAttr('data-hide-content');
} else {
@kgcreative
kgcreative / _a11ynav.js
Last active August 14, 2017 16:57
WIP - Accessible, responsive navigation with mobile toggle
'use strict';
// a11nav Module
var a11ynav = (function (e) {
// Config variables are specifically javascript objects (not jQuery) - We need these when calling Mousetrap bindings.
var config = {
menuToggle: document.getElementById('menu-toggle')
, main: document.querySelector('main, #main')
, primaryNavContainer: document.getElementById('primary-nav')
, primaryNav: document.querySelector('#primary-nav > .nav-menu')