Nathan Smith nathansmith

## truncate.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta http-equiv="x-ua-compatible" content="ie=edge" />
<title>Truncation Example</title>
<style>

* {
  font-size: 13px;

## #1 insert-jquery.js
(function() {
  var s = document.createElement('script');
  s.src = 'http://code.jquery.com/jquery-1.11.0.min.js';
  document.body.appendChild(s);
})();

## highlight.scss
//
// Monokai style - ported by Luigi Maselli - http://grigio.org
//

pre {
  background: #272822;
  font-size: 14px;
  overflow: auto;
  padding: 10px;
}

## lulz.js
(function(d) {
  'use strict';

  // DOM elements.
  var body = d.body;
  var html = d.documentElement;
  var head = d.head || d.getElementsByTagName('head')[0];

  // Style attributes.
  var b = body.style;

## #1 example.css
.not-IE .foobar {
  /*
    3D CSS transforms here.
  */
}

## td-max-width-img.html
<style>

/*
  Assuming a basic CSS reset
  does something like this...
*/

table {
  border-collapse: collapse;
  border-spacing: 0;

## angular_2.0_musings.html
<!--
  Test HTML elements.

  JS should console.log "bar" 5 times.
-->

<div (foo)="bar"></div>
<div (foo)="bar"></div>
<div (foo)="bar"></div>
<div (foo)="bar"></div>

## handlebars_match.js
define(function(require) {
  'use strict';

  var handlebars = require('handlebars');

  /*
    ========================================
    This Handlebars helper compares a string
    against a "|" separated list of strings.
    ========================================

## css_pre_post_processing_expanation.md

      
              1 file
            
          
              0 forks
            
          
                1 comment
              
            
              4 stars
            
          
                nathansmith
                / css_pre_post_processing_expanation.md
            
            
              Last active
              August 29, 2015 14:23
            
              
                Eat Lightning and Crap Thunder™ — aka: CSS Mullet — Sass in the front, PostCSS in the back :)
              
          
    CSS Pre-Processing

When it comes to languages that power the web, CSS is a double-edged sword. Often heralded for being quick to learn, like chess it takes awhile to master. Due to its simplicity, it is easy to get to a point where CSS files become unruly, mired by code repetition and lack of consistency.
Enter CSS pre-processors (and post-processors). Of all the CSS pre-processing approaches, Sass (Syntactically Awesome Style Sheets) is the clear front-runner.
http://sass-lang.com
Metaphorically, Sass is to CSS what jQuery is to JavaScript. Not only that, Sass gives CSS a seat at the table of first-class programming languages.

  
## rgb_hex.js
/*
  This will change:

    "rgba(255, 255, 255)" or "#fff"

  Into:

    #FFFFFF
*/
	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="utf-8" />
	<meta http-equiv="x-ua-compatible" content="ie=edge" />
	<title>Truncation Example</title>
	<style>

	* {
	font-size: 13px;
	//
	// Monokai style - ported by Luigi Maselli - http://grigio.org
	//

	pre {
	background: #272822;
	font-size: 14px;
	overflow: auto;
	padding: 10px;
	}
	(function(d) {
	'use strict';

	// DOM elements.
	var body = d.body;
	var html = d.documentElement;
	var head = d.head \|\| d.getElementsByTagName('head')[0];

	// Style attributes.
	var b = body.style;
	<style>

	/*
	Assuming a basic CSS reset
	does something like this...
	*/

	table {
	border-collapse: collapse;
	border-spacing: 0;
	<!--
	Test HTML elements.

	JS should console.log "bar" 5 times.
	-->

	<div (foo)="bar"></div>
	<div (foo)="bar"></div>
	<div (foo)="bar"></div>
	<div (foo)="bar"></div>
	define(function(require) {
	'use strict';

	var handlebars = require('handlebars');

	/*
	========================================
	This Handlebars helper compares a string
	against a "\|" separated list of strings.
	========================================
	/*
	This will change:

	"rgba(255, 255, 255)" or "#fff"

	Into:

	#FFFFFF
	*/