Skip to content

Instantly share code, notes, and snippets.

View jnowland's full-sized avatar

James Nowland jnowland

View GitHub Profile
@stowball
stowball / example-input.html
Last active July 7, 2024 06:43
Fetch a remote SVG as an <img> and convert it to an inline SVG
<img
alt="accessible text"
class="fill-color-red"
height="16"
src="some.svg"
width="16"
onload="fetchSvgInline(this)"
/>
@adactio
adactio / Twig-critical-CSS-test.twig
Last active January 30, 2024 07:13
Twig template for inlining critical CSS on first visits.
{% set cssupdate = '20150309' %}
{% if _cookie.csscached == cssupdate %}
<link rel="stylesheet" href="/css/global-min.{{ cssupdate }}.css">
{% else %}
<style>
{% include 'global/critical.css' %}
</style>
<script>
(function (win, doc) {
'use strict';
@brandonkelly
brandonkelly / templating.md
Last active February 7, 2024 15:20
Templating in EE vs. Craft
@davatron5000
davatron5000 / Sublime Text Setup.md
Last active April 15, 2023 15:39
A new user's guide to SublimeText 2. Estimated reading time: 2 mins. Estimated workthrough time: 12 minutes.

Make it useful

  • Install Package Control. For SublimeText 2, paste the following in Terminal:
import urllib2,os; pf='Package Control.sublime-package'; ipp = sublime.installed_packages_path(); os.makedirs( ipp ) if not os.path.exists(ipp) else None; urllib2.install_opener( urllib2.build_opener( urllib2.ProxyHandler( ))); open( os.path.join( ipp, pf), 'wb' ).write( urllib2.urlopen( 'http://sublime.wbond.net/' +pf.replace( ' ','%20' )).read()); print( 'Please restart Sublime Text to finish installation')

From here on out, use Package Control to install everything. +Shift+P, then type Install to get a list of installable packages you can 'livesearch through. After installing plugins, they should be running.

@gregrickaby
gregrickaby / html5-schema.org-markup.html
Last active August 2, 2022 00:05
Proper SCHEMA.ORG markup
<!DOCTYPE html>
<html lang="en-US">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="robots" content="noodp, noydir" />
<link rel="dns-prefetch" href="//cdnjs.cloudflare.com">
<link rel="canonical" href="http://mysite.com/" />
<link rel="stylesheet" href="http://mysite.com/style.css" type="text/css" />
@sergejmueller
sergejmueller / .htaccess
Last active October 9, 2024 00:33
Apache: Detecting WebP support with Header Vary Accept
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteCond %{HTTP_ACCEPT} image/webp
RewriteCond %{DOCUMENT_ROOT}/$1.webp -f
RewriteRule (.+)\.(jpe?g|png)$ $1.webp [T=image/webp,E=accept:1]
</IfModule>
<IfModule mod_headers.c>
Header append Vary Accept env=REDIRECT_accept
</IfModule>
@chrisbuttery
chrisbuttery / svg-logo.scss
Created November 19, 2012 10:28 — forked from jnowland/svg-logo.scss
Logo mixin to include fallback SVG
// Im not really sure what your intention is for this mixin.
// Originally it looked like you were including this mixin to a parent class,
// that would then create the .logo styles along with .svg & .no-svg fallback classes.
// This example includes the mixin to .logo since we know its going to exist anyhow.
// Dont know if it actuualy helps you, I'd need more info.
@mixin svg-logo($img-name) {
// Compass cant get an image width/height from just a name, its needs an actual image,
// which wouldnt work in this case.
@sawyerh
sawyerh / clippath.svg
Created June 12, 2012 04:26
SVG Clippath
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
@antsa
antsa / placeholder.scss
Created March 23, 2012 12:00
Placeholder mixin for Sass
// Placeholder @mixin for Sass
//
// A mixin to style placeholders in HTML5 form elements.
// Includes also a .placeholder class to be used with a polyfill e.g.
// https://github.com/mathiasbynens/jquery-placeholder
// Requires Sass 3.2.
//
// Example usage (.scss):
//
// input {
@gre
gre / easing.js
Last active October 30, 2024 16:49
Simple Easing Functions in Javascript - see https://github.com/gre/bezier-easing
/*
* This work is free. You can redistribute it and/or modify it under the
* terms of the Do What The Fuck You Want To Public License, Version 2,
* as published by Sam Hocevar. See the COPYING file for more details.
*/
/*
* Easing Functions - inspired from http://gizma.com/easing/
* only considering the t value for the range [0, 1] => [0, 1]
*/
EasingFunctions = {