Skip to content

Instantly share code, notes, and snippets.

var cheerio = require('gulp-cheerio');
var svgmin = require('gulp-svgmin');
var svgstore = require('gulp-svgstore');
gulp.task('svgstore', function () {
return gulp
.src('assets/icons/*.svg')
.pipe(svgmin())
.pipe(svgstore({ fileName: 'icons.svg', prefix: 'icon-' }))
.pipe(cheerio({
<!DOCTYPE html>
<html>
<head>
<title>Document</title>
<style>
* {
display: block;
}
html:before { content: "<!DOCTYPE html><html>" }
html:after { content: "</html>" }
.centered-content {
position: relative;
top: 50%;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
}
@EdPoole
EdPoole / ChromeAutofillHack.css
Last active August 29, 2015 13:55
On autofill inputs, Google Chrome adds a yellow background to the user agent stylesheet that *cannot* be unset by custom styles.
input:-webkit-autofill {
-webkit-text-fill-color: white;
-webkit-box-shadow: 0 0 0 100px red inset;
}
@EdPoole
EdPoole / Tutorial 08 Startup
Last active December 30, 2015 04:59
Web Graphics Vision
function startup() {
canvas = document.getElementById("canvas");
canvas = WebGLDebugUtils.makeLostContextSimulatingCanvas(canvas);
canvas.addEventListener('webglcontextlost', handleContextLost, false);
canvas.addEventListener('webglcontextrestored', handleContextRestored, false);
window.addEventListener('mousedown', function() {
canvas.loseContext();
});
@EdPoole
EdPoole / rem-converter.scss
Created May 16, 2013 18:02
Converts pixel values to rem values with pixel fallbacks.
$baseline_px: 16px;
@mixin rem($property, $px_values) {
$baseline_rem: ($baseline_px / 1rem);
#{$property}: $px_values;
@if type-of($px_values) == 'number' {
#{$property}: $px_values / $baseline_rem;
} @else {
$rem_values: ();
@each $value in $px_values {
@mixin animation-delay($time) {
-webkit-animation-delay: $time;
-moz-animation-delay: $time;
-o-animation-delay: $time;
animation-delay: $time;
}
@-webkit-keyframes pulsating {
0% { -webkit-transform: scale(1) }
100% { -webkit-transform: scale(0) }
@mixin vendorPrefix($property, $arguments) {
-webkit-#{$property}: $arguments;
-moz-#{$property}: $arguments;
-ms-#{$property}: $arguments;
-o-#{$property}: $arguments;
#{$property}: $arguments;
}
/* HOW TO CALL IT */