Skip to content

Instantly share code, notes, and snippets.

@interactivellama
interactivellama / jgroup
Created June 3, 2013 17:46
jgroup is a LESS mixin that justifies inline-block elements, removes typography issues by reducing the font-size, and adds a 100% width element to the end simliar to micro-clearfix, but not. Look Ma, no specifying margins! Be carful though of removing spaces / HTML compression in production.
/* Justify inline block elements for a percentage grid without specifying margins: LESS mixin. See http://www.barrelny.com/blog/text-align-justify-and-rwd/ */
.jgroup {
text-align: justify;
font-size: .01px;
&:after{
content: '';
display: inline-block;
width: 100%;
@willurd
willurd / web-servers.md
Last active June 7, 2024 03:53
Big list of http static server one-liners

Each of these commands will run an ad hoc http static server in your current (or specified) directory, available at http://localhost:8000. Use this power wisely.

Discussion on reddit.

Python 2.x

$ python -m SimpleHTTPServer 8000

Lesson's learnt building the Guardian

Below is a collection of my favourite responses I gathered from Guardian engineers when asked the question: What have you learnt starting from scratch and building a mobile-first next generation web platform for the Guardian?

Daithi O Crualaoich

  • Work with great people.
  • Deploy like crazy. This means the team has to control the infrastructure as well as code.
  • Design is not a service. Designers have to sit in the team.
  • Infrastructure is intrinsically unreliable. Discard and replace is the robust strategy.
  • Use your CDN for HTML too.
  • Don't always do as you are told.
@thompson4822
thompson4822 / testElem.coffee
Created June 24, 2013 20:00
Defining AngularJS directives in CoffeeScript
@angular.module('HelloApp', ['components'])
@angular.module('components', [])
.directive('testElem', ->
restrict: 'A'
template: '<div class="my-directive-class"><h1>Hello...</h1><p ng-repeat="obj in arr">{{obj}}</p></div>'
link: (scope, iterStartElement, attr) ->
$(".my-directive-class").css({ 'background-color': 'yellow'})
scope.arr = ["Steve", 'is', 'the', 'beast']
)
@nhemsley
nhemsley / context-aware-debounce
Created June 27, 2013 08:18
Context aware debouncing function Allows you to debounce multiple functions. if they are called from within different 'this' contexts, they will not cancel each other out.
App.debounce = (func, wait) ->
timeout = {}
->
context = this
args = arguments
lastArg = args[args.length - 1]
immediate = true if lastArg and lastArg.now
@mariussoutier
mariussoutier / togglewatch.js
Last active August 13, 2018 23:55
Toggle an AngularJS $watch expression. The default $watch can only be toggled once.
var toggleWatch = function(watchExpr, fn) {
var watchFn;
return function() {
if (watchFn) {
watchFn();
watchFn = undefined;
console.log("Disabled " + watchExpr);
} else {
watchFn = $scope.$watch(watchExpr, fn);
console.log("Enabled " + watchExpr);
@PaulKinlan
PaulKinlan / criticalcss.html
Last active March 15, 2023 02:13
Detect Critical CSS
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>JS Bin</title>
</head>
<body>
<h2>Original CSS</h2>
<style style="display: block; white-space: pre; font-family: monospace">
h2 { margin:0; }
@heycarsten
heycarsten / README.md
Last active December 23, 2015 12:59
Ember-Validate: This is an initial spike for an approach to validations in Ember, it's extracted from an app I'm building and it works for me in my current use-case. I plan on developing this into a proper, tested library soon, but until then, I thought I'd share!

Ember-Validate

I've had to tackle the client validations problem in almost every Ember app I've ever written, and I've done it in a bunch of different ways. This is the way I ended up liking most. There are a few things that I really wanted to have in a validation framework:

  • Not tied to models or any modelling framework
  • Promise-based
  • Not reliant on extending Ember itself
@srsgores
srsgores / search-input.html
Created October 22, 2013 00:05
Html5 search input with voice control, results dropdown, and autosave.
<input type = "search" placeholder = "Search..." required x-webkit-speech name="filter_search" results = "10" autosave = "unique-auto-save-name"/>
@benplum
benplum / HTML5 Enabler
Created December 19, 2013 20:06
HTML5 Enabler
/* Pre-Define HTML5 Elements in IE */
(function(){ var els = "source|address|article|aside|audio|canvas|command|datalist|details|dialog|figure|figcaption|footer|header|hgroup|keygen|mark|meter|menu|nav|picture|progress|ruby|section|time|video".split('|'); for(var i = 0; i < els.length; i++) { document.createElement(els[i]); } } )();