Skip to content

Instantly share code, notes, and snippets.

Avatar

Nicolas Gallagher necolas

View GitHub Profile
@necolas
necolas / Composite-Link.js
Created Sep 19, 2018
Next.js links with React Native for Web
View Composite-Link.js
@necolas
necolas / stylesheet-injector.js
Created Nov 5, 2010
Create and append style sheets to document <head> using JavaScript
View stylesheet-injector.js
(function() {
var css = [
'/css/default.css',
'/css/section.css',
'/css/custom.css'
],
i = 0,
link = document.createElement('link'),
head = document.getElementsByTagName('head')[0],
tmp;
@necolas
necolas / Hoverable.js
Last active Nov 13, 2020
Hover styles in React Native for Web
View Hoverable.js
import createHoverMonitor from './createHoverMonitor';
import { element, func, oneOfType } from 'prop-types';
import React, { Component } from 'react';
const hover = createHoverMonitor();
/**
* Use:
* <Hoverable>
* {(hover) => <View style={hover && styles.hovered} />}
@necolas
necolas / rsync_backup
Created Aug 14, 2011
Maintain a bootable clone of Mac OS X volume
View rsync_backup
#!/bin/sh
PROG=$0
RSYNC="/usr/bin/rsync"
SRC="/"
DST="/Volumes/Backup/"
# rsync options
# -v increase verbosity
# -a turns on archive mode (recursive copy + retain attributes)
@necolas
necolas / using-OnLayout.js
Last active Sep 23, 2020
React Pressable / OnLayout
View using-OnLayout.js
/**
* OnLayout is built upon: View (and ResizeObserver), StyleSheet
*/
const elementBreakpoints = {
small: { minWidth: 200 },
medium: { minWidth: 300 }
large: { minWidth: 500 }
};
@necolas
necolas / README.md
Last active Sep 4, 2020
Experimenting with component-based HTML/CSS naming and patterns
View README.md

NOTE I now use the conventions detailed in the SUIT framework

Template Components

Used to provide structural templates.

Pattern

t-template-name
View ie-css-hacks.css
/*
* Property prefix hacks
*/
/* IE6 only - any combination of these characters */
_ - £ ¬ ¦
/* IE6/7 only - any combination of these characters */
@necolas
necolas / snippet.js
Created Jun 14, 2011
Optimised async loading of cross-domain scripts
View snippet.js
/*
* Updated to use the function-based method described in http://www.phpied.com/social-button-bffs/
* Better handling of scripts without supplied ids.
*
* N.B. Be sure to include Google Analytics's _gaq and Facebook's fbAsyncInit prior to this function.
*/
(function(doc, script) {
var js,
fjs = doc.getElementsByTagName(script)[0],
@necolas
necolas / .htaccess
Created Apr 9, 2012
Simple, quick way to concatenate, minify, and version static files in a Wordpress theme
View .htaccess
# Filename-based cache busting
# taken from https://github.com/h5bp/html5-boilerplate/
# This rewrites file names of the form `name.123456.js` to `name.js`
# so that the browser doesn't use the cached version when you have
# updated (but not manually renamed) the file.
<IfModule mod_rewrite.c>
Options +FollowSymlinks
RewriteEngine On
@necolas
necolas / ie-cc-1.html
Created May 20, 2011
Conditional classes test cases: DRYer and Compat View icon is not displayed in IE8/9. If X-UA-Compatible header is set using a server config then ie-cc-serverconfig.html is all that is needed.
View ie-cc-1.html
<!DOCTYPE html>
<html lang="en"
xmlns="http://www.w3.org/1999/xhtml"
xmlns:og="http://ogp.me/ns"
xmlns:fb="http://www.facebook.com/2008/fbml">
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta charset="utf-8">
<!--[if lt IE 7]><html class="no-js ie6"><![endif]-->
<!--[if IE 7]><html class="no-js ie7"><![endif]-->