Skip to content

Instantly share code, notes, and snippets.

View attebury's full-sized avatar

John Attebury attebury

19 followers · 23 following
  • Texas
View GitHub Profile
@blackfalcon
blackfalcon / _ico-fonts_haml_sass.md
Last active February 28, 2016 00:50
Icon fonts, HAML and Sass

by Dale Sande

Icon-fonts. They are pretty awesome, but much like managing Sprite files, there are issues that make them a real pain to manage. Sure there are full libraries out there that you can grab wholesale and rely on their documentation, but for optimization and performance reasons you do not want to load up a series of libraries just to use a few icons. Leveraging the power of HAML and Sass we can make this less painful and at the same time maintain a living style guide. Basically, winning all over the place.

[IcoMoon][IcoMoon] is a fantastic resource that allows users to select specific icons from various libraries, as well as upload custom SVG art and download a customized font library. In the download package there is an HTML document that illustrates the library you just created, but for most professional applications this isn't going to work. Mainly because you will probably not use IcoMoon's code verbatim. Customizing the HTML and CSS per your use is ve

@aarongustafson
aarongustafson / dependent-anchor-include.js
Last active December 19, 2015 01:38
Scott Jehl’s Anchor Include Pattern (https://gist.github.com/scottjehl/d0e4918cf5e97edf99f3) combined with Emil Bjorkund’s Width Detection (https://gist.github.com/emilbjorklund/2481019)
/*! Dependent Anchor Include Pattern */
/*
* Copyright 2011, Scott Jehl (scottjehl.com), Emil Bjorklund (thatemil.com),
* and Aaron Gustafson (aaron-gustafson.com)
*
* Dual licensed under the MIT
* Idea from Scott Gonzalez
*
* to use, place attributes on an already-functional anchor pointing to content
* that should either replace, or insert before or after that anchor
@trek
trek / gist:6426610
Last active December 22, 2015 05:49

Progressive Enhancement: It Depends

If you haven't visited [Sigh, JavaScript][sigh, javaScript] for a good laugh, you should. It's the latest volley from the [progressive enhancement][progressive enhancement] community in response to the [growing trend][enough javascript] of writing full client applications that run in the browser and rely on a server for assets and data but not for rendering or state management.

Effectively, web applications written in this pattern mirror how client applications are written in any environment where the server doesn't pre-render a serialization of the interface. So, as an example, an iOS app doesn't request a pre-rendered screen from a server and display it to a user. This would require a rather odd tight coupling between server and client. Instead, the code for an iOS application contains all the necessary instructions to render the UI and a server is optionally used to retrieve any data that is stored centrally.

Progressive enhancement adherents seem [incapable of se

@jozsefDevs
jozsefDevs / validation_curry.js
Created October 22, 2013 20:17
A simple way to implement a validation by JavaScript currying
var above = function(limit){
return function(value){
return value > limit;
};
};
var isAbove10 = above(10);
console.log(isAbove10(5)); // false
console.log(isAbove10(8)); // false
@distinctgrey
distinctgrey / dabblet.css
Created November 19, 2013 17:08 — forked from LeaVerou/dabblet.css
Scrolling shadows by @kizmarh and @LeaVerou
/**
* Scrolling shadows by @kizmarh and @leaverou
* Only works in browsers supporting background-attachment: local; & CSS gradients
* Degrades gracefully
*/
html {
background: white;
font: 120% sans-serif;
}
@SindhujaD
SindhujaD / SVG-icon-loader-with-an-API.markdown
Created January 6, 2014 00:40
A Pen by Lego Mushroom.

SVG icon loader with an API

Just copy and paste HTML code to your project. You have the {pan} variable in global scope and {setProgress} function to set the current progress. Unminified version http://goo.gl/sq2gDY

A Pen by Lego Mushroom on CodePen.

License.

@amirgalor
amirgalor / templateLoader.js
Last active April 3, 2019 09:11 — forked from anonymous/templateLoader.js
Kendo UI - "Template Loader" - improved !
/**
This defines a Global object to serve loading external templates.
It handles multiple "Templates" (Or "Views") loading,
by operating on an array of JSON objects of type {path: "path to file", tag: "script's tag to attach to dom"}
This way-
you can load multiple templates, each with it's own tag so they can be referenced seperatly,
templates can be written in a much "cleaner" manner - as they are not wrapped by a "script" tag, IDE's will recognize the html.
@micahgodbolt
micahgodbolt / PDXSass_0214.scss
Last active August 29, 2015 13:56
Code from PDX Sass demo given February 2014.
///////////////////////////////////
/// Major Features of Sass 3.3
///////////////////////////////////
// @at-root
.widget {
@at-root .body {
background: red;
@callumacrae
callumacrae / build-tools.md
Last active October 25, 2023 15:14
Build tools written in JavaScript
@mxriverlynn
mxriverlynn / questions.md
Created October 15, 2014 15:58
thinking of starting a podcast?

Thinking about starting a podcast? I want to know what questions you have...

Please drop a comment here and let me know what you want to know. I'll try to answer and will use the questions / response to build a new resource to help those that want to get started.