Skip to content

Instantly share code, notes, and snippets.

Alex Bell albell

Block or report user

Report or block albell

Hide content and notifications from this user.

Learn more about blocking users

Contact Support about this user’s behavior.

Learn more about reporting abuse

Report abuse
View GitHub Profile
View assemblefile.js
/* eslint no-param-reassign: ["off"] */
/* eslint import/no-extraneous-dependencies: ["error", {"devDependencies": true,
"optionalDependencies": false, "peerDependencies": false}] */
/**
* Assemble has first-class support for vinyl-fs, so any gulp plugin can be used
* directly in the assemble pipeline.
*/
@albell
albell / gist:d0f2b79d8b67da2cb0ea
Created Mar 6, 2015
Foundation CSS for button element
View gist:d0f2b79d8b67da2cb0ea
button, .button {
border-style: solid;
border-width: 0;
cursor: pointer;
font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
font-weight: normal;
line-height: normal;
margin: 0 0 1.25rem;
position: relative;
text-decoration: none;
@albell
albell / VideoJS dims
Last active Aug 29, 2015
Dimension test bed for VideoJS (pseudocode)
View VideoJS dims
1) No Dims.
<video data-setup=“{}” preload=“none”>
check:
player is visible
player has class “vjs-default-dimensions”
player width is 300.
player height is 150.
// I would like to handle this as a special case. Introducing 300 and 150 as
// independent default values, as is currently done, creates serious complexities.
View markup.html
<div class="cycle-slideshow"
data-slides=">div"
data-cycle-auto-height="calc"
>
<div>
<img src="img1.jpg" width="###" height="###">
<p>caption 1</p>
</div>
<div>
<img src="img2.jpg" width="###" height="###">
View markup.html
<div id="myshow" class="cycle-slideshow" data-cycle-pager="#pager-container">
<img src="img1.jpg"/>
<img src="img2.jpg"/>
<img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==" data-img="img3.jpg"/>
<img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==" data-img="img4.jpg"/>
<img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==" data-img="img5.jpg"/>
<img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==" data-img="img6.jpg"/>
</div>
<div id="pager-container"></div>
View markup.html
<div id="myshow" class="cycle-slideshow" data-cycle-pager="#pager-container">
<img src="img1.jpg"/>
<img src="img2.jpg"/>
<img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==" data-img="img3.jpg"/>
<img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==" data-img="img4.jpg"/>
<img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==" data-img="img5.jpg"/>
<img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==" data-img="img6.jpg"/>
</div>
<div id="pager-container"></div>
View window resizing and autoheight in cycle2
<!doctype html>
<html lang="en">
<head>
<meta charset='utf-8' />
<meta name="viewport" content="width=device-width">
<meta name='description' content='' />
<title></title>
<style>
.cycle-slideshow {
@albell
albell / progressive kitties 2
Created Mar 4, 2013
progressive loading issues with cycle2
View progressive kitties 2
<!doctype html>
<html lang="en">
<head>
<meta charset='utf-8' />
<meta name="viewport" content="width=device-width">
<meta name='description' content='' />
<title></title>
<style>
.cycle-slideshow {
@albell
albell / progressive-kitties01
Created Mar 2, 2013
demo of cycle2 progressive loading bug
View progressive-kitties01
<!doctype html>
<html lang="en">
<head>
<meta charset='utf-8' />
<meta name="viewport" content="width=device-width">
<meta name='description' content='' />
<title></title>
<style>
.cycle-slideshow {
You can’t perform that action at this time.