Skip to content

Instantly share code, notes, and snippets.

View EdwardIrby's full-sized avatar

Edward Irby EdwardIrby

14 followers · 6 following
View GitHub Profile
@EdwardIrby
EdwardIrby / PreheaderDemo
Created March 16, 2012 21:53
Mobile Emails: Responsive is not always the answer
<html>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<!--Preheader styles-->
<style>
.preheader{display:none;}
@media (max-device-width:480px) {
.preheader {display:block;}
}
@EdwardIrby
EdwardIrby / MobileEmail
Created March 16, 2012 21:59
Mobile Friendly Email...All Divs baby
<!-- saved from url=(0034)http://dev.opusproofing.com/appup/ -->
<html><head>
<meta http-equiv="X-UA-Compatible" content="IE=edge; chrome=1" />
<title></title>
<style type="text/css">
body{
background-color:transparent;background-image:url(images/6180_iadp_news_gradient.gif);
background-repeat:repeat-x;background-position:top left;background-attachment:scroll;
@EdwardIrby
EdwardIrby / template.js
Created July 13, 2013 21:40
This is the script that inspired the talk "Beyond the Comp: A UI Developer's Toolset" I will be presenting on Aug 8t, 2013. It uses jQuery and Handlebars to allow me to design a UI in the browser with real or in this case faked data and then host it on Heroku with a small php hack. Right now I'm working on adding meteor js to the mix.
function template_config(header, header_data, body, body_data){
Handlebars.getTemplate = function(name) {
if (Handlebars.templates === undefined || Handlebars.templates[name] === undefined) {
$.ajax({
url : 'templates/' + name + '.handlebars',
success : function(data) {
if (Handlebars.templates === undefined) {
Handlebars.templates = {};
}
Handlebars.templates[name] = Handlebars.compile(data);
@EdwardIrby
EdwardIrby / showPrimary.js
Created July 13, 2013 21:35
Small script that listens for categories selected on the OpenSesame course upload page. It then uses the selected options to reveal radio button options that the user will be required to choose from in order to select a primary category for their course.
var subjects = jQuery('#edit-field-course-subjects-taxonomy-und');
function displayPrimarySubject(){
var subjectVal =[];
var subjectInput = subjects.find('input:checked');
subjectInput.each(function(){
var catVal= jQuery(this).val();
subjectVal.push(catVal);
});
var primarySubjectField= jQuery('#edit-field-primary-subject');
if (subjectVal.length > 0){
@EdwardIrby
EdwardIrby / flex-grid.scss
Last active January 5, 2016 19:18
Flex Grid SCSS
//This grid is based http://philipwalton.github.io/solved-by-flexbox/
//Mixins are inefficient in terms of code duplication but when post Processed
//By csso duplication can be removed. The point is not everything needs to happen
//at the preprocess stage.
//FLEX
@mixin flex {
display: flex;
flex-wrap: wrap;
}
@EdwardIrby
EdwardIrby / flex-cell.js
Last active January 5, 2016 23:49
Flex Grid Mixins Postcss
module.exports = function(mixin, value){
switch(value){
case "full":
var rule = {flex: "0 0 100%"};
break;
case "1of2":
var rule = {flex: "0 0 50%"};
break;
case "1of3":
var rule = {flex: "0 0 33.3333%"};
@EdwardIrby
EdwardIrby / twitterTypeahead.html
Created June 6, 2014 21:11
RactiveJS Twitter Typeahead Component
<input class="flex-input-field" decorator="typeahead">
@EdwardIrby
EdwardIrby / javascript.yaml
Created November 13, 2017 03:22
Syntax highlighting es6 micro text editor
filetype: javascript
detect:
filename: "(\\.js$|\\.es[5678]?$)"
header: "^#!.*/(env +)?node( |$)"
rules:
- constant.number: "\\b[-+]?([1-9][0-9]*|0[0-7]*|0x[0-9a-fA-F]+)([uU][lL]?|[lL][uU]?)?\\b"
- constant.number: "\\b[-+]?([0-9]+\\.[0-9]*|[0-9]*\\.[0-9]+)([EePp][+-]?[0-9]+)?[fFlL]?"
- constant.number: "\\b[-+]?([0-9]+[EePp][+-]?[0-9]+)[fFlL]?"
@EdwardIrby
EdwardIrby / ShadowDom.js
Created March 5, 2018 00:53
A little Web Component in my React
import React, { Component, Fragment, Children } from 'react';
import { render, unmountComponentAtNode } from 'react-dom';
import PropTypes from 'prop-types';
export class ShadowDom extends Component {
constructor(props){
super(props)
this.getTargetRef = this.getTargetRef.bind(this);
}
componentDidMount() {
@EdwardIrby
EdwardIrby / UsingShadowDom.jsx
Last active March 5, 2018 17:53
Any child wrapped by ShadowDom
export const BasicUsage = (props) => {
const { text } = props;
return (
<ShadowDom className={ className}>
<span>{ children }</span>
</ShadowDom>
)
}