ryanflorence

Performance and Conditionally Rendered Content in React

First, this is not about if in JSX. It's just the simplest example to talk about (and a lot of people tried to do it at first a long time ago).

Some react components conditionally render content. When React first went public, a lot of us coming from handlebars really wanted "if" syntax. This gist isn't just about If components though, it's about

svinkle

Screencast with VoiceOver

Here’s a quick how-to on recording your Mac desktop while using the VoiceOver screen reader. With this setup you’ll be able to capture both video and internal audio at the same time, and hear the audio output while recording.

Setup

For this setup we’ll be on OS X El Capitan and use QuickTime to capture the video and audio. The only extra thing required is the iShowU Audio Capture driver.

Steps

lhid

Every Module Ever Scaffold

A Pen by Dave Rupert on CodePen.

License.

hdragomir

<script type="text/javascript">
    (function () {
      "use strict";
      // once cached, the css file is stored on the client forever unless
      // the URL below is changed. Any change will invalidate the cache
      var css_href = './index_files/web-fonts.css';
      // a simple event handler wrapper
      function on(el, ev, callback) {
        if (el.addEventListener) {
          el.addEventListener(ev, callback, false);

jlong

// Brightness math based on:
//   http://www.nbdtech.com/Blog/archive/2008/04/27/Calculating-the-Perceived-Brightness-of-a-Color.aspx

$red-magic-number: 241;
$green-magic-number: 691;
$blue-magic-number: 68;
$brightness-divisor: $red-magic-number + $green-magic-number + $blue-magic-number;

@function brightness($color) {
  // Extract color components

tylersticka

/** 
 * Chrome 32/33 webfont issue fix.
 * Requires jQuery.
 * More info: http://blog.cloudfour.com/chrome-webfont-issues/
 */

(function($, window){
  // only proceed if this is Chrome
  if (window.navigator.userAgent.indexOf('Chrome') === -1) return;
  // only proceed if the version is 32 or greater

cahnory

@mixin split($selectors...) {
    @each $selector in $selectors {
        #{$selector} {
            @content;
        }
    }
}

JohnAlbin

// Initialize the Sass variables and partials used in this project.

// Set the legacy IE support variables. We override the default values set by
// the compass/support partial, but let styles-ie8.scss override these values.
$legacy-support-for-ie6 : false !default;
$legacy-support-for-ie7 : false !default; // Note the use of !default.
$legacy-support-for-ie8 : false !default;


// Partials to be shared with all .scss files.

ebidel

Web Components Resources

Specs / standardization

W3C Introduction to Web Components - explainer/overview of the technologies

• Custom Elements
• HTML Imports
• Shadow DOM
• CSS Scoping Module

robmiller

#
# Working with branches
#

# Get the current branch name (not so useful in itself, but used in
# other aliases)
branch-name = "!git rev-parse --abbrev-ref HEAD"
# Push the current branch to the remote "origin", and set it to track
# the upstream branch
publish = "!git push -u origin $(git branch-name)"