deac/middleman
1
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

html5boilerplate mobile 2

Browse source
This commit is contained in:
Thomas Reynolds 2011-09-23 13:06:44 -07:00
parent 21cb23ff0c
commit 3c0cddc936
19 changed files with 2008 additions and 10288 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

75
lib/middleman/templates/mobile/source/404.html
View file

@ -1,38 +1,37 @@
<!doctype html> <!doctype html>
<html> <html>
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<title>Page Not Found :(</title> <title>Page Not Found :(</title>
<style> <style>
body { text-align: center;} body { text-align: center;}
h1 { font-size: 50px; text-align: center } h1 { font-size: 50px; text-align: center }
span[frown] { transform: rotate(90deg); display:inline-block; color: #bbb; } span[frown] { transform: rotate(90deg); display:inline-block; color: #bbb; }
body { font: 20px Constantia, 'Hoefler Text', "Adobe Caslon Pro", Baskerville, Georgia, Times, serif; color: #999; text-shadow: 2px 2px 2px rgba(200, 200, 200, 0.5); } body { font: 20px Constantia, 'Hoefler Text', "Adobe Caslon Pro", Baskerville, Georgia, Times, serif; color: #999; text-shadow: 2px 2px 2px rgba(200, 200, 200, 0.5); }
::-moz-selection{ background:#FF5E99; color:#fff; } ::-moz-selection{ background:#FF5E99; color:#fff; }
::selection { background:#FF5E99; color:#fff; } ::selection { background:#FF5E99; color:#fff; }
article {display:block; text-align: left; width: 500px; margin: 0 auto; } article {display:block; text-align: left; width: 500px; margin: 0 auto; }
a { color: rgb(36, 109, 56); text-decoration:none; }
a { color: rgb(36, 109, 56); text-decoration:none; } a:hover { color: rgb(96, 73, 141) ; text-shadow: 2px 2px 2px rgba(36, 109, 56, 0.5); }
a:hover { color: rgb(96, 73, 141) ; text-shadow: 2px 2px 2px rgba(36, 109, 56, 0.5); } </style>
</style> </head>
</head> <body>
<body> <article>
<article> <h1>Not found <span frown>:(</span></h1>
<h1>Not found <span frown>:(</span></h1> <div>
<div> <p>Sorry, but the page you were trying to view does not exist.</p>
<p>Sorry, but the page you were trying to view does not exist.</p> <p>It looks like this was the result of either:</p>
<p>It looks like this was the result of either:</p> <ul>
<ul> <li>a mistyped address</li>
<li>a mistyped address</li> <li>an out-of-date link</li>
<li>an out-of-date link</li> </ul>
</ul> </div>
</div>
<script>
<script> var GOOG_FIXURL_LANG = (navigator.language || '').slice(0,2),
var GOOG_FIXURL_LANG = (navigator.language || '').slice(0,2), GOOG_FIXURL_SITE = location.host;
GOOG_FIXURL_SITE = location.host; </script>
</script> <script src="http://linkhelp.clients.google.com/tbproxy/lh/wm/fixurl.js"></script>
<script src="http://linkhelp.clients.google.com/tbproxy/lh/wm/fixurl.js"></script> </article>
</article> </body>
</body> </html>
</html>

83
lib/middleman/templates/mobile/source/README.markdown
View file

@ -1,64 +1,21 @@
#Mobile Boilerplate http://html5boilerplate.com #Mobile Boilerplate http://html5boilerplate.com
v1.0 (code named Secret Diary) v1.1
##Summary: ##Summary:
This is a set of features made specifically for mobile development, with following included: A baseline for 'mobile first' web development. Read more at the wiki here: https://github.com/shichuan/mobile-html5-boilerplate/wiki
###Markup: ##License:
Home screen icon (Android, iOS, Symbian)
CSS class target IE Mobile 7 ###Major components:
Cross browser viewport optimization (Android, iOS, Mobile IE, Blackberry) respond.js: Public Domain<br />
Optimized viewport scaling (Android, iOS, Mobile IE, Blackberry) Bookmark bubble library: Apache License, Version 2.0<br />
IE Mobile better Font rendering Web Storage Portability Layer: Apache License, Version 2.0<br />
Prevent scaling Modernizr: MIT/BSD license<br />
iPhone full screen mode jQuery: MIT/GPL license<br />
HTML5Doctor CSS reset: Creative Commons 3.0 <br />
###CSS: CSS Reset Reloaded: Public Domain
Mobile helper class
Prevent text resize in ie/webkit browser ###Everything else:
Prevent callout
HTML5 contenteditable attribute on mobile
S60 3.x and 5.0 devices which animated gif fix
Text overflow with ellipsis
Mobile optimized default CSS
###JavaScript:
Cross browser CSS media queries
Textarea autogrow
Hide webkit chrome
Insant button
Firebug lite debugger
Media queries for low end smartphone
###Server:
Added Blackberry MIME type
Added Nokia MIME type
Prevent Transcoding
Mobile site redirection
###General:
HTML5 offline caching for smartphone
Mobile sitemap
Mobile bookmark bubble
Browser Database Wrapper API
User Agent Detection
GA for low end mobile devices
Mobile build tool
##License:
###Major components:
css3-mediaqueries.js: Public Domain<br />
Bookmark bubble library: Apache License, Version 2.0<br />
Web Storage Portability Layer: Apache License, Version 2.0<br />
Modernizr: MIT/BSD license<br />
jQuery: MIT/GPL license<br />
HTML5Doctor CSS reset: Creative Commons 3.0 <br />
CSS Reset Reloaded: Public Domain
###Everything else:
The Unlicense (aka: public domain) The Unlicense (aka: public domain)

50
lib/middleman/templates/mobile/source/crossdomain.xml
View file

@ -1,25 +1,25 @@
<?xml version="1.0"?> <?xml version="1.0"?>
<!DOCTYPE cross-domain-policy SYSTEM "http://www.adobe.com/xml/dtds/cross-domain-policy.dtd"> <!DOCTYPE cross-domain-policy SYSTEM "http://www.adobe.com/xml/dtds/cross-domain-policy.dtd">
<cross-domain-policy> <cross-domain-policy>
<!-- Read this: www.adobe.com/devnet/articles/crossdomain_policy_file_spec.html --> <!-- Read this: www.adobe.com/devnet/articles/crossdomain_policy_file_spec.html -->
<!-- Most restrictive policy: --> <!-- Most restrictive policy: -->
<site-control permitted-cross-domain-policies="none"/> <site-control permitted-cross-domain-policies="none"/>
<!-- Least restrictive policy: --> <!-- Least restrictive policy: -->
<!-- <!--
<site-control permitted-cross-domain-policies="all"/> <site-control permitted-cross-domain-policies="all"/>
<allow-access-from domain="*" to-ports="*" secure="false"/> <allow-access-from domain="*" to-ports="*" secure="false"/>
<allow-http-request-headers-from domain="*" headers="*" secure="false"/> <allow-http-request-headers-from domain="*" headers="*" secure="false"/>
--> -->
<!-- <!--
If you host a crossdomain.xml file with allow-access-from domain=“*” If you host a crossdomain.xml file with allow-access-from domain="*"
and don’t understand all of the points described here, you probably and don’t understand all of the points described here, you probably
have a nasty security vulnerability. ~ simon willison have a nasty security vulnerability. ~ simon willison
--> -->
</cross-domain-policy> </cross-domain-policy>

551
lib/middleman/templates/mobile/source/css/style.css
View file

@ -1,236 +1,315 @@
/** /*
* HTML5 ✰ Boilerplate * HTML5 ✰ Boilerplate
* *
* style.css contains a reset, font normalization and some base styles. * What follows is the result of much research on cross-browser styling.
* * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
* Credit is left where credit is due. * Kroc Camen, and the H5BP dev community and team.
* Much inspiration was taken from these projects: *
* - yui.yahooapis.com/2.8.1/build/base/base.css * Detailed information about this CSS: h5bp.com/css
* - camendesign.com/design/ *
* - praegnanz.de/weblog/htmlcssjs-kickstart * ==|== normalize ==========================================================
*/ */
/** /* =============================================================================
* html5doctor.com Reset Stylesheet (Eric Meyer's Reset Reloaded + HTML5 baseline) HTML5 display definitions
* v1.6.1 2010-09-17 | Authors: Eric Meyer & Richard Clark ========================================================================== */
* html5doctor.com/html-5-reset-stylesheet/
*/ article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; }
audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; }
html, body, div, span, object, iframe, audio:not([controls]) { display: none; }
h1, h2, h3, h4, h5, h6, p, blockquote, pre, [hidden] { display: none; }
abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, /* =============================================================================
table, caption, tbody, tfoot, thead, tr, th, td, Base
article, aside, canvas, details, figcaption, figure, ========================================================================== */
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video { /*
margin: 0; * 1. Correct text resizing oddly in IE6/7 when body font-size is set using em units
padding: 0; * 2. Force vertical scrollbar in non-IE
border: 0; * 3. Prevent iOS text size adjust on device orientation change, without disabling user zoom: h5bp.com/g
font-size: 100%; */
font: inherit;
vertical-align: baseline; html { font-size: 100%; overflow-y: scroll; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }
}
body { margin: 0; font-size: 13px; line-height: 1.231; }
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section { body, button, input, select, textarea { font-family: sans-serif; color: #222; }
display: block;
} /*
* Remove text-shadow in selection highlight: h5bp.com/i
blockquote, q { quotes: none; } * These selection declarations have to be separate
* Also: hot pink! (or customize the background color to match your design)
blockquote:before, blockquote:after, */
q:before, q:after { content: ""; content: none; }
::-moz-selection { background: #fe57a1; color: #fff; text-shadow: none; }
ins { background-color: #ff9; color: #000; text-decoration: none; } ::selection { background: #fe57a1; color: #fff; text-shadow: none; }
mark { background-color: #ff9; color: #000; font-style: italic; font-weight: bold; }
/* =============================================================================
del { text-decoration: line-through; } Links
========================================================================== */
abbr[title], dfn[title] { border-bottom: 1px dotted; cursor: help; }
a { color: #00e; }
table { border-collapse: collapse; border-spacing: 0; } a:visited { color: #551a8b; }
a:hover { color: #06e; }
hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; } a:focus { outline: thin dotted; }
input, select { vertical-align: middle; } /* Improve readability when focused and hovered in all browsers: h5bp.com/h */
a:hover, a:active { outline: 0; }
/** /* =============================================================================
* Font normalization inspired by YUI Library's fonts.css: developer.yahoo.com/yui/ Typography
*/ ========================================================================== */
abbr[title] { border-bottom: 1px dotted; }
body { font:13px/1.231 sans-serif; *font-size:small; } /* Hack retained to preserve specificity */
select, input, textarea, button { font:99% sans-serif; } b, strong { font-weight: bold; }
/* Normalize monospace sizing: blockquote { margin: 1em 40px; }
en.wikipedia.org/wiki/MediaWiki_talk:Common.css/Archive_11#Teletype_style_fix_for_Chrome */
pre, code, kbd, samp { font-family: monospace, sans-serif; } dfn { font-style: italic; }
hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }
/**
* Minimal base styles. ins { background: #ff9; color: #000; text-decoration: none; }
*/
mark { background: #ff0; color: #000; font-style: italic; font-weight: bold; }
/* Prevent mobile zooming while remain desktop zooming: github.com/shichuan/mobile-html5-boilerplate/issues/closed#issue/14 */
html { -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; } /* Redeclare monospace font family: h5bp.com/j */
pre, code, kbd, samp { font-family: monospace, serif; _font-family: 'courier new', monospace; font-size: 1em; }
/* Accessible focus treatment: people.opera.com/patrickl/experiments/keyboard/test */
a:hover, a:active { outline: none; } /* Improve readability of pre-formatted text in all browsers */
pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; }
ul, ol { margin-left: 2em; }
ol { list-style-type: decimal; } q { quotes: none; }
q:before, q:after { content: ""; content: none; }
/* Remove margins for navigation lists */
nav ul, nav li { margin: 0; list-style:none; list-style-image: none; } small { font-size: 85%; }
small { font-size: 85%; } /* Position subscript and superscript content without affecting line-height: h5bp.com/k */
strong, th { font-weight: bold; } sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
sup { top: -0.5em; }
td { vertical-align: top; } sub { bottom: -0.25em; }
/* Set sub, sup without affecting line-height: gist.github.com/413930 */
sub, sup { font-size: 75%; line-height: 0; position: relative; } /* =============================================================================
sup { top: -0.5em; } Lists
sub { bottom: -0.25em; } ========================================================================== */
pre { ul, ol { margin: 1em 0; padding: 0 0 0 40px; }
/* www.pathf.com/blogs/2008/05/formatting-quoted-code-in-blog-posts-css21-white-space-pre-wrap/ */ dd { margin: 0 0 0 40px; }
white-space: pre; white-space: pre-wrap; word-wrap: break-word; nav ul, nav ol { list-style: none; list-style-image: none; margin: 0; padding: 0; }
padding: 15px;
}
/* =============================================================================
textarea { overflow: auto; } /* www.sitepoint.com/blogs/2010/08/20/ie-remove-textarea-scrollbars/ */ Embedded content
========================================================================== */
.iem7 legend { margin-left: -7px; }
/*
/* Align checkboxes, radios, text inputs with their label by: Thierry Koblentz tjkdesign.com/ez-css/css/base.css */ * 1. Improve image quality when scaled in IE7: h5bp.com/d
input[type="radio"] { vertical-align: text-bottom; } * 2. Remove the gap between images and borders on image containers: h5bp.com/e
input[type="checkbox"] { vertical-align: bottom; } */
.iem7 input[type="checkbox"] { vertical-align: baseline; }
img { border: 0; -ms-interpolation-mode: bicubic; vertical-align: middle; }
/* Hand cursor on clickable input elements */
label, input[type="button"], input[type="submit"], input[type="image"], button { cursor: pointer; } /*
* Correct overflow not hidden in IE9
/* Webkit browsers add a 2px margin outside the chrome of form elements */ */
button, input, select, textarea { margin: 0; }
svg:not(:root) { overflow: hidden; }
/* Colors for form validity */
input:valid, textarea:valid { }
input:invalid, textarea:invalid { /* =============================================================================
border-radius: 1px; -moz-box-shadow: 0px 0px 5px red; -webkit-box-shadow: 0px 0px 5px red; box-shadow: 0px 0px 5px red; Figures
} ========================================================================== */
.no-boxshadow input:invalid, .no-boxshadow textarea:invalid { background-color: #f0dddd; }
figure { margin: 0; }
/* These selection declarations have to be separate
No text-shadow: twitter.com/miketaylr/status/12228805301 /* =============================================================================
Also: hot pink! */ Forms
::-moz-selection{ background: #FF5E99; color:#fff; text-shadow: none; } ========================================================================== */
::selection { background:#FF5E99; color:#fff; text-shadow: none; }
form { margin: 0; }
/* j.mp/webkit-tap-highlight-color */ fieldset { border: 0; margin: 0; padding: 0; }
a:link { -webkit-tap-highlight-color: #FF5E99; }
/* Indicate that 'label' will shift focus to the associated form element */
/* Make buttons play nice in IE: label { cursor: pointer; }
www.viget.com/inspire/styling-the-button-element-in-internet-explorer/ */
button { width: auto; overflow: visible; } /*
* 1. Correct color not inheriting in IE6/7/8/9
/* Bicubic resizing for non-native sized IMG: * 2. Correct alignment displayed oddly in IE6/7
code.flickr.com/blog/2008/11/12/on-ui-quality-the-little-things-client-side-image-resizing/ */ */
.iem7 img { -ms-interpolation-mode: bicubic; }
legend { border: 0; *margin-left: -7px; padding: 0; }
/** /*
* You might tweak these.. * 1. Correct font-size not inheriting in all browsers
*/ * 2. Remove margins in FF3/4 S5 Chrome
* 3. Define consistent vertical alignment display in all browsers
body, select, input, textarea { */
/* #444 looks better than black: twitter.com/H_FJ/statuses/11800719859 */
color: #444; button, input, select, textarea { font-size: 100%; margin: 0; vertical-align: baseline; *vertical-align: middle; }
/* Set your base font here, to apply evenly */
/* font-family: Georgia, serif; */ /*
} * 1. Define line-height as normal to match FF3/4 (set using !important in the UA stylesheet)
* 2. Correct inner spacing displayed oddly in IE6/7
/* Headers (h1, h2, etc) have no default font-size or margin; define those yourself */ */
h1, h2, h3, h4, h5, h6 { font-weight: bold; }
button, input { line-height: normal; *overflow: visible; }
a, a:active, a:visited { color: #607890; }
a:hover { color: #036; } /*
* Reintroduce inner spacing in 'table' to avoid overlap and whitespace issues in IE6/7
*/
/*
* Helper classes table button, table input { *overflow: auto; }
*/
/*
/* prevent callout */ * 1. Display hand cursor for clickable form elements
.nocallout {-webkit-touch-callout: none;} * 2. Allow styling of clickable form elements in iOS
*/
/* Text overflow with ellipsis */
.ellipsis { button, input[type="button"], input[type="reset"], input[type="submit"], [role="button"] { cursor: pointer; -webkit-appearance: button; }
text-overflow: ellipsis;
overflow: hidden; /*
white-space: nowrap; * Consistent box sizing and appearance
} */
/* A hack for HTML5 contenteditable attribute on mobile */ input[type="checkbox"], input[type="radio"] { box-sizing: border-box; padding: 0; }
textarea.contenteditable {-webkit-appearance: none;} input[type="search"] { -webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; }
input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }
/* A workaround for S60 3.x and 5.0 devices which do not animated gif images if they have been set as display: none */
.gifhidden {position: absolute; left: -100%;} /*
* Remove inner padding and border in FF3/4: h5bp.com/l
/* For image replacement */ */
.ir { display: block; text-indent: -999em; overflow: hidden; background-repeat: no-repeat; text-align: left; direction: ltr; }
button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }
/* Hide for both screenreaders and browsers:
css-discuss.incutio.com/wiki/Screenreader_Visibility */ /*
.hidden { display: none; visibility: hidden; } * 1. Remove default vertical scrollbar in IE6/7/8/9
* 2. Allow only vertical resizing
/* Hide only visually, but have it available for screenreaders: by Jon Neal. */
www.webaim.org/techniques/css/invisiblecontent/ & j.mp/visuallyhidden */
.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; } textarea { overflow: auto; vertical-align: top; resize: vertical; }
/* Extends the .visuallyhidden class to allow the element to be focusable when navigated to via the keyboard: drupal.org/node/897638 */
.visuallyhidden.focusable:active, /* Colors for form validity */
.visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; } input:valid, textarea:valid { }
input:invalid, textarea:invalid { background-color: #f0dddd; }
/* Hide visually and from screenreaders, but maintain layout */
.invisible { visibility: hidden; }
/* =============================================================================
/* The Magnificent Clearfix: Updated to prevent margin-collapsing on child elements. Tables
j.mp/bestclearfix */ ========================================================================== */
.clearfix:before, .clearfix:after { content: "\0020"; display: block; height: 0; overflow: hidden; }
.clearfix:after { clear: both; } table { border-collapse: collapse; border-spacing: 0; }
/* Fix clearfix: blueprintcss.lighthouseapp.com/projects/15318/tickets/5-extra-margin-padding-bottom-of-page */ td { vertical-align: top; }
.clearfix { zoom: 1; }
/* ==|== primary styles =====================================================
/* Primary Styles for mobile Author:
Author: ========================================================================== */
*/
/*
* Media queries for responsive design https://github.com/shichuan/mobile-html5-boilerplate/wiki/The-Style
*/
/* Styles for desktop and large screen ----------- */
/*styles for 800px and up!*/
@media only screen and (min-width: 800px) {
/* Styles */
}/*/mediaquery*/
/* iPhone 4, Opera Mobile 11 and other high pixel ratio devices ----------- */ /*
@media * Media queries for responsive design https://github.com/shichuan/mobile-html5-boilerplate/wiki/The-Style
only screen and (-webkit-min-device-pixel-ratio: 1.5), */
only screen and (-o-min-device-pixel-ratio: 3/2),
only screen and (min-device-pixel-ratio: 1.5) {
/* Styles */ /* Styles for desktop and large screen ----------- */
}
/*styles for 800px and up!*/
@media only screen and (min-width: 800px) {
/* Styles */
}/*/mediaquery*/
/* iPhone 4, Opera Mobile 11 and other high pixel ratio devices ----------- */
@media
only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (-o-min-device-pixel-ratio: 3/2),
only screen and (min--moz-device-pixel-ratio: 1.5),
only screen and (min-device-pixel-ratio: 1.5) {
/* Styles */
}
/* ==|== non-semantic helper classes ========================================
Please define your styles before this section.
========================================================================== */
/* prevent callout */
.nocallout {-webkit-touch-callout: none;}
/* Text overflow with ellipsis */
.ellipsis {
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
/* A hack for HTML5 contenteditable attribute on mobile */
textarea[contenteditable] {-webkit-appearance: none;}
/* A workaround for S60 3.x and 5.0 devices which do not animated gif images if they have been set as display: none */
.gifhidden {position: absolute; left: -100%;}
/* For image replacement */
.ir { display: block; border: 0; text-indent: -999em; overflow: hidden; background-color: transparent; background-repeat: no-repeat; text-align: left; direction: ltr; }
.ir br { display: none; }
/* Hide from both screenreaders and browsers: h5bp.com/u */
.hidden { display: none !important; visibility: hidden; }
/* Hide only visually, but have it available for screenreaders: h5bp.com/v */
.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }
/* Extends the .visuallyhidden class to allow the element to be focusable when navigated to via the keyboard: h5bp.com/p */
.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }
/* Hide visually and from screenreaders, but maintain layout */
.invisible { visibility: hidden; }
/* Contain floats: h5bp.com/q */
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { *zoom: 1; }
/* ==|== print styles =======================================================
Print styles.
Inlined to avoid required HTTP connection: h5bp.com/r
========================================================================== */
@media print {
* { background: transparent !important; color: black !important; text-shadow: none !important; filter:none !important; -ms-filter: none !important; } /* Black prints faster: h5bp.com/s */
a, a:visited { text-decoration: underline; }
a[href]:after { content: " (" attr(href) ")"; }
abbr[title]:after { content: " (" attr(title) ")"; }
.ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; } /* Don't show links for images, or javascript/internal links */
pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
thead { display: table-header-group; } /* h5bp.com/t */
tr, img { page-break-inside: avoid; }
img { max-width: 100% !important; }
@page { margin: 0.5cm; }
p, h2, h3 { orphans: 3; widows: 3; }
h2, h3 { page-break-after: avoid; }
}

17
lib/middleman/templates/mobile/source/default.appcache
View file

@ -1,17 +0,0 @@
CACHE MANIFEST
# version 1
img/l/apple-touch-icon.png
img/l/apple-touch-icon-precomposed.png
img/l/splash.png
img/m/apple-touch-icon.png
img/h/apple-touch-icon.png
img/h/splash.png
css/style.css
js/libs/jquery-1.5.1.min.js
js/libs/modernizr-custom.js
js/libs/respond.min.js
NETWORK:
#http://example.com/api/
FALLBACK:

86
lib/middleman/templates/mobile/source/humans.txt
View file

@ -1,43 +1,43 @@
/* the humans responsible & colophon */ /* the humans responsible & colophon */
/* humanstxt.org */ /* humanstxt.org */
/* TEAM */ /* TEAM */
<your title>: <your name> <your title>: <your name>
Site: Site:
Twitter: Twitter:
Location: Location:
/* THANKS */ /* THANKS */
Names (& URL): Names (& URL):
/* SITE */ /* SITE */
Standards: HTML5, CSS3 Standards: HTML5, CSS3
Components: Modernizr, jQuery Components: Modernizr, jQuery
Software: Software:
-o/- -o/-
+oo//- +oo//-
:ooo+//: :ooo+//:
-ooooo///- -ooooo///-
/oooooo//: /oooooo//:
:ooooooo+//- :ooooooo+//-
-+oooooooo///- -+oooooooo///-
-://////////////+oooooooooo++////////////:: -://////////////+oooooooooo++////////////::
:+ooooooooooooooooooooooooooooooooooooo+:::- :+ooooooooooooooooooooooooooooooooooooo+:::-
-/+ooooooooooooooooooooooooooooooo+/::////:- -/+ooooooooooooooooooooooooooooooo+/::////:-
-:+oooooooooooooooooooooooooooo/::///////:- -:+oooooooooooooooooooooooooooo/::///////:-
--/+ooooooooooooooooooooo+::://////:- --/+ooooooooooooooooooooo+::://////:-
-:+ooooooooooooooooo+:://////:-- -:+ooooooooooooooooo+:://////:--
/ooooooooooooooooo+//////:- /ooooooooooooooooo+//////:-
-ooooooooooooooooooo////- -ooooooooooooooooooo////-
/ooooooooo+oooooooooo//: /ooooooooo+oooooooooo//:
:ooooooo+/::/+oooooooo+//- :ooooooo+/::/+oooooooo+//-
-oooooo/::///////+oooooo///- -oooooo/::///////+oooooo///-
/ooo+::://////:---:/+oooo//: /ooo+::://////:---:/+oooo//:
-o+/::///////:- -:/+o+//- -o+/::///////:- -:/+o+//-
:-:///////:- -:/:// :-:///////:- -:/://
-////:- --//: -////:- --//:
-- -: -- -:

53
lib/middleman/templates/mobile/source/index.html
View file

@ -1,8 +1,7 @@
<!doctype html> <!doctype html>
<!-- Conditional comment for mobile ie7 http://blogs.msdn.com/b/iemobile/ --> <!-- Conditional comment for mobile ie7 http://blogs.msdn.com/b/iemobile/ -->
<!-- Appcache Facts http://appcachefacts.info/ --> <!--[if IEMobile 7 ]> <html class="no-js iem7"> <![endif]-->
<!--[if IEMobile 7 ]> <html class="no-js iem7" manifest="default.appcache?v=1"> <![endif]--> <!--[if (gt IEMobile 7)|!(IEMobile)]><!--> <html class="no-js"> <!--<![endif]-->
<!--[if (gt IEMobile 7)|!(IEMobile)]><!--> <html class="no-js" manifest="default.appcache?v=1"> <!--<![endif]-->
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
@ -10,12 +9,12 @@
<title></title> <title></title>
<meta name="description" content=""> <meta name="description" content="">
<meta name="author" content=""> <meta name="author" content="">
<!-- Mobile viewport optimization http://goo.gl/b9SaQ --> <!-- Mobile viewport optimization http://goo.gl/b9SaQ -->
<meta name="HandheldFriendly" content="True"> <meta name="HandheldFriendly" content="True">
<meta name="MobileOptimized" content="320"/> <meta name="MobileOptimized" content="320">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- Home screen icon Mathias Bynens http://goo.gl/6nVq0 --> <!-- Home screen icon Mathias Bynens http://goo.gl/6nVq0 -->
<!-- For iPhone 4 with high-resolution Retina display: --> <!-- For iPhone 4 with high-resolution Retina display: -->
<link rel="apple-touch-icon-precomposed" sizes="114x114" href="img/h/apple-touch-icon.png"> <link rel="apple-touch-icon-precomposed" sizes="114x114" href="img/h/apple-touch-icon.png">
@ -25,22 +24,26 @@
<link rel="apple-touch-icon-precomposed" href="img/l/apple-touch-icon-precomposed.png"> <link rel="apple-touch-icon-precomposed" href="img/l/apple-touch-icon-precomposed.png">
<!-- For nokia devices: --> <!-- For nokia devices: -->
<link rel="shortcut icon" href="img/l/apple-touch-icon.png"> <link rel="shortcut icon" href="img/l/apple-touch-icon.png">
<!--iOS web app, deletable if not needed --> <!--iOS web app, deletable if not needed -->
<!--<meta name="apple-mobile-web-app-capable" content="yes"> <!--the script prevents links from opening in mobile safari. https://gist.github.com/1042026
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black"> <meta name="apple-mobile-web-app-status-bar-style" content="black">
<script>(function(a,b,c){if(c in b&&b[c]){var d,e=a.location,f=/^(a|html)$/i;a.addEventListener("click",function(a){d=a.target;while(!f.test(d.nodeName))d=d.parentNode;"href"in d&&(d.href.indexOf("http")||~d.href.indexOf(e.host))&&(a.preventDefault(),e.href=d.href)},!1)}})(document,window.navigator,"standalone")</script>
<link rel="apple-touch-startup-image" href="img/l/splash.png">--> <link rel="apple-touch-startup-image" href="img/l/splash.png">-->
<!-- Mobile IE allows us to activate ClearType technology for smoothing fonts for easy reading --> <!-- Mobile IE allows us to activate ClearType technology for smoothing fonts for easy reading -->
<meta http-equiv="cleartype" content="on"> <meta http-equiv="cleartype" content="on">
<!-- more tags for your 'head' to consider https://gist.github.com/849231 --> <!-- more tags for your 'head' to consider https://gist.github.com/849231 -->
<!-- Main Stylesheet --> <!-- Main Stylesheet -->
<link rel="stylesheet" href="css/style.css?v=1"> <link rel="stylesheet" href="css/style.css?v=1">
<!-- All JavaScript at the bottom, except for Modernizr which enables HTML5 elements & feature detects --> <!-- All JavaScript at the bottom, except for Modernizr which enables HTML5 elements & feature detects -->
<script src="js/libs/modernizr-custom.js"></script> <script src="js/libs/modernizr-custom.js"></script>
<!-- Media Queries Polyfill https://github.com/shichuan/mobile-html5-boilerplate/wiki/Media-Queries-Polyfill -->
<script>Modernizr.mq('(min-width:0)') || document.write('<script src="js/libs/respond.min.js">\x3C/script>')</script>
</head> </head>
<body> <body>
@ -50,9 +53,9 @@
</header> </header>
<div id="main" role="main"> <div id="main" role="main">
</div> </div>
<footer> <footer>
</footer> </footer>
@ -62,27 +65,21 @@
<!-- JavaScript at the bottom for fast page loading --> <!-- JavaScript at the bottom for fast page loading -->
<!-- Grab Google CDN's jQuery, with a protocol relative URL; fall back to local if necessary --> <!-- Grab Google CDN's jQuery, with a protocol relative URL; fall back to local if necessary -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.js"></script> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<script>window.jQuery || document.write("<script src='js/libs/jquery-1.5.1.min.js'>\x3C/script>")</script> <script>window.jQuery || document.write('<script src="js/libs/jquery-1.6.2.min.js"><\/script>')</script>
<!-- scripts concatenated and minified via ant build script --> <!-- scripts concatenated and minified via ant build script -->
<script src="js/mylibs/helper.js"></script> <script src="js/mylibs/helper.js"></script>
<!-- end concatenated and minified scripts--> <!-- end concatenated and minified scripts-->
<script> <script>
// iPhone Scale Bug Fix, read this when using http://www.blog.highub.com/mobile-2/a-fix-for-iphone-viewport-scale-bug/ // iPhone Scale Bug Fix, read this when using http://www.blog.highub.com/mobile-2/a-fix-for-iphone-viewport-scale-bug/
MBP.scaleFix(); MBP.scaleFix();
// Media Queries Polyfill https://github.com/shichuan/mobile-html5-boilerplate/wiki/Media-Queries-Polyfill
yepnope({
test : Modernizr.mq('(min-width)'),
nope : ['js/libs/respond.min.js']
});
</script> </script>
<!-- Debugger - remove for production --> <!-- Debugger - remove for production -->
<!-- <script src="https://getfirebug.com/firebug-lite.js"></script> --> <!-- <script src="https://getfirebug.com/firebug-lite.js"></script> -->
<!-- mathiasbynens.be/notes/async-analytics-snippet Change UA-XXXXX-X to be your site's ID --> <!-- mathiasbynens.be/notes/async-analytics-snippet Change UA-XXXXX-X to be your site's ID -->
<script> <script>
var _gaq=[["_setAccount","UA-XXXXX-X"],["_trackPageview"]]; var _gaq=[["_setAccount","UA-XXXXX-X"],["_trackPageview"]];

8316
lib/middleman/templates/mobile/source/js/libs/jquery-1.5.1.js vendored
View file

File diff suppressed because it is too large Load diff

16
lib/middleman/templates/mobile/source/js/libs/jquery-1.5.1.min.js vendored
View file

File diff suppressed because one or more lines are too long

28
lib/middleman/templates/mobile/source/js/libs/modernizr-custom.js
View file

File diff suppressed because one or more lines are too long

2
lib/middleman/templates/mobile/source/js/libs/respond.min.js vendored
View file

@ -4,4 +4,4 @@
* Dual licensed under the MIT or GPL Version 2 licenses. * Dual licensed under the MIT or GPL Version 2 licenses.
* Usage: Check out the readme file or github.com/scottjehl/respond * Usage: Check out the readme file or github.com/scottjehl/respond
*/ */
(function(d,g){d.respond={};respond.update=function(){};respond.mediaQueriesSupported=g;if(g){return}var s=d.document,q=s.documentElement,h=[],j=[],o=[],n={},f=30,e=s.getElementsByTagName("head")[0]||q,b=e.getElementsByTagName("link"),a=function(){var y=s.styleSheets,u=y.length;for(var x=0;x<u;x++){var w=y[x],v=w.href;if(!!v&&!n[v]){if(!/^([a-zA-Z]+?:(\/\/)?(www\.)?)/.test(v)||v.replace(RegExp.$1,"").split("/")[0]===d.location.host){var t=v;m(v,function(z){l(z,t);n[t]=true})}else{n[v]=true}}}},l=function(B,t){var z=B.match(/@media ([^\{]+)\{([\S\s]+?)(?=\}\/\*\/mediaquery\*\/)/gmi),C=z&&z.length||0,t=t.substring(0,t.lastIndexOf("/"));if(t.length){t+="/"}for(var w=0;w<C;w++){var x=z[w].match(/@media ([^\{]+)\{([\S\s]+?)$/)&&RegExp.$1,u=x.split(","),A=u.length;j.push(RegExp.$2&&RegExp.$2.replace(/(url\()['"]?([^\/\)'"][^:\)'"]+)['"]?(\))/g,"$1"+t+"$2$3"));for(var v=0;v<A;v++){var y=u[v];h.push({media:y.match(/(only\s+)?([a-zA-Z]+)(\sand)?/)&&RegExp.$2,rules:j.length-1,minw:y.match(/\(min\-width:\s?(\s?[0-9]+)px\s?\)/)&&parseFloat(RegExp.$1),maxw:y.match(/\(max\-width:\s?(\s?[0-9]+)px\s?\)/)&&parseFloat(RegExp.$1)})}}i()},k,p,i=function(C){var t="clientWidth",v=q[t],B=s.compatMode==="CSS1Compat"&&v||s.body[t]||v,x={},A=s.createDocumentFragment(),z=b[b.length-1],u=(new Date()).getTime();if(C&&k&&u-k<f){clearTimeout(p);p=setTimeout(i,f);return}else{k=u}for(var w in h){var D=h[w];if(!D.minw&&!D.maxw||(!D.minw||D.minw&&B>=D.minw)&&(!D.maxw||D.maxw&&B<=D.maxw)){if(!x[D.media]){x[D.media]=[]}x[D.media].push(j[D.rules])}}for(var w in o){if(o[w]&&o[w].parentNode===e){e.removeChild(o[w])}}for(var w in x){var E=s.createElement("style"),y=x[w].join("\n");E.type="text/css";E.media=w;if(E.styleSheet){E.styleSheet.cssText=y}else{E.appendChild(s.createTextNode(y))}A.appendChild(E);o.push(E)}e.insertBefore(A,z.nextSibling)},m=function(t,v){var u=c();if(!u){return}u.open("GET",t,true);u.onreadystatechange=function(){if(u.readyState!=4||u.status!=200&&u.status!=304){return}v(u.responseText)};if(u.readyState==4){return}u.send()},c=(function(){var t=false,u=[function(){return new ActiveXObject("Microsoft.XMLHTTP")},function(){return new ActiveXObject("Msxml3.XMLHTTP")},function(){return new ActiveXObject("Msxml2.XMLHTTP")},function(){return new XMLHttpRequest()}],w=u.length;while(w--){try{t=u[w]()}catch(v){continue}break}return function(){return t}})();a();respond.update=a;function r(){i(true)}if(d.addEventListener){d.addEventListener("resize",r,false)}else{if(d.attachEvent){d.attachEvent("onresize",r)}}})(this,(function(f){var g=(function(k){var i=3,l=document.createElement("div"),j=l.getElementsByTagName("i");while(l.innerHTML="<!--[if gt IE "+(++i)+"]><i></i><![endif]-->",j[0]){}return i>4?i:k}());if(f.matchMedia||g&&g>=9){return true}if(g&&g<=8){return false}var e=f.document,a=e.documentElement,b=e.createElement("body"),h=e.createElement("div"),d=e.createElement("style"),c="@media only all { #qtest { position: absolute; } }";h.setAttribute("id","qtest");d.type="text/css";b.appendChild(h);if(d.styleSheet){d.styleSheet.cssText=c}else{d.appendChild(e.createTextNode(c))}a.insertBefore(b,a.firstChild);a.insertBefore(d,b);support=(f.getComputedStyle?f.getComputedStyle(h,null):h.currentStyle)["position"]=="absolute";a.removeChild(b);a.removeChild(d);return support})(this)); (function(e,h){e.respond={};respond.update=function(){};respond.mediaQueriesSupported=h;if(h){return}var u=e.document,r=u.documentElement,i=[],k=[],p=[],o={},g=30,f=u.getElementsByTagName("head")[0]||r,b=f.getElementsByTagName("link"),d=[],a=function(){var B=b,w=B.length;for(var z=0;z<w;z++){var y=B[z],x=y.href,A=y.media,v=y.rel&&y.rel.toLowerCase()==="stylesheet";if(!!x&&v&&!o[x]){if(!/^([a-zA-Z]+?:(\/\/)?(www\.)?)/.test(x)||x.replace(RegExp.$1,"").split("/")[0]===e.location.host){d.push({href:x,media:A})}else{o[x]=true}}}t()},t=function(){if(d.length){var v=d.shift();n(v.href,function(w){m(w,v.href,v.media);o[v.href]=true;t()})}},m=function(G,v,x){var E=G.match(/@media ([^\{]+)\{([\S\s]+?)(?=\}[\s]*\/\*\/mediaquery\*\/)/gmi),H=E&&E.length||0,v=v.substring(0,v.lastIndexOf("/")),w=function(I){return I.replace(/(url\()['"]?([^\/\)'"][^:\)'"]+)['"]?(\))/g,"$1"+v+"$2$3")},y=!H&&x;if(v.length){v+="/"}if(y){H=1}for(var B=0;B<H;B++){var C;if(y){C=x;k.push(w(G))}else{C=E[B].match(/@media ([^\{]+)\{([\S\s]+?)$/)&&RegExp.$1;k.push(RegExp.$2&&w(RegExp.$2))}var z=C.split(","),F=z.length;for(var A=0;A<F;A++){var D=z[A];i.push({media:D.match(/(only\s+)?([a-zA-Z]+)(\sand)?/)&&RegExp.$2,rules:k.length-1,minw:D.match(/\(min\-width:[\s]*([\s]*[0-9]+)px[\s]*\)/)&&parseFloat(RegExp.$1),maxw:D.match(/\(max\-width:[\s]*([\s]*[0-9]+)px[\s]*\)/)&&parseFloat(RegExp.$1)})}}j()},l,q,j=function(E){var v="clientWidth",x=r[v],D=u.compatMode==="CSS1Compat"&&x||u.body[v]||x,z={},C=u.createDocumentFragment(),B=b[b.length-1],w=(new Date()).getTime();if(E&&l&&w-l<g){clearTimeout(q);q=setTimeout(j,g);return}else{l=w}for(var y in i){var F=i[y];if(!F.minw&&!F.maxw||(!F.minw||F.minw&&D>=F.minw)&&(!F.maxw||F.maxw&&D<=F.maxw)){if(!z[F.media]){z[F.media]=[]}z[F.media].push(k[F.rules])}}for(var y in p){if(p[y]&&p[y].parentNode===f){f.removeChild(p[y])}}for(var y in z){var G=u.createElement("style"),A=z[y].join("\n");G.type="text/css";G.media=y;if(G.styleSheet){G.styleSheet.cssText=A}else{G.appendChild(u.createTextNode(A))}C.appendChild(G);p.push(G)}f.insertBefore(C,B.nextSibling)},n=function(v,x){var w=c();if(!w){return}w.open("GET",v,true);w.onreadystatechange=function(){if(w.readyState!=4||w.status!=200&&w.status!=304){return}x(w.responseText)};if(w.readyState==4){return}w.send()},c=(function(){var v=false,w=[function(){return new ActiveXObject("Microsoft.XMLHTTP")},function(){return new ActiveXObject("Msxml3.XMLHTTP")},function(){return new ActiveXObject("Msxml2.XMLHTTP")},function(){return new XMLHttpRequest()}],y=w.length;while(y--){try{v=w[y]()}catch(x){continue}break}return function(){return v}})();a();respond.update=a;function s(){j(true)}if(e.addEventListener){e.addEventListener("resize",s,false)}else{if(e.attachEvent){e.attachEvent("onresize",s)}}})(this,(function(f){if(f.matchMedia){return true}var e,i=document,c=i.documentElement,g=c.firstElementChild||c.firstChild,h=!i.body,d=i.body||i.createElement("body"),b=i.createElement("div"),a="only all";b.id="mq-test-1";b.style.cssText="position:absolute;top:-99em";d.appendChild(b);b.innerHTML='_<style media="'+a+'"> #mq-test-1 { width: 9px; }</style>';if(h){c.insertBefore(d,g)}b.removeChild(b.firstChild);e=b.offsetWidth==9;if(h){c.removeChild(d)}else{d.removeChild(b)}return e})(this));

36
lib/middleman/templates/mobile/source/js/mylibs/helper.js
View file

@ -22,13 +22,36 @@ MBP.gestureStart = function () {
}; };
// Hide URL Bar for iOS // Hide URL Bar for iOS and Android by Scott Jehl
// http://remysharp.com/2010/08/05/doing-it-right-skipping-the-iphone-url-bar/ // https://gist.github.com/1183357
MBP.hideUrlBar = function () { MBP.hideUrlBar = function () {
/iPhone/.test(MBP.ua) && !pageYOffset && !location.hash && setTimeout(function () { var win = window,
window.scrollTo(0, 1); doc = win.document;
}, 1000);
// If there's a hash, or addEventListener is undefined, stop here
if( !location.hash || !win.addEventListener ){
//scroll to 1
window.scrollTo( 0, 1 );
var scrollTop = 1,
//reset to 0 on bodyready, if needed
bodycheck = setInterval(function(){
if( doc.body ){
clearInterval( bodycheck );
scrollTop = "scrollTop" in doc.body ? doc.body.scrollTop : 1;
win.scrollTo( 0, scrollTop === 1 ? 0 : 1 );
}
}, 15 );
win.addEventListener( "load", function(){
setTimeout(function(){
//reset to hide addr bar at onload
win.scrollTo( 0, scrollTop === 1 ? 0 : 1 );
}, 0);
}, false );
}
}; };
@ -63,7 +86,8 @@ MBP.fastButton.prototype.onTouchStart = function(event) {
}; };
MBP.fastButton.prototype.onTouchMove = function(event) { MBP.fastButton.prototype.onTouchMove = function(event) {
if(Math.abs(event.touches[0].clientX - this.startX) > 10 || Math.abs(event.touches[0].clientY - this.startY) > 10) { if(Math.abs(event.touches[0].clientX - this.startX) > 10 ||
Math.abs(event.touches[0].clientY - this.startY) > 10 ) {
this.reset(); this.reset();
} }
}; };

20
lib/middleman/templates/mobile/source/js/plugins.js Executable file
View file

@ -0,0 +1,20 @@
// usage: log('inside coolFunc', this, arguments);
// paulirish.com/2009/log-a-lightweight-wrapper-for-consolelog/
window.log = function(){
log.history = log.history || []; // store logs to an array for reference
log.history.push(arguments);
if(this.console) {
arguments.callee = arguments.callee.caller;
var newarr = [].slice.call(arguments);
(typeof console.log === 'object' ? log.apply.call(console.log, console, newarr) : console.log.apply(console, newarr));
}
};
// make it safe to use console.log always
(function(b){function c(){}for(var d="assert,clear,count,debug,dir,dirxml,error,exception,firebug,group,groupCollapsed,groupEnd,info,log,memoryProfile,memoryProfileEnd,profile,profileEnd,table,time,timeEnd,timeStamp,trace,warn".split(","),a;a=d.pop();){b[a]=b[a]||c}})((function(){try
{console.log();return window.console;}catch(err){return window.console={};}})());
// place any jQuery/helper plugins in here, instead of separate, slower script files.

9
lib/middleman/templates/mobile/source/robots.txt
View file

@ -1,5 +1,4 @@
# www.robotstxt.org/ # www.robotstxt.org/
# www.google.com/support/webmasters/bin/answer.py?hl=en&answer=156449 # www.google.com/support/webmasters/bin/answer.py?hl=en&answer=156449
User-agent: * User-agent: *

19
lib/middleman/templates/mobile/source/sitemap.xml
View file

@ -1,10 +1,9 @@
<?xml version="1.0" encoding="UTF-8" ?> <?xml version="1.0" encoding="UTF-8" ?>
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9" <urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9"
xmlns:mobile="http://www.google.com/schemas/sitemap-mobile/1.0"> xmlns:mobile="http://www.google.com/schemas/sitemap-mobile/1.0">
<!-- http://www.google.com/support/webmasters/bin/answer.py?answer=34648 --> <!-- http://www.google.com/support/webmasters/bin/answer.py?answer=34648 -->
<url> <url>
<!--<loc>http://mobile.example.com/index.html</loc>--> <!--<loc>http://mobile.example.com/index.html</loc>-->
<mobile:mobile/>
<mobile:mobile/> </url>
</url> </urlset>
</urlset>

62
lib/middleman/templates/mobile/source/test/index.html
View file

@ -1,31 +1,31 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head>
<title>QUnit Tests</title> <title>QUnit Tests</title>
<link rel="stylesheet" href="qunit/qunit.css" media="screen"> <link rel="stylesheet" href="qunit/qunit.css" media="screen">
<!-- reference your own javascript files here --> <!-- reference your own javascript files here -->
<script src="../js/modernizr-1.5.min.js"></script> <script src="../js/modernizr-custom.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> <script src="../js/libs/jquery-1.6.2.min.js"></script>
<script src="../js/plugins.js"></script> <script src="../js/mylibs/helper.js"></script>
<script src="../js/script.js"></script> <script src="../js/script.js"></script>
<!-- test runner files --> <!-- test runner files -->
<script src="qunit/qunit.js"></script> <script src="qunit/qunit.js"></script>
<script src="tests.js"></script> <script src="tests.js"></script>
</head> </head>
<body class="flora"> <body class="flora">
<h1 id="qunit-header">QUnit Test Suite</h1> <h1 id="qunit-header">QUnit Test Suite</h1>
<h2 id="qunit-banner"></h2> <h2 id="qunit-banner"></h2>
<div id="qunit-testrunner-toolbar"></div> <div id="qunit-testrunner-toolbar"></div>
<h2 id="qunit-userAgent"></h2> <h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests"></ol> <ol id="qunit-tests"></ol>
<div id="qunit-fixture">test markup</div> <div id="qunit-fixture">test markup</div>
</body> </body>
</html> </html>

296
lib/middleman/templates/mobile/source/test/qunit/qunit.css
View file

@ -1,148 +1,148 @@
/** Font Family and Sizes */ /** Font Family and Sizes */
#qunit-tests, #qunit-header, #qunit-banner, #qunit-testrunner-toolbar, #qunit-userAgent, #qunit-testresult { #qunit-tests, #qunit-header, #qunit-banner, #qunit-testrunner-toolbar, #qunit-userAgent, #qunit-testresult {
font-family: "Helvetica Neue Light", "HelveticaNeue-Light", "Helvetica Neue", Calibri, Helvetica, Arial; font-family: "Helvetica Neue Light", "HelveticaNeue-Light", "Helvetica Neue", Calibri, Helvetica, Arial;
} }
#qunit-testrunner-toolbar, #qunit-userAgent, #qunit-testresult, #qunit-tests li { font-size: small; } #qunit-testrunner-toolbar, #qunit-userAgent, #qunit-testresult, #qunit-tests li { font-size: small; }
#qunit-tests { font-size: smaller; } #qunit-tests { font-size: smaller; }
/** Resets */ /** Resets */
#qunit-tests, #qunit-tests li ol, #qunit-header, #qunit-banner, #qunit-userAgent, #qunit-testresult { #qunit-tests, #qunit-tests li ol, #qunit-header, #qunit-banner, #qunit-userAgent, #qunit-testresult {
margin: 0; margin: 0;
padding: 0; padding: 0;
} }
/** Header */ /** Header */
#qunit-header { #qunit-header {
padding: 0.5em 0 0.5em 1em; padding: 0.5em 0 0.5em 1em;
color: #fff; color: #fff;
text-shadow: rgba(0, 0, 0, 0.5) 4px 4px 1px; text-shadow: rgba(0, 0, 0, 0.5) 4px 4px 1px;
background-color: #0d3349; background-color: #0d3349;
border-radius: 15px 15px 0 0; border-radius: 15px 15px 0 0;
-moz-border-radius: 15px 15px 0 0; -moz-border-radius: 15px 15px 0 0;
-webkit-border-top-right-radius: 15px; -webkit-border-top-right-radius: 15px;
-webkit-border-top-left-radius: 15px; -webkit-border-top-left-radius: 15px;
} }
#qunit-banner { #qunit-banner {
height: 5px; height: 5px;
} }
#qunit-testrunner-toolbar { #qunit-testrunner-toolbar {
padding: 0em 0 0.5em 2em; padding: 0em 0 0.5em 2em;
} }
#qunit-userAgent { #qunit-userAgent {
padding: 0.5em 0 0.5em 2.5em; padding: 0.5em 0 0.5em 2.5em;
background-color: #2b81af; background-color: #2b81af;
color: #fff; color: #fff;
text-shadow: rgba(0, 0, 0, 0.5) 2px 2px 1px; text-shadow: rgba(0, 0, 0, 0.5) 2px 2px 1px;
} }
/** Tests: Pass/Fail */ /** Tests: Pass/Fail */
#qunit-tests { #qunit-tests {
list-style-position: inside; list-style-position: inside;
} }
#qunit-tests li { #qunit-tests li {
padding: 0.4em 0.5em 0.4em 2.5em; padding: 0.4em 0.5em 0.4em 2.5em;
border-bottom: 1px solid #fff; border-bottom: 1px solid #fff;
list-style-position: inside; list-style-position: inside;
} }
#qunit-tests li strong { #qunit-tests li strong {
cursor: pointer; cursor: pointer;
} }
#qunit-tests li ol { #qunit-tests li ol {
margin-top: 0.5em; margin-top: 0.5em;
padding: 0.5em; padding: 0.5em;
background-color: #fff; background-color: #fff;
border-radius: 15px; border-radius: 15px;
-moz-border-radius: 15px; -moz-border-radius: 15px;
-webkit-border-radius: 15px; -webkit-border-radius: 15px;
box-shadow: inset 0px 2px 13px #999; box-shadow: inset 0px 2px 13px #999;
-moz-box-shadow: inset 0px 2px 13px #999; -moz-box-shadow: inset 0px 2px 13px #999;
-webkit-box-shadow: inset 0px 2px 13px #999; -webkit-box-shadow: inset 0px 2px 13px #999;
} }
#qunit-tests li li { #qunit-tests li li {
margin: 0.5em; margin: 0.5em;
padding: 0.4em 0.5em 0.4em 0.5em; padding: 0.4em 0.5em 0.4em 0.5em;
background-color: #fff; background-color: #fff;
border-bottom: none; border-bottom: none;
list-style-position: inside; list-style-position: inside;
} }
/*** Passing Styles */ /*** Passing Styles */
#qunit-tests li li.pass { #qunit-tests li li.pass {
color: #5E740B; color: #5E740B;
background-color: #fff; background-color: #fff;
border-left: 26px solid #C6E746; border-left: 26px solid #C6E746;
} }
#qunit-tests li.pass { color: #528CE0; background-color: #D2E0E6; } #qunit-tests li.pass { color: #528CE0; background-color: #D2E0E6; }
#qunit-tests li.pass span.test-name { color: #366097; } #qunit-tests li.pass span.test-name { color: #366097; }
#qunit-tests li li.pass span.test-actual, #qunit-tests li li.pass span.test-actual,
#qunit-tests li li.pass span.test-expected { color: #999999; } #qunit-tests li li.pass span.test-expected { color: #999999; }
strong b.pass { color: #5E740B; } strong b.pass { color: #5E740B; }
#qunit-banner.qunit-pass { background-color: #C6E746; } #qunit-banner.qunit-pass { background-color: #C6E746; }
/*** Failing Styles */ /*** Failing Styles */
#qunit-tests li li.fail { #qunit-tests li li.fail {
color: #710909; color: #710909;
background-color: #fff; background-color: #fff;
border-left: 26px solid #EE5757; border-left: 26px solid #EE5757;
} }
#qunit-tests li.fail { color: #000000; background-color: #EE5757; } #qunit-tests li.fail { color: #000000; background-color: #EE5757; }
#qunit-tests li.fail span.test-name, #qunit-tests li.fail span.test-name,
#qunit-tests li.fail span.module-name { color: #000000; } #qunit-tests li.fail span.module-name { color: #000000; }
#qunit-tests li li.fail span.test-actual { color: #EE5757; } #qunit-tests li li.fail span.test-actual { color: #EE5757; }
#qunit-tests li li.fail span.test-expected { color: green; } #qunit-tests li li.fail span.test-expected { color: green; }
strong b.fail { color: #710909; } strong b.fail { color: #710909; }
#qunit-banner.qunit-fail, #qunit-banner.qunit-fail,
#qunit-testrunner-toolbar { background-color: #EE5757; } #qunit-testrunner-toolbar { background-color: #EE5757; }
/** Footer */ /** Footer */
#qunit-testresult { #qunit-testresult {
padding: 0.5em 0.5em 0.5em 2.5em; padding: 0.5em 0.5em 0.5em 2.5em;
color: #2b81af; color: #2b81af;
background-color: #D2E0E6; background-color: #D2E0E6;
border-radius: 0 0 15px 15px; border-radius: 0 0 15px 15px;
-moz-border-radius: 0 0 15px 15px; -moz-border-radius: 0 0 15px 15px;
-webkit-border-bottom-right-radius: 15px; -webkit-border-bottom-right-radius: 15px;
-webkit-border-bottom-left-radius: 15px; -webkit-border-bottom-left-radius: 15px;
} }
/** Fixture */ /** Fixture */
#qunit-fixture { #qunit-fixture {
position: absolute; position: absolute;
top: -10000px; top: -10000px;
left: -10000px; left: -10000px;
} }

2530
lib/middleman/templates/mobile/source/test/qunit/qunit.js
View file

File diff suppressed because it is too large Load diff

47
lib/middleman/templates/mobile/source/test/tests.js
View file

@ -1,26 +1,21 @@
// documentation on writing tests here: http://docs.jquery.com/QUnit // documentation on writing tests here: http://docs.jquery.com/QUnit
// example tests: https://github.com/jquery/qunit/blob/master/test/same.js // example tests: https://github.com/jquery/qunit/blob/master/test/same.js
// below are some general tests but feel free to delete them. // below are some general tests but feel free to delete them.
module("example tests"); module("example tests");
test('HTML5 Boilerplate is sweet',function(){ test('HTML5 Boilerplate is sweet',function(){
expect(1); expect(1);
equals('boilerplate'.replace('boilerplate','sweet'),'sweet','Yes. HTML5 Boilerplate is, in fact, sweet'); equals('boilerplate'.replace('boilerplate','sweet'),'sweet','Yes. HTML5 Boilerplate is, in fact, sweet');
}) });
// these test things from plugins.js // these test things from helper.js
test('Environment is good',function(){ test('Environment is good',function(){
expect(3); expect(2);
ok( !!window.log, 'log function present'); ok( !!window.MBP, 'Mobile Boilder Plate helper is present');
notEqual( window.MBP.ua, null, "we have a user agent. winning, duh.");
var history = log.history && log.history.length || 0; });
log('logging from the test suite.')
equals( log.history.length - history, 1, 'log history keeps track' )
ok( !!window.Modernizr, 'Modernizr global is present')
})