Skip to content

Instantly share code, notes, and snippets.

View lyzadanger's full-sized avatar

Lyza Gardner lyzadanger

View GitHub Profile
@lyzadanger
lyzadanger / mybreaks.js
Created August 18, 2011 20:03
Slapdash Polyfill for media-query-ish stuff on resize/orientation change
$(document).ready(function() {
$(window).bind('resize orientationchange', function() {
var width = $(this).width();
var height = $(this).height();
var i_am_currently = {};
var breakpoints = [];
breakpoints[0] = {'name' : 'mobile', 'width' : [0, 480]};
breakpoints[1] = {'name' : 'wide', 'width' : [481, 10000]};
@lyzadanger
lyzadanger / blackwatch.css
Created August 23, 2011 18:02
Black Watch Plaid CSS Background (Webkit)
* {
margin: 0;
padding: 0;
}
html {
height: 100%;
}
body {
@lyzadanger
lyzadanger / blueplaid.css
Created August 23, 2011 18:02
Blue, Yellow, Red Plaid CSS Pattern (Webkit)
* {
margin: 0;
padding: 0;
}
html {
height: 100%;
}
body {
@lyzadanger
lyzadanger / ios5_label.html
Created October 14, 2011 23:17
jQueryMobile Label Alignment on iOS5
<!DOCTYPE html>
<html>
<head>
<title>The Tartanator</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://code.jquery.com/mobile/latest/jquery.mobile.css" />
<script src="http://code.jquery.com/jquery-1.6.4.min.js"></script>
<script src="http://code.jquery.com/mobile/latest/jquery.mobile.js"></script>
</head>
<body>
@lyzadanger
lyzadanger / index.php
Created October 24, 2011 20:33
AppCache demo w/jQuery Mobile & PHP
<!DOCTYPE html>
<html manifest="manifest.appcache.php">
<head>
<title>AppCache Demo</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0rc1/jquery.mobile-1.0rc1.min.css" />
<script src="http://code.jquery.com/jquery-1.6.4.min.js"></script>
<script src="http://code.jquery.com/mobile/1.0rc1/jquery.mobile-1.0rc1.min.js"></script>
@lyzadanger
lyzadanger / swiper.js
Created December 9, 2011 01:13
Quickie swipe thingy with jQuery
var Swiper = function(el) {
var startX, startY, lastX, lastY;
var minswipe;
var init=function(el) {
Swiper.minswipe = 50;
el.bind('touchstart', function(event) {
Swiper.startX = event.originalEvent.targetTouches[0].screenX;
Swiper.startY = event.originalEvent.targetTouches[0].screenY;
$(this).bind('touchmove', function(event) {
Swiper.lastX = event.originalEvent.targetTouches[0].screenX;
@lyzadanger
lyzadanger / oof.js
Created December 13, 2011 21:47
Painful JS Scoping
var Swiper = function(el) {
var startX, startY, lastX, lastY;
var minswipe;
var init=function(el) {
Swiper.minswipe = 50;
el.bind('touchstart', function(event) {
Swiper.startX = event.originalEvent.targetTouches[0].screenX;
Swiper.startY = event.originalEvent.targetTouches[0].screenY;
$(this).bind('touchmove', function(event) {
Swiper.lastX = event.originalEvent.targetTouches[0].screenX;
@lyzadanger
lyzadanger / drupal.mdown
Created September 28, 2012 16:43
My Woes with Drupal

Hokay, please keep in mind I know nothing about Drupal 8, so much of what I comment on here may well be problems that are already being addressed or have been solved therein. AGAIN: If I make a poopoo face at something that has been rectified in D8, please don't be terribly irritated at me!

I am a longtime D6 dev, and have been working in D7 for the past few months, as well.

Core issues as I see them in terms of the mobile Web and the pan-device Web as a whole:

  • Controllers need to be separated from template/view layers in so much as is possible. There is still too much munging between page callbacks/action and the rendered response. I think this is sort of part of what render arrays aim to ease in D7, but render arrays are complex and abysmally documented. I have asked around and no one can find true documentation on them. They're far too convoluted to figure out on one's own unless one has a lot of time, which I sadly do not.
  • Let me clarify: I believe in the kind of idea that a render array repr
@lyzadanger
lyzadanger / pxToEm.js
Created November 16, 2012 23:30
Jehl's jQuery px-to-em Conversion, Lyza's Version
$.fn.toEm = function(settings){
settings = jQuery.extend({
scope: 'body',
asNumber: false
}, settings);
var that = parseInt(this[0],10),
inEms,
scopeTest = jQuery('<div style="display: none; font-size: 1em; margin: 0; padding:0; height: auto; line-height: 1; border:0;">&nbsp;</div>').appendTo(settings.scope),
scopeVal = scopeTest.height();
scopeTest.remove();
@lyzadanger
lyzadanger / _button-group.scss
Last active August 29, 2015 14:01
Jacket + Custom MQ-handling Mixin
body {
margin: 2em;
}
.button {
background-color: #007dc6;
border-radius: 0.25em;
box-sizing: border-box;
color: #fff;
display: inline-block;