JawsomeJason

"use strict";

/* boilerplate from: http://stefangabos.ro/jquery/jquery-plugin-boilerplate/ */
( function( $ ) {


    $.fn.pluginName = function( method ) {

        var methods = {
            // constructor

JawsomeJason

jQuery Edge-to-Edge Plugin

It finds the optimum font size to fit a certain container width. Coolest thing: It does this by shrinking/growing the font by half of the last attempt until it finds the sweet spot [ O(log n): 154px font = max 8 checks ]. There might be a slight visual offset between two headers one on top of the other. This is due to no checking on letter-spacing. That might incur a greater performance hit, as we'd be getting into floating-point pixels.

A Pen by Jason Featheringham on CodePen.

License.

JawsomeJason

/**
 * @fileOverview Stores inline JS/CSS into localStorage
 * @author "Jason T. Featheringham" <jason@thejase.com>
 * @requires this.localStorage,
 *           this.document,
 *           this.JSON,
 *           this.document.querySelectorAll,
 *
 * How It Works:
 * On your server, when you want some content stored locally instead of retrieved from the server.  An example using a script file (script.js), but any DOM element will work.

JawsomeJason

// grid layout
@include with-grid-settings( $columns: 12, $width: 58px, $gutter: 24px, $padding: 24px ) {
    .pdp {
        @include susy-grid-background;
        @include container;

        > .breadcrumbs {
            @include span-columns( 12 );
        }
    }

JawsomeJason

/* Angular directive for enabling a expandable/collapsible hover dropdown menu
 * May seem like a lot of code just for a dropdown, but normally, dropdowns
 * don't play nice on touch devices, because onmouseleave is not fired unless
 * the user touches another element that is clickable or focusable, such as
 * a link.  This ensures that any touch outside the menu will be considered
 * the same as a mouseleave
 *
 * example menu:
 * <nav>
 *   <ul class="menu" x-jf-menu x-ng-onmouseenter="open()" x-ng-onmouseleave="close()">

JawsomeJason

/* resets box-model reset */
.pd-foo {
    margin: 0;
    padding: 0;
    border-width: 0;
    background-color: #ddd;
    margin-left: 1em;
}
 
.pd-bar {

JawsomeJason

$colors: (
  abbey: #4c4f56,
  acadia: #1b1404,
  acapulco: #7cb0a1,
  aero-blue: #c9ffe5,
  affair: #714693,
  akaroa: #d4c4a8,
  alabaster: #fafafa,
  albescent-white: #f5e9d3,
  algae-green: #93dfb8,

JawsomeJason

// handoff mixin variables for use inside content
$batons: () !default;

/// get the last set of variables handed-off
/// @param $baton=() map of variables
/// @example calling from inside a handoff-enabled mixin with content block
/// @mixin foo($foo, $free) {
///   
///   // send handoff right before `@content`
///   @include handoff((

JawsomeJason

/// Helper for EQCSS Element Queries `@element`
/// 
/// @author Jason Featheringham
/// @link https://gist.github.com/thejase/d2107285b6e10315dd6bc055115647fe Code source
/// @link http://elementqueries.com/ Plugin to parse EQCSS
/// @link https://gist.github.com/tomhodgins/6237039fa07c2e4b7acd1c8b0f9549a9 EQCSS syntax
///
/// @param {String} $scope (&) - Optional scope.  Defaults to current context
/// @param {List} $conditions (()) - 1+ of Maps of EQCSS conditions
/// @content rules to enclose in element query

JawsomeJason

// options
// identifier for theme CSS custom properties (e.g. --theme__prop--theme-name)
$__theme-custom-property-prefix: theme !default;
// enable/disable CSS4 var(--custom-property) declarations
$__theme-enable-css-variables: true !default;
// enable/disable compatibility for legacy browsers.  
// Warning: If enabled, cascade will not function, so you must inherit down 
// the chain or re-declare themes where needed
$__theme-enable-decorator-fallbacks: true !default;