├── .gitattributes
├── .gitignore
├── .htaccess
├── 404.html
├── CHANGELOG.md
├── CONTRIBUTING.md
├── LICENSE.md
├── README.md
├── crossdomain.xml
├── css
    ├── main.css
    └── normalize.css
├── doc
    ├── README.md
    ├── crossdomain.md
    ├── css.md
    ├── extend.md
    ├── faq.md
    ├── html.md
    ├── js.md
    ├── misc.md
    └── usage.md
├── favicon.ico
├── humans.txt
├── img
    ├── startup
    │   ├── startup-retina-4in.png
    │   ├── startup-retina.png
    │   ├── startup-tablet-landscape-retina.png
    │   ├── startup-tablet-landscape.png
    │   ├── startup-tablet-portrait-retina.png
    │   ├── startup-tablet-portrait.png
    │   └── startup.png
    └── touch
    │   ├── apple-touch-icon-114x114-precomposed.png
    │   ├── apple-touch-icon-120x120-precomposed.png
    │   ├── apple-touch-icon-144x144-precomposed.png
    │   ├── apple-touch-icon-152x152-precomposed.png
    │   ├── apple-touch-icon-180x180-precomposed.png
    │   ├── apple-touch-icon-57x57-precomposed.png
    │   ├── apple-touch-icon-72x72-precomposed.png
    │   ├── apple-touch-icon-76x76-precomposed.png
    │   ├── apple-touch-icon.png
    │   ├── touch-icon-128x128.png
    │   └── touch-icon-192x192.png
├── index.html
├── js
    ├── helper.js
    ├── main.js
    ├── plugins.js
    └── vendor
    │   ├── jquery-2.1.3.js
    │   ├── jquery-2.1.3.min.js
    │   ├── jquery-2.1.3.min.map
    │   └── modernizr-2.8.3.min.js
├── manifest.webapp
└── robots.txt


/.gitattributes:
--------------------------------------------------------------------------------
1 | * text=auto


--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
1 | # Include your project-specific ignores in this file
2 | # Read about how to use .gitignore: https://help.github.com/articles/ignoring-files
3 | 


--------------------------------------------------------------------------------
/.htaccess:
--------------------------------------------------------------------------------
  1 | # Apache Server Configs v2.13.0 | MIT License
  2 | # https://github.com/h5bp/server-configs-apache
  3 | 
  4 | # (!) Using `.htaccess` files slows down Apache, therefore, if you have
  5 | # access to the main server configuration file (which is usually called
  6 | # `httpd.conf`), you should add this logic there.
  7 | #
  8 | # https://httpd.apache.org/docs/current/howto/htaccess.html.
  9 | 
 10 | # ######################################################################
 11 | # # CROSS-ORIGIN                                                       #
 12 | # ######################################################################
 13 | 
 14 | # ----------------------------------------------------------------------
 15 | # | Cross-origin requests                                              |
 16 | # ----------------------------------------------------------------------
 17 | 
 18 | # Allow cross-origin requests.
 19 | #
 20 | # https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS
 21 | # http://enable-cors.org/
 22 | # http://www.w3.org/TR/cors/
 23 | 
 24 | # <IfModule mod_headers.c>
 25 | #     Header set Access-Control-Allow-Origin "*"
 26 | # </IfModule>
 27 | 
 28 | # ----------------------------------------------------------------------
 29 | # | Cross-origin images                                                |
 30 | # ----------------------------------------------------------------------
 31 | 
 32 | # Send the CORS header for images when browsers request it.
 33 | #
 34 | # https://developer.mozilla.org/en-US/docs/Web/HTML/CORS_enabled_image
 35 | # https://blog.chromium.org/2011/07/using-cross-domain-images-in-webgl-and.html
 36 | 
 37 | <IfModule mod_setenvif.c>
 38 |     <IfModule mod_headers.c>
 39 |         <FilesMatch "\.(bmp|cur|gif|ico|jpe?g|png|svgz?|webp)$">
 40 |             SetEnvIf Origin ":" IS_CORS
 41 |             Header set Access-Control-Allow-Origin "*" env=IS_CORS
 42 |         </FilesMatch>
 43 |     </IfModule>
 44 | </IfModule>
 45 | 
 46 | # ----------------------------------------------------------------------
 47 | # | Cross-origin web fonts                                             |
 48 | # ----------------------------------------------------------------------
 49 | 
 50 | # Allow cross-origin access to web fonts.
 51 | 
 52 | <IfModule mod_headers.c>
 53 |     <FilesMatch "\.(eot|otf|tt[cf]|woff2?)$">
 54 |         Header set Access-Control-Allow-Origin "*"
 55 |     </FilesMatch>
 56 | </IfModule>
 57 | 
 58 | # ----------------------------------------------------------------------
 59 | # | Cross-origin resource timing                                       |
 60 | # ----------------------------------------------------------------------
 61 | 
 62 | # Allow cross-origin access to the timing information for all resources.
 63 | #
 64 | # If a resource isn't served with a `Timing-Allow-Origin` header that
 65 | # would allow its timing information to be shared with the document,
 66 | # some of the attributes of the `PerformanceResourceTiming` object will
 67 | # be set to zero.
 68 | #
 69 | # http://www.w3.org/TR/resource-timing/
 70 | # http://www.stevesouders.com/blog/2014/08/21/resource-timing-practical-tips/
 71 | 
 72 | # <IfModule mod_headers.c>
 73 | #     Header set Timing-Allow-Origin: "*"
 74 | # </IfModule>
 75 | 
 76 | 
 77 | # ######################################################################
 78 | # # ERRORS                                                             #
 79 | # ######################################################################
 80 | 
 81 | # ----------------------------------------------------------------------
 82 | # | Custom error messages/pages                                        |
 83 | # ----------------------------------------------------------------------
 84 | 
 85 | # Customize what Apache returns to the client in case of an error.
 86 | # https://httpd.apache.org/docs/current/mod/core.html#errordocument
 87 | 
 88 | ErrorDocument 404 /404.html
 89 | 
 90 | # ----------------------------------------------------------------------
 91 | # | Error prevention                                                   |
 92 | # ----------------------------------------------------------------------
 93 | 
 94 | # Disable the pattern matching based on filenames.
 95 | #
 96 | # This setting prevents Apache from returning a 404 error as the result
 97 | # of a rewrite when the directory with the same name does not exist.
 98 | #
 99 | # https://httpd.apache.org/docs/current/content-negotiation.html#multiviews
100 | 
101 | Options -MultiViews
102 | 
103 | 
104 | # ######################################################################
105 | # # INTERNET EXPLORER                                                  #
106 | # ######################################################################
107 | 
108 | # ----------------------------------------------------------------------
109 | # | Document modes                                                     |
110 | # ----------------------------------------------------------------------
111 | 
112 | # Force Internet Explorer 8/9/10 to render pages in the highest mode
113 | # available in the various cases when it may not.
114 | #
115 | # https://hsivonen.fi/doctype/#ie8
116 | #
117 | # (!) Starting with Internet Explorer 11, document modes are deprecated.
118 | # If your business still relies on older web apps and services that were
119 | # designed for older versions of Internet Explorer, you might want to
120 | # consider enabling `Enterprise Mode` throughout your company.
121 | #
122 | # https://msdn.microsoft.com/en-us/library/ie/bg182625.aspx#docmode
123 | # http://blogs.msdn.com/b/ie/archive/2014/04/02/stay-up-to-date-with-enterprise-mode-for-internet-explorer-11.aspx
124 | 
125 | <IfModule mod_headers.c>
126 | 
127 |     Header set X-UA-Compatible "IE=edge"
128 | 
129 |     # `mod_headers` cannot match based on the content-type, however,
130 |     # the `X-UA-Compatible` response header should be send only for
131 |     # HTML documents and not for the other resources.
132 | 
133 |     <FilesMatch "\.(appcache|atom|bbaw|bmp|crx|css|cur|eot|f4[abpv]|flv|geojson|gif|htc|ico|jpe?g|js|json(ld)?|m4[av]|manifest|map|mp4|oex|og[agv]|opus|otf|pdf|png|rdf|rss|safariextz|svgz?|swf|topojson|tt[cf]|txt|vcard|vcf|vtt|webapp|web[mp]|woff2?|xloc|xml|xpi)$">
134 |         Header unset X-UA-Compatible
135 |     </FilesMatch>
136 | 
137 | </IfModule>
138 | 
139 | # ----------------------------------------------------------------------
140 | # | Iframes cookies                                                    |
141 | # ----------------------------------------------------------------------
142 | 
143 | # Allow cookies to be set from iframes in Internet Explorer.
144 | #
145 | # https://msdn.microsoft.com/en-us/library/ms537343.aspx
146 | # http://www.w3.org/TR/2000/CR-P3P-20001215/
147 | 
148 | # <IfModule mod_headers.c>
149 | #     Header set P3P "policyref=\"/w3c/p3p.xml\", CP=\"IDC DSP COR ADM DEVi TAIi PSA PSD IVAi IVDi CONi HIS OUR IND CNT\""
150 | # </IfModule>
151 | 
152 | 
153 | # ######################################################################
154 | # # MEDIA TYPES AND CHARACTER ENCODINGS                                #
155 | # ######################################################################
156 | 
157 | # ----------------------------------------------------------------------
158 | # | Media types                                                        |
159 | # ----------------------------------------------------------------------
160 | 
161 | # Serve resources with the proper media types (f.k.a. MIME types).
162 | #
163 | # https://www.iana.org/assignments/media-types/media-types.xhtml
164 | # https://httpd.apache.org/docs/current/mod/mod_mime.html#addtype
165 | 
166 | <IfModule mod_mime.c>
167 | 
168 |   # Data interchange
169 | 
170 |     AddType application/atom+xml                        atom
171 |     AddType application/json                            json map topojson
172 |     AddType application/ld+json                         jsonld
173 |     AddType application/rss+xml                         rss
174 |     AddType application/vnd.geo+json                    geojson
175 |     AddType application/xml                             rdf xml
176 | 
177 | 
178 |   # JavaScript
179 | 
180 |     # Normalize to standard type.
181 |     # https://tools.ietf.org/html/rfc4329#section-7.2
182 | 
183 |     AddType application/javascript                      js
184 | 
185 | 
186 |   # Manifest files
187 | 
188 |     # If you are providing a web application manifest file (see
189 |     # the specification: https://w3c.github.io/manifest/), it is
190 |     # recommended that you serve it with the `application/manifest+json`
191 |     # media type.
192 |     #
193 |     # Because the web application manifest file doesn't have its
194 |     # own unique file extension, you can set its media type either
195 |     # by matching:
196 |     #
197 |     # 1) the exact location of the file (this can be done using a
198 |     #    directive such as `<Location>`, but it will NOT work in
199 |     #    the `.htaccess` file, so you will have to do it in the main
200 |     #    server configuration file or inside of a `<VirtualHost>`
201 |     #    container)
202 |     #
203 |     #    e.g.:
204 |     #
205 |     #       <Location "/.well-known/manifest.json">
206 |     #           AddType application/manifest+json               json
207 |     #       </Location>
208 |     #
209 |     # 2) the filename (this can be problematic as you will need to
210 |     #    ensure that you don't have any other file with the same name
211 |     #    as the one you gave to your web application manifest file)
212 |     #
213 |     #    e.g.:
214 |     #
215 |     #       <Files "manifest.json">
216 |     #           AddType application/manifest+json               json
217 |     #       </Files>
218 | 
219 |     AddType application/x-web-app-manifest+json         webapp
220 |     AddType text/cache-manifest                         appcache
221 | 
222 | 
223 |   # Media files
224 | 
225 |     AddType audio/mp4                                   f4a f4b m4a
226 |     AddType audio/ogg                                   oga ogg opus
227 |     AddType image/bmp                                   bmp
228 |     AddType image/svg+xml                               svg svgz
229 |     AddType image/webp                                  webp
230 |     AddType video/mp4                                   f4v f4p m4v mp4
231 |     AddType video/ogg                                   ogv
232 |     AddType video/webm                                  webm
233 |     AddType video/x-flv                                 flv
234 | 
235 |     # Serving `.ico` image files with a different media type
236 |     # prevents Internet Explorer from displaying then as images:
237 |     # https://github.com/h5bp/html5-boilerplate/commit/37b5fec090d00f38de64b591bcddcb205aadf8ee
238 | 
239 |     AddType image/x-icon                                cur ico
240 | 
241 | 
242 |   # Web fonts
243 | 
244 |     AddType application/font-woff                       woff
245 |     AddType application/font-woff2                      woff2
246 |     AddType application/vnd.ms-fontobject               eot
247 | 
248 |     # Browsers usually ignore the font media types and simply sniff
249 |     # the bytes to figure out the font type.
250 |     # https://mimesniff.spec.whatwg.org/#matching-a-font-type-pattern
251 |     #
252 |     # However, Blink and WebKit based browsers will show a warning
253 |     # in the console if the following font types are served with any
254 |     # other media types.
255 | 
256 |     AddType application/x-font-ttf                      ttc ttf
257 |     AddType font/opentype                               otf
258 | 
259 | 
260 |   # Other
261 | 
262 |     AddType application/octet-stream                    safariextz
263 |     AddType application/x-bb-appworld                   bbaw
264 |     AddType application/x-chrome-extension              crx
265 |     AddType application/x-opera-extension               oex
266 |     AddType application/x-xpinstall                     xpi
267 |     AddType text/vcard                                  vcard vcf
268 |     AddType text/vnd.rim.location.xloc                  xloc
269 |     AddType text/vtt                                    vtt
270 |     AddType text/x-component                            htc
271 | 
272 | </IfModule>
273 | 
274 | # ----------------------------------------------------------------------
275 | # | Character encodings                                                |
276 | # ----------------------------------------------------------------------
277 | 
278 | # Serve all resources labeled as `text/html` or `text/plain`
279 | # with the media type `charset` parameter set to `UTF-8`.
280 | #
281 | # https://httpd.apache.org/docs/current/mod/core.html#adddefaultcharset
282 | 
283 | AddDefaultCharset utf-8
284 | 
285 | # - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
286 | 
287 | # Serve the following file types with the media type `charset`
288 | # parameter set to `UTF-8`.
289 | #
290 | # https://httpd.apache.org/docs/current/mod/mod_mime.html#addcharset
291 | 
292 | <IfModule mod_mime.c>
293 |     AddCharset utf-8 .atom \
294 |                      .bbaw \
295 |                      .css \
296 |                      .geojson \
297 |                      .js \
298 |                      .json \
299 |                      .jsonld \
300 |                      .rdf \
301 |                      .rss \
302 |                      .topojson \
303 |                      .vtt \
304 |                      .webapp \
305 |                      .xloc \
306 |                      .xml
307 | </IfModule>
308 | 
309 | 
310 | # ######################################################################
311 | # # REWRITES                                                           #
312 | # ######################################################################
313 | 
314 | # ----------------------------------------------------------------------
315 | # | Rewrite engine                                                     |
316 | # ----------------------------------------------------------------------
317 | 
318 | # (1) Turn on the rewrite engine (this is necessary in order for
319 | #     the `RewriteRule` directives to work).
320 | #
321 | #     https://httpd.apache.org/docs/current/mod/mod_rewrite.html#RewriteEngine
322 | #
323 | # (2) Enable the `FollowSymLinks` option if it isn't already.
324 | #
325 | #     https://httpd.apache.org/docs/current/mod/core.html#options
326 | #
327 | # (3) If your web host doesn't allow the `FollowSymlinks` option,
328 | #     you need to comment it out or remove it, and then uncomment
329 | #     the `Options +SymLinksIfOwnerMatch` line (4), but be aware
330 | #     of the performance impact.
331 | #
332 | #     https://httpd.apache.org/docs/current/misc/perf-tuning.html#symlinks
333 | #
334 | # (4) Some cloud hosting services will require you set `RewriteBase`.
335 | #
336 | #     https://www.rackspace.com/knowledge_center/frequently-asked-question/why-is-modrewrite-not-working-on-my-site
337 | #     https://httpd.apache.org/docs/current/mod/mod_rewrite.html#rewritebase
338 | #
339 | # (5) Depending on how your server is set up, you may also need to
340 | #     use the `RewriteOptions` directive to enable some options for
341 | #     the rewrite engine.
342 | #
343 | #     https://httpd.apache.org/docs/current/mod/mod_rewrite.html#rewriteoptions
344 | #
345 | # (6) Set %{ENV:PROTO} variable, to allow rewrites to redirect with the
346 | #     appropriate schema automatically (http or https).
347 | 
348 | <IfModule mod_rewrite.c>
349 | 
350 |     # (1)
351 |     RewriteEngine On
352 | 
353 |     # (2)
354 |     Options +FollowSymlinks
355 | 
356 |     # (3)
357 |     # Options +SymLinksIfOwnerMatch
358 | 
359 |     # (4)
360 |     # RewriteBase /
361 | 
362 |     # (5)
363 |     # RewriteOptions <options>
364 | 
365 |     # (6)
366 |     RewriteCond %{HTTPS} =on
367 |     RewriteRule ^ - [env=proto:https]
368 |     RewriteCond %{HTTPS} !=on
369 |     RewriteRule ^ - [env=proto:http]
370 | 
371 | </IfModule>
372 | 
373 | # ----------------------------------------------------------------------
374 | # | Forcing `https://`                                                 |
375 | # ----------------------------------------------------------------------
376 | 
377 | # Redirect from the `http://` to the `https://` version of the URL.
378 | # https://wiki.apache.org/httpd/RewriteHTTPToHTTPS
379 | 
380 | # <IfModule mod_rewrite.c>
381 | #    RewriteEngine On
382 | #    RewriteCond %{HTTPS} !=on
383 | #    RewriteRule ^(.*)$ https://%{HTTP_HOST}/$1 [R=301,L]
384 | # </IfModule>
385 | 
386 | # ----------------------------------------------------------------------
387 | # | Suppressing / Forcing the `www.` at the beginning of URLs          |
388 | # ----------------------------------------------------------------------
389 | 
390 | # The same content should never be available under two different
391 | # URLs, especially not with and without `www.` at the beginning.
392 | # This can cause SEO problems (duplicate content), and therefore,
393 | # you should choose one of the alternatives and redirect the other
394 | # one.
395 | #
396 | # By default `Option 1` (no `www.`) is activated.
397 | # http://no-www.org/faq.php?q=class_b
398 | #
399 | # If you would prefer to use `Option 2`, just comment out all the
400 | # lines from `Option 1` and uncomment the ones from `Option 2`.
401 | #
402 | # (!) NEVER USE BOTH RULES AT THE SAME TIME!
403 | 
404 | # - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
405 | 
406 | # Option 1: rewrite www.example.com → example.com
407 | 
408 | <IfModule mod_rewrite.c>
409 |     RewriteEngine On
410 |     RewriteCond %{HTTPS} !=on
411 |     RewriteCond %{HTTP_HOST} ^www\.(.+)$ [NC]
412 |     RewriteRule ^ %{ENV:PROTO}://%1%{REQUEST_URI} [R=301,L]
413 | </IfModule>
414 | 
415 | # - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
416 | 
417 | # Option 2: rewrite example.com → www.example.com
418 | #
419 | # Be aware that the following might not be a good idea if you use "real"
420 | # subdomains for certain parts of your website.
421 | 
422 | # <IfModule mod_rewrite.c>
423 | #     RewriteEngine On
424 | #     RewriteCond %{HTTPS} !=on
425 | #     RewriteCond %{HTTP_HOST} !^www\. [NC]
426 | #     RewriteCond %{SERVER_ADDR} !=127.0.0.1
427 | #     RewriteCond %{SERVER_ADDR} !=::1
428 | #     RewriteRule ^ %{ENV:PROTO}://www.%{HTTP_HOST}%{REQUEST_URI} [R=301,L]
429 | # </IfModule>
430 | 
431 | 
432 | # ######################################################################
433 | # # SECURITY                                                           #
434 | # ######################################################################
435 | 
436 | # ----------------------------------------------------------------------
437 | # | Clickjacking                                                       |
438 | # ----------------------------------------------------------------------
439 | 
440 | # Protect website against clickjacking.
441 | #
442 | # The example below sends the `X-Frame-Options` response header with
443 | # the value `DENY`, informing browsers not to display the content of
444 | # the web page in any frame.
445 | #
446 | # This might not be the best setting for everyone. You should read
447 | # about the other two possible values the `X-Frame-Options` header
448 | # field can have: `SAMEORIGIN` and `ALLOW-FROM`.
449 | # https://tools.ietf.org/html/rfc7034#section-2.1.
450 | #
451 | # Keep in mind that while you could send the `X-Frame-Options` header
452 | # for all of your website’s pages, this has the potential downside that
453 | # it forbids even non-malicious framing of your content (e.g.: when
454 | # users visit your website using a Google Image Search results page).
455 | #
456 | # Nonetheless, you should ensure that you send the `X-Frame-Options`
457 | # header for all pages that allow a user to make a state changing
458 | # operation (e.g: pages that contain one-click purchase links, checkout
459 | # or bank-transfer confirmation pages, pages that make permanent
460 | # configuration changes, etc.).
461 | #
462 | # Sending the `X-Frame-Options` header can also protect your website
463 | # against more than just clickjacking attacks:
464 | # https://cure53.de/xfo-clickjacking.pdf.
465 | #
466 | # https://tools.ietf.org/html/rfc7034
467 | # http://blogs.msdn.com/b/ieinternals/archive/2010/03/30/combating-clickjacking-with-x-frame-options.aspx
468 | # https://www.owasp.org/index.php/Clickjacking
469 | 
470 | # <IfModule mod_headers.c>
471 | 
472 | #     Header set X-Frame-Options "DENY"
473 | 
474 | #     # `mod_headers` cannot match based on the content-type, however,
475 | #     # the `X-Frame-Options` response header should be send only for
476 | #     # HTML documents and not for the other resources.
477 | 
478 | #     <FilesMatch "\.(appcache|atom|bbaw|bmp|crx|css|cur|eot|f4[abpv]|flv|geojson|gif|htc|ico|jpe?g|js|json(ld)?|m4[av]|manifest|map|mp4|oex|og[agv]|opus|otf|pdf|png|rdf|rss|safariextz|svgz?|swf|topojson|tt[cf]|txt|vcard|vcf|vtt|webapp|web[mp]|woff2?|xloc|xml|xpi)$">
479 | #         Header unset X-Frame-Options
480 | #     </FilesMatch>
481 | 
482 | # </IfModule>
483 | 
484 | # ----------------------------------------------------------------------
485 | # | Content Security Policy (CSP)                                      |
486 | # ----------------------------------------------------------------------
487 | 
488 | # Mitigate the risk of cross-site scripting and other content-injection
489 | # attacks.
490 | #
491 | # This can be done by setting a `Content Security Policy` which
492 | # whitelists trusted sources of content for your website.
493 | #
494 | # The example header below allows ONLY scripts that are loaded from
495 | # the current website's origin (no inline scripts, no CDN, etc).
496 | # That almost certainly won't work as-is for your website!
497 | #
498 | # To make things easier, you can use an online CSP header generator
499 | # such as: http://cspisawesome.com/.
500 | #
501 | # http://content-security-policy.com/
502 | # http://www.html5rocks.com/en/tutorials/security/content-security-policy/
503 | # http://www.w3.org/TR/CSP11/).
504 | 
505 | # <IfModule mod_headers.c>
506 | 
507 | #     Header set Content-Security-Policy "script-src 'self'; object-src 'self'"
508 | 
509 | #     # `mod_headers` cannot match based on the content-type, however,
510 | #     # the `Content-Security-Policy` response header should be send
511 | #     # only for HTML documents and not for the other resources.
512 | 
513 | #     <FilesMatch "\.(appcache|atom|bbaw|bmp|crx|css|cur|eot|f4[abpv]|flv|geojson|gif|htc|ico|jpe?g|js|json(ld)?|m4[av]|manifest|map|mp4|oex|og[agv]|opus|otf|pdf|png|rdf|rss|safariextz|svgz?|swf|topojson|tt[cf]|txt|vcard|vcf|vtt|webapp|web[mp]|woff2?|xloc|xml|xpi)$">
514 | #         Header unset Content-Security-Policy
515 | #     </FilesMatch>
516 | 
517 | # </IfModule>
518 | 
519 | # ----------------------------------------------------------------------
520 | # | File access                                                        |
521 | # ----------------------------------------------------------------------
522 | 
523 | # Block access to directories without a default document.
524 | #
525 | # You should leave the following uncommented, as you shouldn't allow
526 | # anyone to surf through every directory on your server (which may
527 | # includes rather private places such as the CMS's directories).
528 | 
529 | <IfModule mod_autoindex.c>
530 |     Options -Indexes
531 | </IfModule>
532 | 
533 | # - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
534 | 
535 | # Block access to all hidden files and directories with the exception of
536 | # the visible content from within the `/.well-known/` hidden directory.
537 | #
538 | # These types of files usually contain user preferences or the preserved
539 | # state of an utility, and can include rather private places like, for
540 | # example, the `.git` or `.svn` directories.
541 | #
542 | # The `/.well-known/` directory represents the standard (RFC 5785) path
543 | # prefix for "well-known locations" (e.g.: `/.well-known/manifest.json`,
544 | # `/.well-known/keybase.txt`), and therefore, access to its visible
545 | # content should not be blocked.
546 | #
547 | # https://www.mnot.net/blog/2010/04/07/well-known
548 | # https://tools.ietf.org/html/rfc5785
549 | 
550 | <IfModule mod_rewrite.c>
551 |     RewriteEngine On
552 |     RewriteCond %{REQUEST_URI} "!(^|/)\.well-known/([^./]+./?)+$" [NC]
553 |     RewriteCond %{SCRIPT_FILENAME} -d [OR]
554 |     RewriteCond %{SCRIPT_FILENAME} -f
555 |     RewriteRule "(^|/)\." - [F]
556 | </IfModule>
557 | 
558 | # - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
559 | 
560 | # Block access to files that can expose sensitive information.
561 | #
562 | # By default, block access to backup and source files that may be
563 | # left by some text editors and can pose a security risk when anyone
564 | # has access to them.
565 | #
566 | # http://feross.org/cmsploit/
567 | #
568 | # (!) Update the `<FilesMatch>` regular expression from below to
569 | # include any files that might end up on your production server and
570 | # can expose sensitive information about your website. These files may
571 | # include: configuration files, files that contain metadata about the
572 | # project (e.g.: project dependencies), build scripts, etc..
573 | 
574 | <FilesMatch "(^#.*#|\.(bak|conf|dist|fla|in[ci]|log|psd|sh|sql|sw[op])|~)$">
575 | 
576 |     # Apache < 2.3
577 |     <IfModule !mod_authz_core.c>
578 |         Order allow,deny
579 |         Deny from all
580 |         Satisfy All
581 |     </IfModule>
582 | 
583 |     # Apache ≥ 2.3
584 |     <IfModule mod_authz_core.c>
585 |         Require all denied
586 |     </IfModule>
587 | 
588 | </FilesMatch>
589 | 
590 | # ----------------------------------------------------------------------
591 | # | HTTP Strict Transport Security (HSTS)                              |
592 | # ----------------------------------------------------------------------
593 | 
594 | # Force client-side SSL redirection.
595 | #
596 | # If a user types `example.com` in their browser, even if the server
597 | # redirects them to the secure version of the website, that still leaves
598 | # a window of opportunity (the initial HTTP connection) for an attacker
599 | # to downgrade or redirect the request.
600 | #
601 | # The following header ensures that browser will ONLY connect to your
602 | # server via HTTPS, regardless of what the users type in the browser's
603 | # address bar.
604 | #
605 | # (!) Remove the `includeSubDomains` optional directive if the website's
606 | # subdomains are not using HTTPS.
607 | #
608 | # http://www.html5rocks.com/en/tutorials/security/transport-layer-security/
609 | # https://tools.ietf.org/html/draft-ietf-websec-strict-transport-sec-14#section-6.1
610 | # http://blogs.msdn.com/b/ieinternals/archive/2014/08/18/hsts-strict-transport-security-attacks-mitigations-deployment-https.aspx
611 | 
612 | # <IfModule mod_headers.c>
613 | #     Header always set Strict-Transport-Security "max-age=16070400; includeSubDomains"
614 | # </IfModule>
615 | 
616 | # ----------------------------------------------------------------------
617 | # | Reducing MIME type security risks                                  |
618 | # ----------------------------------------------------------------------
619 | 
620 | # Prevent some browsers from MIME-sniffing the response.
621 | #
622 | # This reduces exposure to drive-by download attacks and cross-origin
623 | # data leaks, and should be left uncommented, especially if the server
624 | # is serving user-uploaded content or content that could potentially be
625 | # treated as executable by the browser.
626 | #
627 | # http://www.slideshare.net/hasegawayosuke/owasp-hasegawa
628 | # http://blogs.msdn.com/b/ie/archive/2008/07/02/ie8-security-part-v-comprehensive-protection.aspx
629 | # https://msdn.microsoft.com/en-us/library/ie/gg622941.aspx
630 | # https://mimesniff.spec.whatwg.org/
631 | 
632 | <IfModule mod_headers.c>
633 |     Header set X-Content-Type-Options "nosniff"
634 | </IfModule>
635 | 
636 | # ----------------------------------------------------------------------
637 | # | Reflected Cross-Site Scripting (XSS) attacks                       |
638 | # ----------------------------------------------------------------------
639 | 
640 | # (1) Try to re-enable the cross-site scripting (XSS) filter built
641 | #     into most web browsers.
642 | #
643 | #     The filter is usually enabled by default, but in some cases it
644 | #     may be disabled by the user. However, in Internet Explorer for
645 | #     example, it can be re-enabled just by sending the
646 | #     `X-XSS-Protection` header with the value of `1`.
647 | #
648 | # (2) Prevent web browsers from rendering the web page if a potential
649 | #     reflected (a.k.a non-persistent) XSS attack is detected by the
650 | #     filter.
651 | #
652 | #     By default, if the filter is enabled and browsers detect a
653 | #     reflected XSS attack, they will attempt to block the attack
654 | #     by making the smallest possible modifications to the returned
655 | #     web page.
656 | #
657 | #     Unfortunately, in some browsers (e.g.: Internet Explorer),
658 | #     this default behavior may allow the XSS filter to be exploited,
659 | #     thereby, it's better to inform browsers to prevent the rendering
660 | #     of the page altogether, instead of attempting to modify it.
661 | #
662 | #     https://hackademix.net/2009/11/21/ies-xss-filter-creates-xss-vulnerabilities
663 | #
664 | # (!) Do not rely on the XSS filter to prevent XSS attacks! Ensure that
665 | #     you are taking all possible measures to prevent XSS attacks, the
666 | #     most obvious being: validating and sanitizing your website's inputs.
667 | #
668 | # http://blogs.msdn.com/b/ie/archive/2008/07/02/ie8-security-part-iv-the-xss-filter.aspx
669 | # http://blogs.msdn.com/b/ieinternals/archive/2011/01/31/controlling-the-internet-explorer-xss-filter-with-the-x-xss-protection-http-header.aspx
670 | # https://www.owasp.org/index.php/Cross-site_Scripting_%28XSS%29
671 | 
672 | # <IfModule mod_headers.c>
673 | 
674 | #     #                           (1)    (2)
675 | #     Header set X-XSS-Protection "1; mode=block"
676 | 
677 | #     # `mod_headers` cannot match based on the content-type, however,
678 | #     # the `X-XSS-Protection` response header should be send only for
679 | #     # HTML documents and not for the other resources.
680 | 
681 | #     <FilesMatch "\.(appcache|atom|bbaw|bmp|crx|css|cur|eot|f4[abpv]|flv|geojson|gif|htc|ico|jpe?g|js|json(ld)?|m4[av]|manifest|map|mp4|oex|og[agv]|opus|otf|pdf|png|rdf|rss|safariextz|svgz?|swf|topojson|tt[cf]|txt|vcard|vcf|vtt|webapp|web[mp]|woff2?|xloc|xml|xpi)$">
682 | #         Header unset X-XSS-Protection
683 | #     </FilesMatch>
684 | 
685 | # </IfModule>
686 | 
687 | # ----------------------------------------------------------------------
688 | # | Server-side technology information                                 |
689 | # ----------------------------------------------------------------------
690 | 
691 | # Remove the `X-Powered-By` response header that:
692 | #
693 | #  * is set by some frameworks and server-side languages
694 | #    (e.g.: ASP.NET, PHP), and its value contains information
695 | #    about them (e.g.: their name, version number)
696 | #
697 | #  * doesn't provide any value as far as users are concern,
698 | #    and in some cases, the information provided by it can
699 | #    be used by attackers
700 | #
701 | # (!) If you can, you should disable the `X-Powered-By` header from the
702 | # language / framework level (e.g.: for PHP, you can do that by setting
703 | # `expose_php = off` in `php.ini`)
704 | #
705 | # https://php.net/manual/en/ini.core.php#ini.expose-php
706 | 
707 | <IfModule mod_headers.c>
708 |     Header unset X-Powered-By
709 | </IfModule>
710 | 
711 | # ----------------------------------------------------------------------
712 | # | Server software information                                        |
713 | # ----------------------------------------------------------------------
714 | 
715 | # Prevent Apache from adding a trailing footer line containing
716 | # information about the server to the server-generated documents
717 | # (e.g.: error messages, directory listings, etc.)
718 | #
719 | # https://httpd.apache.org/docs/current/mod/core.html#serversignature
720 | 
721 | ServerSignature Off
722 | 
723 | # - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
724 | 
725 | # Prevent Apache from sending in the `Server` response header its
726 | # exact version number, the description of the generic OS-type or
727 | # information about its compiled-in modules.
728 | #
729 | # (!) The `ServerTokens` directive will only work in the main server
730 | # configuration file, so don't try to enable it in the `.htaccess` file!
731 | #
732 | # https://httpd.apache.org/docs/current/mod/core.html#servertokens
733 | 
734 | #ServerTokens Prod
735 | 
736 | 
737 | # ######################################################################
738 | # # WEB PERFORMANCE                                                    #
739 | # ######################################################################
740 | 
741 | # ----------------------------------------------------------------------
742 | # | Compression                                                        |
743 | # ----------------------------------------------------------------------
744 | 
745 | <IfModule mod_deflate.c>
746 | 
747 |     # Force compression for mangled `Accept-Encoding` request headers
748 |     # https://developer.yahoo.com/blogs/ydn/pushing-beyond-gzipping-25601.html
749 | 
750 |     <IfModule mod_setenvif.c>
751 |         <IfModule mod_headers.c>
752 |             SetEnvIfNoCase ^(Accept-EncodXng|X-cept-Encoding|X{15}|~{15}|-{15})$ ^((gzip|deflate)\s*,?\s*)+|[X~-]{4,13}$ HAVE_Accept-Encoding
753 |             RequestHeader append Accept-Encoding "gzip,deflate" env=HAVE_Accept-Encoding
754 |         </IfModule>
755 |     </IfModule>
756 | 
757 |     # - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
758 | 
759 |     # Compress all output labeled with one of the following media types.
760 |     #
761 |     # (!) For Apache versions below version 2.3.7 you don't need to
762 |     # enable `mod_filter` and can remove the `<IfModule mod_filter.c>`
763 |     # and `</IfModule>` lines as `AddOutputFilterByType` is still in
764 |     # the core directives.
765 |     #
766 |     # https://httpd.apache.org/docs/current/mod/mod_filter.html#addoutputfilterbytype
767 | 
768 |     <IfModule mod_filter.c>
769 |         AddOutputFilterByType DEFLATE "application/atom+xml" \
770 |                                       "application/javascript" \
771 |                                       "application/json" \
772 |                                       "application/ld+json" \
773 |                                       "application/manifest+json" \
774 |                                       "application/rdf+xml" \
775 |                                       "application/rss+xml" \
776 |                                       "application/schema+json" \
777 |                                       "application/vnd.geo+json" \
778 |                                       "application/vnd.ms-fontobject" \
779 |                                       "application/x-font-ttf" \
780 |                                       "application/x-javascript" \
781 |                                       "application/x-web-app-manifest+json" \
782 |                                       "application/xhtml+xml" \
783 |                                       "application/xml" \
784 |                                       "font/eot" \
785 |                                       "font/opentype" \
786 |                                       "image/bmp" \
787 |                                       "image/svg+xml" \
788 |                                       "image/vnd.microsoft.icon" \
789 |                                       "image/x-icon" \
790 |                                       "text/cache-manifest" \
791 |                                       "text/css" \
792 |                                       "text/html" \
793 |                                       "text/javascript" \
794 |                                       "text/plain" \
795 |                                       "text/vcard" \
796 |                                       "text/vnd.rim.location.xloc" \
797 |                                       "text/vtt" \
798 |                                       "text/x-component" \
799 |                                       "text/x-cross-domain-policy" \
800 |                                       "text/xml"
801 | 
802 |     </IfModule>
803 | 
804 |     # - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
805 | 
806 |     # Map the following filename extensions to the specified
807 |     # encoding type in order to make Apache serve the file types
808 |     # with the appropriate `Content-Encoding` response header
809 |     # (do note that this will NOT make Apache compress them!).
810 |     #
811 |     # If these files types would be served without an appropriate
812 |     # `Content-Enable` response header, client applications (e.g.:
813 |     # browsers) wouldn't know that they first need to uncompress
814 |     # the response, and thus, wouldn't be able to understand the
815 |     # content.
816 |     #
817 |     # https://httpd.apache.org/docs/current/mod/mod_mime.html#addencoding
818 | 
819 |     <IfModule mod_mime.c>
820 |         AddEncoding gzip              svgz
821 |     </IfModule>
822 | 
823 | </IfModule>
824 | 
825 | # ----------------------------------------------------------------------
826 | # | Content transformation                                             |
827 | # ----------------------------------------------------------------------
828 | 
829 | # Prevent intermediate caches or proxies (e.g.: such as the ones
830 | # used by mobile network providers) from modifying the website's
831 | # content.
832 | #
833 | # https://tools.ietf.org/html/rfc2616#section-14.9.5
834 | #
835 | # (!) If you are using `mod_pagespeed`, please note that setting
836 | # the `Cache-Control: no-transform` response header will prevent
837 | # `PageSpeed` from rewriting `HTML` files, and, if the
838 | # `ModPagespeedDisableRewriteOnNoTransform` directive isn't set
839 | # to `off`, also from rewriting other resources.
840 | #
841 | # https://developers.google.com/speed/pagespeed/module/configuration#notransform
842 | 
843 | # <IfModule mod_headers.c>
844 | #     Header merge Cache-Control "no-transform"
845 | # </IfModule>
846 | 
847 | # ----------------------------------------------------------------------
848 | # | ETags                                                              |
849 | # ----------------------------------------------------------------------
850 | 
851 | # Remove `ETags` as resources are sent with far-future expires headers.
852 | #
853 | # https://developer.yahoo.com/performance/rules.html#etags
854 | # https://tools.ietf.org/html/rfc7232#section-2.3
855 | 
856 | # `FileETag None` doesn't work in all cases.
857 | <IfModule mod_headers.c>
858 |     Header unset ETag
859 | </IfModule>
860 | 
861 | FileETag None
862 | 
863 | # ----------------------------------------------------------------------
864 | # | Expires headers                                                    |
865 | # ----------------------------------------------------------------------
866 | 
867 | # Serve resources with far-future expires headers.
868 | #
869 | # (!) If you don't control versioning with filename-based
870 | # cache busting, you should consider lowering the cache times
871 | # to something like one week.
872 | #
873 | # https://httpd.apache.org/docs/current/mod/mod_expires.html
874 | 
875 | <IfModule mod_expires.c>
876 | 
877 |     ExpiresActive on
878 |     ExpiresDefault                                      "access plus 1 month"
879 | 
880 |   # CSS
881 |     ExpiresByType text/css                              "access plus 1 year"
882 | 
883 |   # Data interchange
884 |     ExpiresByType application/atom+xml                  "access plus 1 hour"
885 |     ExpiresByType application/rdf+xml                   "access plus 1 hour"
886 |     ExpiresByType application/rss+xml                   "access plus 1 hour"
887 | 
888 |     ExpiresByType application/json                      "access plus 0 seconds"
889 |     ExpiresByType application/ld+json                   "access plus 0 seconds"
890 |     ExpiresByType application/schema+json               "access plus 0 seconds"
891 |     ExpiresByType application/vnd.geo+json              "access plus 0 seconds"
892 |     ExpiresByType application/xml                       "access plus 0 seconds"
893 |     ExpiresByType text/xml                              "access plus 0 seconds"
894 | 
895 |   # Favicon (cannot be renamed!) and cursor images
896 |     ExpiresByType image/vnd.microsoft.icon              "access plus 1 week"
897 |     ExpiresByType image/x-icon                          "access plus 1 week"
898 | 
899 |   # HTML
900 |     ExpiresByType text/html                             "access plus 0 seconds"
901 | 
902 |   # JavaScript
903 |     ExpiresByType application/javascript                "access plus 1 year"
904 |     ExpiresByType application/x-javascript              "access plus 1 year"
905 |     ExpiresByType text/javascript                       "access plus 1 year"
906 | 
907 |   # Manifest files
908 |     ExpiresByType application/manifest+json             "access plus 1 year"
909 | 
910 |     ExpiresByType application/x-web-app-manifest+json   "access plus 0 seconds"
911 |     ExpiresByType text/cache-manifest                   "access plus 0 seconds"
912 | 
913 |   # Media files
914 |     ExpiresByType audio/ogg                             "access plus 1 month"
915 |     ExpiresByType image/bmp                             "access plus 1 month"
916 |     ExpiresByType image/gif                             "access plus 1 month"
917 |     ExpiresByType image/jpeg                            "access plus 1 month"
918 |     ExpiresByType image/png                             "access plus 1 month"
919 |     ExpiresByType image/svg+xml                         "access plus 1 month"
920 |     ExpiresByType image/webp                            "access plus 1 month"
921 |     ExpiresByType video/mp4                             "access plus 1 month"
922 |     ExpiresByType video/ogg                             "access plus 1 month"
923 |     ExpiresByType video/webm                            "access plus 1 month"
924 | 
925 |   # Web fonts
926 | 
927 |     # Embedded OpenType (EOT)
928 |     ExpiresByType application/vnd.ms-fontobject         "access plus 1 month"
929 |     ExpiresByType font/eot                              "access plus 1 month"
930 | 
931 |     # OpenType
932 |     ExpiresByType font/opentype                         "access plus 1 month"
933 | 
934 |     # TrueType
935 |     ExpiresByType application/x-font-ttf                "access plus 1 month"
936 | 
937 |     # Web Open Font Format (WOFF) 1.0
938 |     ExpiresByType application/font-woff                 "access plus 1 month"
939 |     ExpiresByType application/x-font-woff               "access plus 1 month"
940 |     ExpiresByType font/woff                             "access plus 1 month"
941 | 
942 |     # Web Open Font Format (WOFF) 2.0
943 |     ExpiresByType application/font-woff2                "access plus 1 month"
944 | 
945 |   # Other
946 |     ExpiresByType text/x-cross-domain-policy            "access plus 1 week"
947 | 
948 | </IfModule>
949 | 
950 | # ----------------------------------------------------------------------
951 | # | File concatenation                                                 |
952 | # ----------------------------------------------------------------------
953 | 
954 | # Allow concatenation from within specific files.
955 | #
956 | # e.g.:
957 | #
958 | #   If you have the following lines in a file called, for
959 | #   example, `main.combined.js`:
960 | #
961 | #       <!--#include file="js/jquery.js" -->
962 | #       <!--#include file="js/jquery.timer.js" -->
963 | #
964 | #   Apache will replace those lines with the content of the
965 | #   specified files.
966 | 
967 | # <IfModule mod_include.c>
968 | #     <FilesMatch "\.combined\.js$">
969 | #         Options +Includes
970 | #         AddOutputFilterByType INCLUDES application/javascript \
971 | #                                        application/x-javascript \
972 | #                                        text/javascript
973 | #         SetOutputFilter INCLUDES
974 | #     </FilesMatch>
975 | #     <FilesMatch "\.combined\.css$">
976 | #         Options +Includes
977 | #         AddOutputFilterByType INCLUDES text/css
978 | #         SetOutputFilter INCLUDES
979 | #     </FilesMatch>
980 | # </IfModule>
981 | 
982 | # ----------------------------------------------------------------------
983 | # | Filename-based cache busting                                       |
984 | # ----------------------------------------------------------------------
985 | 
986 | # If you're not using a build process to manage your filename version
987 | # revving, you might want to consider enabling the following directives
988 | # to route all requests such as `/style.12345.css` to `/style.css`.
989 | #
990 | # To understand why this is important and even a better solution than
991 | # using something like `*.css?v231`, please see:
992 | # http://www.stevesouders.com/blog/2008/08/23/revving-filenames-dont-use-querystring/
993 | 
994 | # <IfModule mod_rewrite.c>
995 | #     RewriteEngine On
996 | #     RewriteCond %{REQUEST_FILENAME} !-f
997 | #     RewriteRule ^(.+)\.(\d+)\.(bmp|css|cur|gif|ico|jpe?g|js|png|svgz?|webp)$ $1.$3 [L]
998 | # </IfModule>
999 | 


--------------------------------------------------------------------------------
/404.html:
--------------------------------------------------------------------------------
 1 | <!doctype html>
 2 | <html lang="en">
 3 | <head>
 4 |     <meta charset="utf-8">
 5 |     <title>Page Not Found</title>
 6 |     <meta name="viewport" content="width=device-width, initial-scale=1">
 7 |     <style>
 8 | 
 9 |         * {
10 |             line-height: 1.2;
11 |             margin: 0;
12 |         }
13 | 
14 |         html {
15 |             color: #888;
16 |             display: table;
17 |             font-family: sans-serif;
18 |             height: 100%;
19 |             text-align: center;
20 |             width: 100%;
21 |         }
22 | 
23 |         body {
24 |             display: table-cell;
25 |             vertical-align: middle;
26 |             margin: 2em auto;
27 |         }
28 | 
29 |         h1 {
30 |             color: #555;
31 |             font-size: 2em;
32 |             font-weight: 400;
33 |         }
34 | 
35 |         p {
36 |             margin: 0 auto;
37 |             width: 280px;
38 |         }
39 | 
40 |         @media only screen and (max-width: 280px) {
41 | 
42 |             body, p {
43 |                 width: 95%;
44 |             }
45 | 
46 |             h1 {
47 |                 font-size: 1.5em;
48 |                 margin: 0 0 0.3em;
49 |             }
50 | 
51 |         }
52 | 
53 |     </style>
54 | </head>
55 | <body>
56 |     <h1>Page Not Found</h1>
57 |     <p>Sorry, but the page you were trying to view does not exist.</p>
58 | </body>
59 | </html>
60 | <!-- IE needs 512+ bytes: http://blogs.msdn.com/b/ieinternals/archive/2010/08/19/http-error-pages-in-internet-explorer.aspx -->
61 | 


--------------------------------------------------------------------------------
/CHANGELOG.md:
--------------------------------------------------------------------------------
 1 | == HEAD
 2 | 
 3 | * Update Apache Server Configs to v2.13.0
 4 | * Update jQuery to v2.1.3
 5 | * Update _"Apple touch icons"_
 6 | * Update Normalize.css to v3.0.2
 7 | * Use `<!doctype html>` instead of `<!DOCTYPE html>`
 8 | * Add `lang=""` to `<html>`
 9 |   ([h5bp/html5-boilerplate@d916a72](https://github.com/h5bp/html5-boilerplate/commit/d916a720253d171a9b54818f2a07d14acbd2e4c7))
10 | * Add `timeline` and `timelineEnd` to the list of `console` methods (#221)
11 | * Use short version of shorthand for margin declaration in 404.html
12 | * Remove need to readjust margins in `404.html`
13 | * Add `Disallow:` to `robots.txt`
14 | * Update Modernizr to v2.8.3 (update to v2.8.2 see #211)
15 | 
16 | == 4.1.2
17 | 
18 | * Update to Apache Server Configs 2.3.0
19 | * Add support for Open Web Apps (#197)
20 | * Remove mobile-bookmark-bubble.
21 | * Remove conditional comment for Windows Phone 7
22 | * Update jQuery to v2.1.0
23 | * Update Normalize.css to v3.0.0
24 | * Option to add canonical link to desktop site. (#204)
25 | * Redesign 404 page (#202)
26 | * Update to Modernizr 2.7.1 (#201)
27 | * Hide URL Bar in iOS7 (#199)
28 | * Add to homescreen support for Chrome Mobile (#196)
29 | * Update to Modernizr 2.7.0 (#195)
30 | * Update Google Analytics snippet to Universal Analytics (#193)
31 | * Fixed `MBP.preventZoom` not limited to iOS devices and causing android problems (#190)
32 | * Fixed `MBP.startupImage` causing width issues on iOS 7 (#189)
33 | * Update to Normalize.css 2.1.3 (#188)
34 | * Add jQuery Source Maps (#184)
35 | * Update to jQuery 2.0.3 (#185)
36 | * Update to Normalize.css 2.1.2 (#181)
37 | * Replace Zepto with jQuery 2.0.0 (#152)
38 | * ghostClickHandler no longer listened for by default, so it plays nice with other 'tap' plugins (#168)
39 | * Updated Zepto.js to v1.0
40 | * Added new apple-touch-startup images (#149)
41 | * Use 32x32 favicon.ico for HiDPI displays.
42 | * Remove named function expression in plugins.js
43 | 
44 | == 4.1.0
45 | 
46 | * Update to Normalize.css 2.1.0.
47 | * Reinstated `initial-scale=1` in meta viewport
48 | * Added apple-touch-startup image support for iPhone 5 (#147, #151)
49 | * Fixed `MBP.preventScrolling` breaking range input controls when using touch events (#148)
50 | * Added meta tag for Win8 tile icon (#143)
51 | * Further improvements to `console` method stubbing (#142).
52 | * Update Modernizr to v2.6.2.
53 | * Changed autogrow helper method to use `input` instead of `keyup` events, so it also triggers on paste.
54 | * Add `apple-mobile-web-app-title` to iOS web app meta tags.
55 | * Add CONTRIBUTING.md.
56 | 
57 | == 4.0.0
58 | 
59 | * Update to Normalize.css 2.0.1 (#127).
60 | * Separate Normalize.css from the rest of the CSS.
61 | * Replace jQuery with Zepto.js as default (#11).
62 | * Update HiDPI example media query.
63 | * Various bug fixes to `MBP.fastButton` (#126, #116).
64 | * Add `MBP.startupImage` helper for apple web app startup images.
65 | * Add `MBP.preventScrolling` helper to prevent default scrolling on document window.
66 | * Update to Modernizr 2.6.1.
67 | * Add bundled docs (#125).
68 | * Add CHANGELOG.md (#129).
69 | * Add MIT License.
70 | * Code format and consistency changes.
71 | 
72 | == 3.0.0
73 | 
74 | * Remove `initial-scale=1.0` from meta.
75 | * Exclude `scalefix` by default.
76 | * Update startup tablet landscape dimensions.
77 | * Added `lang` attr.
78 | * Remove `meta` author.
79 | * Add `MBP.enableActive`.
80 | * Fix `MBP.hideUrlBar()` when addEventListener is undefined.
81 | * Prevent iOS from zooming on focus.
82 | * Work around a tricky bug in Android 2.3 to `MBP.fastButton`.
83 | * Remove Respond.js.
84 | * Split `hideUrlBar` into an intial function, and a general use function cached the scrollTop so that only needs to be detected once.
85 | * Move `helper.js` one level up.
86 | * Update jQuery to 1.7.1 and added missing fallback local file.
87 | * Update Modernizr to the latest version.
88 | * Add iPod (Touch) to `MBP.scaleFix`.
89 | * Remove `input::-moz-focus-inner` as it is not required on Firefox on Mobile.
90 | * Remove the ellipsis helper class.
91 | * Remove the build script.
92 | * Update 404 page to be consistent with HTML5 Boilerplate.
93 | * Remove `demo/` and `test/`.
94 | * Remove analytics and wspl.
95 | 


--------------------------------------------------------------------------------
/CONTRIBUTING.md:
--------------------------------------------------------------------------------
  1 | # Contributing to Mobile Boilerplate
  2 | 
  3 | ♥ [Mobile Boilerplate](http://html5boilerplate.com/mobile/) and want to get involved?
  4 | Thanks! There are plenty of ways you can help!
  5 | 
  6 | 
  7 | ## Reporting issues
  8 | 
  9 | A bug is a _demonstrable problem_ that is caused by the code in the
 10 | repository.
 11 | 
 12 | Please read the following guidelines before you [report an issue](https://github.com/h5bp/mobile-boilerplate/issues):
 13 | 
 14 | 1. **Use the GitHub issue search** &mdash; check if the issue has already been
 15 |    reported. If it has been, please comment on the existing issue.
 16 | 
 17 | 2. **Check if the issue has been fixed** &mdash; the latest `master` or
 18 |    development branch may already contain a fix.
 19 | 
 20 | 3. **Isolate the demonstrable problem** &mdash; make sure that the code in the
 21 |    project's repository is _definitely_ responsible for the issue. Create a
 22 |    [reduced test case](http://css-tricks.com/6263-reduced-test-cases/) - an
 23 |    extremely simple and immediately viewable example of the issue.
 24 | 
 25 | 4. **Include a live example** &mdash; provide a link to your reduced test case
 26 |    when appropriate (e.g. if the issue is related to (front-end technologies).
 27 |    Please use [jsFiddle](http://jsfiddle.net) to host examples.
 28 | 
 29 | Please try to be as detailed as possible in your report too. What is your
 30 | environment? What steps will reproduce the issue? What browser(s) and OS
 31 | experience the problem? What would you expect to be the outcome? All these
 32 | details will help people to assess and fix any potential bugs.
 33 | 
 34 | ### Example of a good bug report:
 35 | 
 36 | > Short and descriptive title
 37 | >
 38 | > A summary of the issue and the browser/OS environment in which it occurs. If
 39 | > suitable, include the steps required to reproduce the bug.
 40 | >
 41 | > 1. This is the first step
 42 | > 2. This is the second step
 43 | > 3. Further steps, etc.
 44 | >
 45 | > `<url>` (a link to the reduced test case)
 46 | >
 47 | > Any other information you want to share that is relevant to the issue being
 48 | > reported. This might include the lines of code that you have identified as
 49 | > causing the bug, and potential solutions (and your opinions on their
 50 | > merits).
 51 | 
 52 | A good bug report shouldn't leave people needing to chase you up to get further
 53 | information that is required to assess or fix the bug.
 54 | 
 55 | **[File a bug report](https://github.com/h5bp/mobile-boilerplate/issues)**
 56 | 
 57 | 
 58 | ## Pull requests
 59 | 
 60 | Good pull requests — patches, improvements, new features — are a fantastic
 61 | help. They should remain focused in scope and avoid containing unrelated
 62 | commits.
 63 | 
 64 | If your contribution involves a significant amount of work or substantial
 65 | changes to any part of the project, please open an issue to discuss it first.
 66 | 
 67 | Please follow this process; it's the best way to get your work included in the
 68 | project:
 69 | 
 70 | 1. [Fork](http://help.github.com/fork-a-repo/) the project.
 71 | 
 72 | 2. Clone your fork (`git clone
 73 |    https://github.com/<your-username>/mobile-boilerplate.git`).
 74 | 
 75 | 3. Add an `upstream` remote (`git remote add upstream
 76 |    https://github.com/h5bp/mobile-boilerplate.git`).
 77 | 
 78 | 4. Get the latest changes from upstream (e.g. `git pull upstream
 79 |    <dev-branch>`).
 80 | 
 81 | 5. Create a new topic branch to contain your feature, change, or fix (`git
 82 |    checkout -b <topic-branch-name>`).
 83 | 
 84 | 6. Make sure that your changes adhere to the current coding conventions used
 85 |    throughout the project - indentation, accurate comments, etc. Please update
 86 |    any documentation that is relevant to the change you are making.
 87 | 
 88 | 7. Commit your changes in logical chunks; use git's [interactive
 89 |    rebase](https://help.github.com/articles/interactive-rebase) feature to tidy
 90 |    up your commits before making them public. Please adhere to these [git commit
 91 |    message
 92 |    guidelines](http://tbaggery.com/2008/04/19/a-note-about-git-commit-messages.html)
 93 |    or your pull request is unlikely be merged into the main project.
 94 | 
 95 | 8. Locally merge (or rebase) the upstream branch into your topic branch.
 96 | 
 97 | 9. Push your topic branch up to your fork (`git push origin
 98 |    <topic-branch-name>`).
 99 | 
100 | 10. [Open a Pull Request](https://help.github.com/articles/using-pull-requests) with a
101 |     clear title and description. Please mention which browsers you tested in.
102 | 


--------------------------------------------------------------------------------
/LICENSE.md:
--------------------------------------------------------------------------------
 1 | Copyright (c) HTML5 Boilerplate
 2 | 
 3 | Permission is hereby granted, free of charge, to any person obtaining a copy of
 4 | this software and associated documentation files (the "Software"), to deal in
 5 | the Software without restriction, including without limitation the rights to
 6 | use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies
 7 | of the Software, and to permit persons to whom the Software is furnished to do
 8 | so, subject to the following conditions:
 9 | 
10 | The above copyright notice and this permission notice shall be included in all
11 | copies or substantial portions of the Software.
12 | 
13 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
14 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
15 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
16 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
17 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
18 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
19 | SOFTWARE.
20 | 


--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
 1 | # Deprecation Note
 2 | 
 3 | Mobile Boilerplate is no longer maintained. Please use
 4 | [HTML5 Boilerplate](https://html5boilerplate.com/) as a decent starting point
 5 | for your project.
 6 | 
 7 | ---
 8 | 
 9 | # [Mobile Boilerplate](http://html5boilerplate.com/mobile/)
10 | 
11 | Mobile Boilerplate is a professional front-end template that helps you build
12 | fast and robust mobile web applications. Spend more time developing and less
13 | time reinventing the wheel.
14 | 
15 | * Source: [https://github.com/h5bp/mobile-boilerplate](https://github.com/h5bp/mobile-boilerplate)
16 | * Homepage: [http://html5boilerplate.com/mobile/](http://html5boilerplate.com/mobile/)
17 | * Twitter: [@h5bp](http://twitter.com/h5bp)
18 | 
19 | 
20 | ## Quick start
21 | 
22 | Clone the git repo - `git clone https://github.com/h5bp/mobile-boilerplate.git` -
23 | or [download it](https://github.com/h5bp/mobile-boilerplate/zipball/master)
24 | 
25 | 
26 | ## Features
27 | 
28 | * Mobile browser optimizations.
29 | * CSS normalizations and common bug fixes.
30 | * The latest jQuery.
31 | * A custom Modernizr build for feature detection and a polyfill for CSS Media
32 |   Queries.
33 | * Home page icon for Android, iOS, Nokia, Firefox.
34 | * Cross-browser viewport optimization for Android, iOS, Mobile IE, Nokia,
35 |   and Blackberry.
36 | * Open Web App support for Firefox for Android and Firefox OS.
37 | * Better font rendering in Mobile IE.
38 | * iPhone web app meta.
39 | * INSTANT button click event.
40 | * Textarea autogrow plugin.
41 | * Hide URL bar method.
42 | * Prevent form zoom onfocus method.
43 | * Mobile site redirection.
44 | * User Agent Detection.
45 | * An optimized Google Analytics snippet.
46 | * Apache server caching, compression, and other configuration defaults for
47 |   Grade-A performance.
48 | * Cross-domain Ajax.
49 | * "Delete-key friendly." Easy to strip out parts you don't need.
50 | * Extensive inline and accompanying documentation.
51 | 
52 | 
53 | ## Documentation
54 | 
55 | Take a look at the [documentation table of contents](doc/README.md). This
56 | documentation is bundled with the project, which makes it readily available for
57 | offline reading and provides a useful starting point for any documentation you
58 | want to write about your project.
59 | 
60 | 
61 | ## Contributing
62 | 
63 | Anyone and everyone is welcome to [contribute](CONTRIBUTING.md).
64 | 


--------------------------------------------------------------------------------
/crossdomain.xml:
--------------------------------------------------------------------------------
 1 | <?xml version="1.0"?>
 2 | <!DOCTYPE cross-domain-policy SYSTEM "http://www.adobe.com/xml/dtds/cross-domain-policy.dtd">
 3 | <cross-domain-policy>
 4 |     <!-- Read this: https://www.adobe.com/devnet/articles/crossdomain_policy_file_spec.html -->
 5 | 
 6 |     <!-- Most restrictive policy: -->
 7 |     <site-control permitted-cross-domain-policies="none"/>
 8 | 
 9 |     <!-- Least restrictive policy: -->
10 |     <!--
11 |     <site-control permitted-cross-domain-policies="all"/>
12 |     <allow-access-from domain="*" to-ports="*" secure="false"/>
13 |     <allow-http-request-headers-from domain="*" headers="*" secure="false"/>
14 |     -->
15 | </cross-domain-policy>
16 | 


--------------------------------------------------------------------------------
/css/main.css:
--------------------------------------------------------------------------------
  1 | /*
  2 |  * HTML5 Boilerplate
  3 |  *
  4 |  * What follows is the result of much research on cross-browser styling.
  5 |  * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
  6 |  * Kroc Camen, and the H5BP dev community and team.
  7 |  */
  8 | 
  9 | /* ==========================================================================
 10 |    Base styles: opinionated defaults
 11 |    ========================================================================== */
 12 | 
 13 | html,
 14 | button,
 15 | input,
 16 | select,
 17 | textarea {
 18 |     color: #222;
 19 | }
 20 | 
 21 | body {
 22 |     font-size: 1em;
 23 |     line-height: 1.4;
 24 | }
 25 | 
 26 | a {
 27 |     color: #00e;
 28 | }
 29 | 
 30 | a:visited {
 31 |     color: #551a8b;
 32 | }
 33 | 
 34 | a:hover {
 35 |     color: #06e;
 36 | }
 37 | 
 38 | /*
 39 |  * Remove the gap between images and the bottom of their containers
 40 |  * https://github.com/h5bp/html5-boilerplate/issues/440
 41 |  */
 42 | 
 43 | img {
 44 |     vertical-align: middle;
 45 | }
 46 | 
 47 | /*
 48 |  * Remove default fieldset styles.
 49 |  */
 50 | 
 51 | fieldset {
 52 |     border: 0;
 53 |     margin: 0;
 54 |     padding: 0;
 55 | }
 56 | 
 57 | /*
 58 |  * Allow only vertical resizing of textareas.
 59 |  */
 60 | 
 61 | textarea {
 62 |     resize: vertical;
 63 | }
 64 | 
 65 | /* ==========================================================================
 66 |    Author's custom styles
 67 |    ========================================================================== */
 68 | 
 69 | 
 70 | 
 71 | 
 72 | 
 73 | 
 74 | 
 75 | 
 76 | 
 77 | 
 78 | 
 79 | 
 80 | 
 81 | 
 82 | 
 83 | 
 84 | 
 85 | 
 86 | /* ==========================================================================
 87 |    Helper classes
 88 |    ========================================================================== */
 89 | 
 90 | /* Prevent callout */
 91 | 
 92 | .nocallout {
 93 |     -webkit-touch-callout: none;
 94 | }
 95 | 
 96 | .pressed {
 97 |     background-color: rgba(0, 0, 0, 0.7);
 98 | }
 99 | 
100 | /* A hack for HTML5 contenteditable attribute on mobile */
101 | 
102 | textarea[contenteditable] {
103 |     -webkit-appearance: none;
104 | }
105 | 
106 | /* A workaround for S60 3.x and 5.0 devices which do not animated gif images if
107 |    they have been set as display: none */
108 | 
109 | .gifhidden {
110 |     position: absolute;
111 |     left: -100%;
112 | }
113 | 
114 | /*
115 |  * Image replacement
116 |  */
117 | 
118 | .ir {
119 |     background-color: transparent;
120 |     background-repeat: no-repeat;
121 |     border: 0;
122 |     direction: ltr;
123 |     display: block;
124 |     overflow: hidden;
125 |     text-align: left;
126 |     text-indent: -999em;
127 | }
128 | 
129 | .ir br {
130 |     display: none;
131 | }
132 | 
133 | /*
134 |  * Hide from both screenreaders and browsers
135 |  * http://juicystudio.com/article/screen-readers-display-none.php
136 |  */
137 | 
138 | .hidden {
139 |     display: none !important;
140 |     visibility: hidden;
141 | }
142 | 
143 | /*
144 |  * Hide only visually, but have it available for screenreaders
145 |  * http://snook.ca/archives/html_and_css/hiding-content-for-accessibility
146 |  */
147 | 
148 | .visuallyhidden {
149 |     border: 0;
150 |     clip: rect(0 0 0 0);
151 |     height: 1px;
152 |     margin: -1px;
153 |     overflow: hidden;
154 |     padding: 0;
155 |     position: absolute;
156 |     width: 1px;
157 | }
158 | 
159 | /*
160 |  * Extends the .visuallyhidden class to allow the element to be focusable
161 |  * when navigated to via the keyboard: https://www.drupal.org/node/897638
162 |  */
163 | 
164 | .visuallyhidden.focusable:active,
165 | .visuallyhidden.focusable:focus {
166 |     clip: auto;
167 |     height: auto;
168 |     margin: 0;
169 |     overflow: visible;
170 |     position: static;
171 |     width: auto;
172 | }
173 | 
174 | /*
175 |  * Hide visually and from screenreaders, but maintain layout
176 |  */
177 | 
178 | .invisible {
179 |     visibility: hidden;
180 | }
181 | 
182 | /**
183 |  * Clearfix helper
184 |  * Used to contain floats: http://nicolasgallagher.com/micro-clearfix-hack/
185 |  */
186 | 
187 | .clearfix:before,
188 | .clearfix:after {
189 |     content: "";
190 |     display: table;
191 | }
192 | 
193 | .clearfix:after {
194 |     clear: both;
195 | }
196 | 
197 | /* ==========================================================================
198 |    EXAMPLE Media Queries for Responsive Design.
199 |    Theses examples override the primary ('mobile first') styles.
200 |    Modify as content requires.
201 |    ========================================================================== */
202 | 
203 | @media only screen and (min-width: 800px) {
204 |     /* Style adjustments for viewports that meet the condition */
205 | }
206 | 
207 | @media only screen and (-webkit-min-device-pixel-ratio: 1.5),
208 |        only screen and (min-resolution: 144dpi) {
209 |     /* Style adjustments for viewports that meet the condition */
210 | }
211 | 


--------------------------------------------------------------------------------
/css/normalize.css:
--------------------------------------------------------------------------------
  1 | /*! normalize.css v3.0.2 | MIT License | github.com/necolas/normalize */
  2 | 
  3 | /**
  4 |  * 1. Set default font family to sans-serif.
  5 |  * 2. Prevent iOS text size adjust after orientation change, without disabling
  6 |  *    user zoom.
  7 |  */
  8 | 
  9 | html {
 10 |   font-family: sans-serif; /* 1 */
 11 |   -ms-text-size-adjust: 100%; /* 2 */
 12 |   -webkit-text-size-adjust: 100%; /* 2 */
 13 | }
 14 | 
 15 | /**
 16 |  * Remove default margin.
 17 |  */
 18 | 
 19 | body {
 20 |   margin: 0;
 21 | }
 22 | 
 23 | /* HTML5 display definitions
 24 |    ========================================================================== */
 25 | 
 26 | /**
 27 |  * Correct `block` display not defined for any HTML5 element in IE 8/9.
 28 |  * Correct `block` display not defined for `details` or `summary` in IE 10/11
 29 |  * and Firefox.
 30 |  * Correct `block` display not defined for `main` in IE 11.
 31 |  */
 32 | 
 33 | article,
 34 | aside,
 35 | details,
 36 | figcaption,
 37 | figure,
 38 | footer,
 39 | header,
 40 | hgroup,
 41 | main,
 42 | menu,
 43 | nav,
 44 | section,
 45 | summary {
 46 |   display: block;
 47 | }
 48 | 
 49 | /**
 50 |  * 1. Correct `inline-block` display not defined in IE 8/9.
 51 |  * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.
 52 |  */
 53 | 
 54 | audio,
 55 | canvas,
 56 | progress,
 57 | video {
 58 |   display: inline-block; /* 1 */
 59 |   vertical-align: baseline; /* 2 */
 60 | }
 61 | 
 62 | /**
 63 |  * Prevent modern browsers from displaying `audio` without controls.
 64 |  * Remove excess height in iOS 5 devices.
 65 |  */
 66 | 
 67 | audio:not([controls]) {
 68 |   display: none;
 69 |   height: 0;
 70 | }
 71 | 
 72 | /**
 73 |  * Address `[hidden]` styling not present in IE 8/9/10.
 74 |  * Hide the `template` element in IE 8/9/11, Safari, and Firefox < 22.
 75 |  */
 76 | 
 77 | [hidden],
 78 | template {
 79 |   display: none;
 80 | }
 81 | 
 82 | /* Links
 83 |    ========================================================================== */
 84 | 
 85 | /**
 86 |  * Remove the gray background color from active links in IE 10.
 87 |  */
 88 | 
 89 | a {
 90 |   background-color: transparent;
 91 | }
 92 | 
 93 | /**
 94 |  * Improve readability when focused and also mouse hovered in all browsers.
 95 |  */
 96 | 
 97 | a:active,
 98 | a:hover {
 99 |   outline: 0;
100 | }
101 | 
102 | /* Text-level semantics
103 |    ========================================================================== */
104 | 
105 | /**
106 |  * Address styling not present in IE 8/9/10/11, Safari, and Chrome.
107 |  */
108 | 
109 | abbr[title] {
110 |   border-bottom: 1px dotted;
111 | }
112 | 
113 | /**
114 |  * Address style set to `bolder` in Firefox 4+, Safari, and Chrome.
115 |  */
116 | 
117 | b,
118 | strong {
119 |   font-weight: bold;
120 | }
121 | 
122 | /**
123 |  * Address styling not present in Safari and Chrome.
124 |  */
125 | 
126 | dfn {
127 |   font-style: italic;
128 | }
129 | 
130 | /**
131 |  * Address variable `h1` font-size and margin within `section` and `article`
132 |  * contexts in Firefox 4+, Safari, and Chrome.
133 |  */
134 | 
135 | h1 {
136 |   font-size: 2em;
137 |   margin: 0.67em 0;
138 | }
139 | 
140 | /**
141 |  * Address styling not present in IE 8/9.
142 |  */
143 | 
144 | mark {
145 |   background: #ff0;
146 |   color: #000;
147 | }
148 | 
149 | /**
150 |  * Address inconsistent and variable font size in all browsers.
151 |  */
152 | 
153 | small {
154 |   font-size: 80%;
155 | }
156 | 
157 | /**
158 |  * Prevent `sub` and `sup` affecting `line-height` in all browsers.
159 |  */
160 | 
161 | sub,
162 | sup {
163 |   font-size: 75%;
164 |   line-height: 0;
165 |   position: relative;
166 |   vertical-align: baseline;
167 | }
168 | 
169 | sup {
170 |   top: -0.5em;
171 | }
172 | 
173 | sub {
174 |   bottom: -0.25em;
175 | }
176 | 
177 | /* Embedded content
178 |    ========================================================================== */
179 | 
180 | /**
181 |  * Remove border when inside `a` element in IE 8/9/10.
182 |  */
183 | 
184 | img {
185 |   border: 0;
186 | }
187 | 
188 | /**
189 |  * Correct overflow not hidden in IE 9/10/11.
190 |  */
191 | 
192 | svg:not(:root) {
193 |   overflow: hidden;
194 | }
195 | 
196 | /* Grouping content
197 |    ========================================================================== */
198 | 
199 | /**
200 |  * Address margin not present in IE 8/9 and Safari.
201 |  */
202 | 
203 | figure {
204 |   margin: 1em 40px;
205 | }
206 | 
207 | /**
208 |  * Address differences between Firefox and other browsers.
209 |  */
210 | 
211 | hr {
212 |   -moz-box-sizing: content-box;
213 |   box-sizing: content-box;
214 |   height: 0;
215 | }
216 | 
217 | /**
218 |  * Contain overflow in all browsers.
219 |  */
220 | 
221 | pre {
222 |   overflow: auto;
223 | }
224 | 
225 | /**
226 |  * Address odd `em`-unit font size rendering in all browsers.
227 |  */
228 | 
229 | code,
230 | kbd,
231 | pre,
232 | samp {
233 |   font-family: monospace, monospace;
234 |   font-size: 1em;
235 | }
236 | 
237 | /* Forms
238 |    ========================================================================== */
239 | 
240 | /**
241 |  * Known limitation: by default, Chrome and Safari on OS X allow very limited
242 |  * styling of `select`, unless a `border` property is set.
243 |  */
244 | 
245 | /**
246 |  * 1. Correct color not being inherited.
247 |  *    Known issue: affects color of disabled elements.
248 |  * 2. Correct font properties not being inherited.
249 |  * 3. Address margins set differently in Firefox 4+, Safari, and Chrome.
250 |  */
251 | 
252 | button,
253 | input,
254 | optgroup,
255 | select,
256 | textarea {
257 |   color: inherit; /* 1 */
258 |   font: inherit; /* 2 */
259 |   margin: 0; /* 3 */
260 | }
261 | 
262 | /**
263 |  * Address `overflow` set to `hidden` in IE 8/9/10/11.
264 |  */
265 | 
266 | button {
267 |   overflow: visible;
268 | }
269 | 
270 | /**
271 |  * Address inconsistent `text-transform` inheritance for `button` and `select`.
272 |  * All other form control elements do not inherit `text-transform` values.
273 |  * Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera.
274 |  * Correct `select` style inheritance in Firefox.
275 |  */
276 | 
277 | button,
278 | select {
279 |   text-transform: none;
280 | }
281 | 
282 | /**
283 |  * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
284 |  *    and `video` controls.
285 |  * 2. Correct inability to style clickable `input` types in iOS.
286 |  * 3. Improve usability and consistency of cursor style between image-type
287 |  *    `input` and others.
288 |  */
289 | 
290 | button,
291 | html input[type="button"], /* 1 */
292 | input[type="reset"],
293 | input[type="submit"] {
294 |   -webkit-appearance: button; /* 2 */
295 |   cursor: pointer; /* 3 */
296 | }
297 | 
298 | /**
299 |  * Re-set default cursor for disabled elements.
300 |  */
301 | 
302 | button[disabled],
303 | html input[disabled] {
304 |   cursor: default;
305 | }
306 | 
307 | /**
308 |  * Remove inner padding and border in Firefox 4+.
309 |  */
310 | 
311 | button::-moz-focus-inner,
312 | input::-moz-focus-inner {
313 |   border: 0;
314 |   padding: 0;
315 | }
316 | 
317 | /**
318 |  * Address Firefox 4+ setting `line-height` on `input` using `!important` in
319 |  * the UA stylesheet.
320 |  */
321 | 
322 | input {
323 |   line-height: normal;
324 | }
325 | 
326 | /**
327 |  * It's recommended that you don't attempt to style these elements.
328 |  * Firefox's implementation doesn't respect box-sizing, padding, or width.
329 |  *
330 |  * 1. Address box sizing set to `content-box` in IE 8/9/10.
331 |  * 2. Remove excess padding in IE 8/9/10.
332 |  */
333 | 
334 | input[type="checkbox"],
335 | input[type="radio"] {
336 |   box-sizing: border-box; /* 1 */
337 |   padding: 0; /* 2 */
338 | }
339 | 
340 | /**
341 |  * Fix the cursor style for Chrome's increment/decrement buttons. For certain
342 |  * `font-size` values of the `input`, it causes the cursor style of the
343 |  * decrement button to change from `default` to `text`.
344 |  */
345 | 
346 | input[type="number"]::-webkit-inner-spin-button,
347 | input[type="number"]::-webkit-outer-spin-button {
348 |   height: auto;
349 | }
350 | 
351 | /**
352 |  * 1. Address `appearance` set to `searchfield` in Safari and Chrome.
353 |  * 2. Address `box-sizing` set to `border-box` in Safari and Chrome
354 |  *    (include `-moz` to future-proof).
355 |  */
356 | 
357 | input[type="search"] {
358 |   -webkit-appearance: textfield; /* 1 */
359 |   -moz-box-sizing: content-box;
360 |   -webkit-box-sizing: content-box; /* 2 */
361 |   box-sizing: content-box;
362 | }
363 | 
364 | /**
365 |  * Remove inner padding and search cancel button in Safari and Chrome on OS X.
366 |  * Safari (but not Chrome) clips the cancel button when the search input has
367 |  * padding (and `textfield` appearance).
368 |  */
369 | 
370 | input[type="search"]::-webkit-search-cancel-button,
371 | input[type="search"]::-webkit-search-decoration {
372 |   -webkit-appearance: none;
373 | }
374 | 
375 | /**
376 |  * Define consistent border, margin, and padding.
377 |  */
378 | 
379 | fieldset {
380 |   border: 1px solid #c0c0c0;
381 |   margin: 0 2px;
382 |   padding: 0.35em 0.625em 0.75em;
383 | }
384 | 
385 | /**
386 |  * 1. Correct `color` not being inherited in IE 8/9/10/11.
387 |  * 2. Remove padding so people aren't caught out if they zero out fieldsets.
388 |  */
389 | 
390 | legend {
391 |   border: 0; /* 1 */
392 |   padding: 0; /* 2 */
393 | }
394 | 
395 | /**
396 |  * Remove default vertical scrollbar in IE 8/9/10/11.
397 |  */
398 | 
399 | textarea {
400 |   overflow: auto;
401 | }
402 | 
403 | /**
404 |  * Don't inherit the `font-weight` (applied by a rule above).
405 |  * NOTE: the default cannot safely be changed in Chrome and Safari on OS X.
406 |  */
407 | 
408 | optgroup {
409 |   font-weight: bold;
410 | }
411 | 
412 | /* Tables
413 |    ========================================================================== */
414 | 
415 | /**
416 |  * Remove most spacing between table cells.
417 |  */
418 | 
419 | table {
420 |   border-collapse: collapse;
421 |   border-spacing: 0;
422 | }
423 | 
424 | td,
425 | th {
426 |   padding: 0;
427 | }
428 | 


--------------------------------------------------------------------------------
/doc/README.md:
--------------------------------------------------------------------------------
 1 | [Mobile Boilerplate homepage](http://html5boilerplate.com/mobile/)
 2 | 
 3 | # Mobile Boilerplate documentation:
 4 | 
 5 | MBP (Mobile Boilerplate) is based on H5BP (HTML5 Boilerplate), a rock-solid HTML5 default for web developer to quickly start their mobile web development. This documentation contains docs specific to the MBP; only mobile specific topics are addressed here.
 6 | 
 7 | ## Getting started
 8 | 
 9 | * [Usage](usage.md) — Overview of the project contents.
10 | * [FAQ](faq.md) — Frequently asked questions, along with their answers.
11 | 
12 | ## The core of Mobile Boilerplate
13 | 
14 | * [HTML](html.md) — A guide to the default HTML.
15 | * [CSS](css.md) — A guide to the default CSS.
16 | * [JavaScript](js.md) — A guide to the default JavaScript.
17 | * [.htaccess](https://github.com/h5bp/server-configs-apache)
18 |   — All about the Apache web server configs (also see our [alternative server
19 |   configs](https://github.com/h5bp/server-configs/blob/master/README.md)).
20 | * [crossdomain.xml](crossdomain.md) — An introduction to making use of
21 |   crossdomain requests.
22 | * [Everything else](misc.md).
23 | 
24 | ## Development
25 | 
26 | * [Extending and customizing Mobile Boilerplate](extend.md) — Going further with
27 |   the boilerplate.
28 | 
29 | ## Related projects
30 | 
31 | Mobile Boilerplate has several related projects to help improve the performance
32 | of your site/app in various production environments.
33 | 
34 | * [Server configs](https://github.com/h5bp/server-configs) — Configs for
35 |   different servers.
36 | * [Ant build script](https://github.com/h5bp/ant-build-script) — The original
37 |   HTML5 Boilerplate build script.
38 | 


--------------------------------------------------------------------------------
/doc/crossdomain.md:
--------------------------------------------------------------------------------
 1 | [Mobile Boilerplate homepage](http://html5boilerplate.com/mobile/) | [Documentation
 2 | table of contents](README.md)
 3 | 
 4 | # crossdomain.xml
 5 | 
 6 | A cross-domain policy file is an XML document that grants a web client—such as
 7 | Adobe Flash Player, Adobe Reader, etc., permission to handle data across
 8 | multiple domains. When a client hosts content from a particular source domain
 9 | and that content makes requests directed towards a domain other than its own,
10 | the remote domain would need to host a cross-domain policy file that grants
11 | access to the source domain, allowing the client to continue with the
12 | transaction. Policy files grant read access to data, permit a client to include
13 | custom headers in cross-domain requests, and are also used with sockets to
14 | grant permissions for socket-based connections.
15 | 
16 | For full details, check out Adobe's article about the [cross-domain policy file
17 | specification](https://www.adobe.com/devnet/articles/crossdomain_policy_file_spec.html)
18 | 
19 | Read the [Cross-domain policy file
20 | specification](https://www.adobe.com/devnet-docs/acrobatetk/tools/AppSec/CrossDomain_PolicyFile_Specification.pdf).
21 | 


--------------------------------------------------------------------------------
/doc/css.md:
--------------------------------------------------------------------------------
  1 | [Mobile Boilerplate homepage](http://html5boilerplate.com/mobile/) | [Documentation
  2 | table of contents](README.md)
  3 | 
  4 | # The CSS
  5 | 
  6 | The Mobile Boilerplate starting CSS includes:
  7 | 
  8 | * [Normalize.css](https://github.com/necolas/normalize.css).
  9 | * Useful Mobile Boilerplate defaults.
 10 | * Common helpers.
 11 | * Placeholder media queries.
 12 | 
 13 | This starting CSS does not rely on the presence of conditional classnames,
 14 | conditional style sheets, or Modernizr. It is ready to use whatever your
 15 | development preferences happen to be.
 16 | 
 17 | 
 18 | ## Normalize.css
 19 | 
 20 | Normalize.css is a modern, HTML5-ready alternative to CSS resets. It contains
 21 | extensive inline documentation. Please refer to the [Normalize.css
 22 | project](https://necolas.github.com/normalize.css/) for more information.
 23 | 
 24 | 
 25 | ## Mobile Boilerplate defaults
 26 | 
 27 | This project includes a handful of base styles that build upon Normalize.css.
 28 | These include:
 29 | 
 30 | * Basic typography setting to provide improved text readability by default.
 31 | * Tweaks to default image alignment, fieldsets, and textareas.
 32 | 
 33 | You are free to modify or add to these base styles as your project requires.
 34 | 
 35 | 
 36 | ## Common helpers
 37 | 
 38 | #### `.nocallout`
 39 | 
 40 | Prevent the callout menu appearing in iOS Safari when the user performs tap & hold.
 41 | 
 42 | #### `.pressed`
 43 | 
 44 | An active button class for Mobile Boilerplate's `fastButton` helper method.
 45 | 
 46 | #### `textarea[contenteditable]`
 47 | 
 48 | A hack for HTML5 contenteditable attribute on mobile
 49 | 
 50 | #### `.gifhidden`
 51 | 
 52 | A workaround for S60 3.x and 5.0 devices which do not animated gif images if they have been set as display: none
 53 | 
 54 | #### `.ir`
 55 | 
 56 | Add the `.ir` class to any element you are applying image-replacement to. Be
 57 | sure to include `background-image: url(pathtoimage.png);` for that specific
 58 | element so that image replacement can occur.
 59 | 
 60 | #### `.hidden`
 61 | 
 62 | Add the `.hidden` class to any elements that you want to hide from all
 63 | presentations, including screen readers. It could be an element that will be
 64 | populated later with JavaScript or an element you will hide with JavaScript. Do
 65 | not use this for SEO keyword stuffing. That is just not cool.
 66 | 
 67 | #### `.visuallyhidden`
 68 | 
 69 | Add the `.visuallyhidden` class to hide text from browsers but make it
 70 | available for screen readers. You can use this to hide text that is specific to
 71 | screen readers but that other users should not see. [About invisible
 72 | content](http://www.webaim.org/techniques/css/invisiblecontent/), [Hiding
 73 | content for
 74 | accessibility](http://snook.ca/archives/html_and_css/hiding-content-for-accessibility),
 75 | [HTML5 Boilerplate
 76 | issue/research](https://github.com/h5bp/html5-boilerplate/issues/194/).
 77 | 
 78 | #### `.invisible`
 79 | 
 80 | Add the `.invisible` class to any element you want to hide without affecting
 81 | layout. When you use `display: none` an element is effectively removed from the
 82 | layout. But in some cases you want the element to simply be invisible while
 83 | remaining in the flow and not affecting the positioning of surrounding
 84 | content.
 85 | 
 86 | #### `.clearfix`
 87 | 
 88 | Adding `.clearfix` to an element will ensure that it always fully contains its
 89 | floated children. There have been many variants of the clearfix hack over the
 90 | years, and there are other hacks that can also help you to contain floated
 91 | children, but the HTML5 Boilerplate currently uses the [micro
 92 | clearfix](http://nicolasgallagher.com/micro-clearfix-hack/).
 93 | 
 94 | 
 95 | ## Media Queries
 96 | 
 97 | The Mobile Boilerplate provides a default placeholder Media Query that can be used to override the primary 'mobile first' styles, providing adjustments for wider viewports (such as tablet devices). It is recommended that you adapt these Media Queries based on the content of your mobile web app, rather than mirroring the fixed dimensions of specific devices.
 98 | 
 99 | The mobile boilerplate also provides a second placeholder Media Query to help target high density screens.
100 | 


--------------------------------------------------------------------------------
/doc/extend.md:
--------------------------------------------------------------------------------
  1 | [Mobile Boilerplate homepage](http://html5boilerplate.com/mobile/) | [Documentation
  2 | table of contents](README.md)
  3 | 
  4 | # Extend and customise Mobile Boilerplate
  5 | 
  6 | Here is some useful advice for how you can make your project with Mobile Boilerplate even better. We don't want to include it all by default, as not everything fits with everyone's needs.
  7 | 
  8 | ## Web Server Configuration
  9 | 
 10 | ### Transcoding Prevention
 11 | 
 12 | Many mobile network operators implemented "content transcoders" or "transcoding proxies" (Vodafone and TeliaSonera are among them). These content transcoders make the desktop web available on mobile devices. One of the side effects is that, already mobile optimized portals are also reformatted, destroying a carefully designed mobile user experience.
 13 | 
 14 | The line of code below in the .htaccess file could prevent content transcoders from altering your mobile web content.
 15 | 
 16 | `Cache-Control: no-transform`
 17 | 
 18 | Read more at the articles below:
 19 | [http://mobiforge.com/developing/blog/responsible-reformatting](http://mobiforge.com/developing/blog/responsible-reformatting)
 20 | [http://mobiforge.com/developing/story/setting-http-headers-advise-transcoding-proxies](http://mobiforge.com/developing/story/setting-http-headers-advise-transcoding-proxies)
 21 | 
 22 | ### Server side redirection script
 23 | 
 24 | Server side mobile redirection script is added at the bottom of the page to detect if user is viewing from mobile device. This is taken from [detect mobile browser](http://detectmobilebrowser.com/). If the script detects the user is viewing from mobile phone, they will be redirected to the mobile version of the site.
 25 | 
 26 | Usage Instruction:
 27 | 1. This is by default commented out, so to use it, you have to uncomment the lines below.
 28 | 2. change the last line http://www.example.com/mobile to the URL of your mobile site.
 29 | 
 30 | ```apache
 31 | #RewriteEngine On
 32 | #RewriteBase /
 33 | #RewriteCond %{HTTP_USER_AGENT} android|avantgo|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|iris|kindle|lge\ |maemo|midp|mmp|opera\ m(ob|in)i|palm(\ os)?|phone|p(ixi|re)\/|plucker|pocket|psp|symbian|treo|up\.(browser|link)|vodafone|wap|windows\ (ce|phone)|xda|xiino [NC,OR]
 34 | #RewriteCond %{HTTP_USER_AGENT} ^(1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a\ wa|abac|ac(er|oo|s\-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|\-m|r\ |s\ )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw\-(n|u)|c55\/|capi|ccwa|cdm\-|cell|chtm|cldc|cmd\-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc\-s|devi|dica|dmob|do(c|p)o|ds(12|\-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(\-|_)|g1\ u|g560|gene|gf\-5|g\-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd\-(m|p|t)|hei\-|hi(pt|ta)|hp(\ i|ip)|hs\-c|ht(c(\-|\ |_|a|g|p|s|t)|tp)|hu(aw|tc)|i\-(20|go|ma)|i230|iac(\ |\-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt(\ |\/)|klon|kpt\ |kwc\-|kyo(c|k)|le(no|xi)|lg(\ g|\/(k|l|u)|50|54|e\-|e\/|\-[a-w])|libw|lynx|m1\-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m\-cr|me(di|rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(\-|\ |o|v)|zz)|mt(50|p1|v\ )|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)\-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|\-([1-8]|c))|phil|pire|pl(ay|uc)|pn\-2|po(ck|rt|se)|prox|psio|pt\-g|qa\-a|qc(07|12|21|32|60|\-[2-7]|i\-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h\-|oo|p\-)|sdk\/|se(c(\-|0|1)|47|mc|nd|ri)|sgh\-|shar|sie(\-|m)|sk\-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h\-|v\-|v\ )|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl\-|tdg\-|tel(i|m)|tim\-|t\-mo|to(pl|sh)|ts(70|m\-|m3|m5)|tx\-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|\-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(\-|\ )|webc|whit|wi(g\ |nc|nw)|wmlb|wonu|x700|xda(\-|2|g)|yas\-|your|zeto|zte\-) [NC]
 35 | # RewriteRule ^$ http://www.example.com/mobile [R,L]
 36 | ```
 37 | 
 38 | One thing to note is that if you want to allow the user on the mobile version of your site to have the option to switch to desktop version, you may consider using another method like JavaScript or PHP. There is a list of other language support you can consider using:
 39 | ASP, ASP.NET, ColdFusion, C#, IIS, JSP, JavaScript, jQuery, nginx, node.js, PHP, Perl, Python, Rails.
 40 | 
 41 | ### Mobile MIME Types
 42 | 
 43 | There are device specific MIME types made by various mobile vendors. Files with these extensions may not get rendered with the right MIME type by the server.
 44 | 
 45 | Here is a list of file extensions that are not supported by default.
 46 | 
 47 | ```apache
 48 | # Blackberry types
 49 | 
 50 | AddType application/x-bb-appworld      bbaw
 51 | AddType text/vnd.rim.location.xloc     xloc
 52 | 
 53 | # Nokia types
 54 | 
 55 | AddType application/octet-stream            sisx
 56 | AddType application/vnd.symbian.install     sis
 57 | AddType application/java-archive            jar
 58 | AddType application/x-java-archive          jar
 59 | AddType text/vnd.sun.j2me.app-descriptor    jad
 60 | ```
 61 | 
 62 | * [Apache configuration for mobile application download](https://bit.ly/SJJCND)
 63 | * [How to enable OTA (Over The Air) SIS install from your website](https://bit.ly/ORTLLA)
 64 | 
 65 | ## DNS prefetching
 66 | 
 67 | In short, DNS Prefetching is a method of informing the browser of domain names
 68 | referenced on a site so that the client can resolve the DNS for those hosts,
 69 | cache them, and when it comes time to use them, have a faster turn around on
 70 | the request.
 71 | 
 72 | ### Implicit prefetches
 73 | 
 74 | There is a lot of prefetching done for you automatically by the browser. When
 75 | the browser encounters an anchor in your html that does not share the same
 76 | domain name as the current location the browser requests, from the client OS,
 77 | the IP address for this new domain. The client first checks its cache and
 78 | then, lacking a cached copy, makes a request from a DNS server. These requests
 79 | happen in the background and are not meant to block the rendering of the
 80 | page.
 81 | 
 82 | The goal of this is that when the foreign IP address is finally needed it will
 83 | already be in the client cache and will not block the loading of the foreign
 84 | content. Less requests result in faster page load times. The perception of this
 85 | is increased on a mobile platform where DNS latency can be greater.
 86 | 
 87 | #### Disable implicit prefetching
 88 | 
 89 | ```html
 90 | <meta http-equiv="x-dns-prefetch-control" content="off">
 91 | ```
 92 | 
 93 | Even with X-DNS-Prefetch-Control meta tag (or http header) browsers will still
 94 | prefetch any explicit dns-prefetch links.
 95 | 
 96 | **_WARNING:_** THIS MAY MAKE YOUR SITE SLOWER IF YOU RELY ON RESOURCES FROM
 97 | FOREIGN DOMAINS.
 98 | 
 99 | ### Explicit prefetches
100 | 
101 | Typically the browser only scans the HTML for foreign domains. If you have
102 | resources that are outside of your HTML (a javascript request to a remote
103 | server or a CDN that hosts content that may not be present on every page of
104 | your site, for example) then you can queue up a domain name to be prefetched.
105 | 
106 | ```html
107 | <link rel="dns-prefetch" href="//example.com">
108 | <link rel="dns-prefetch" href="//ajax.googleapis.com">
109 | ```
110 | 
111 | You can use as many of these as you need, but it's best if they are all
112 | immediately after the [Meta
113 | Charset](https://developer.mozilla.org/en/HTML/Element/meta#attr-charset)
114 | element (which should go right at the top of the `head`), so the browser can
115 | act on them ASAP.
116 | 
117 | #### Common Prefetch Links
118 | 
119 | Amazon S3:
120 | 
121 | ```html
122 | <link rel="dns-prefetch" href="//s3.amazonaws.com">
123 | ```
124 | 
125 | Google APIs:
126 | 
127 | ```html
128 | <link rel="dns-prefetch" href="//ajax.googleapis.com">
129 | ```
130 | 
131 | Microsoft Ajax Content Delivery Network:
132 | 
133 | ```html
134 | <link rel="dns-prefetch" href="//ajax.microsoft.com">
135 | <link rel="dns-prefetch" href="//ajax.aspnetcdn.com">
136 | ```
137 | 
138 | ### Browser support for DNS prefetching
139 | 
140 | Chrome, Firefox 3.5+, Safari 5+, Opera (Unknown), IE 9 (called "Pre-resolution"
141 | on blogs.msdn.com)
142 | 
143 | ### Further reading about DNS prefetching
144 | 
145 | * https://developer.mozilla.org/En/Controlling_DNS_prefetching
146 | * https://dev.chromium.org/developers/design-documents/dns-prefetching
147 | * http://blogs.msdn.com/b/ie/archive/2011/03/17/internet-explorer-9-network-performance-improvements.aspx
148 | * http://dayofjs.com/videos/22158462/web-browsers_alex-russel
149 | 
150 | 
151 | ## Search
152 | 
153 | ### Direct search spiders to your sitemap
154 | 
155 | [Learn how to make a sitemap](http://www.sitemaps.org/protocol.html)
156 | 
157 | ```html
158 | <link rel="sitemap" type="application/xml" title="Sitemap" href="/sitemap.xml">
159 | ```
160 | 
161 | ### Hide pages from search engines
162 | 
163 | According to Heather Champ, former community manager at Flickr, you should not
164 | allow search engines to index your "Contact Us" or "Complaints" page if you
165 | value your sanity. This is an HTML-centric way of achieving that.
166 | 
167 | ```html
168 | <meta name="robots" content="noindex">
169 | ```
170 | 
171 | **_WARNING:_** DO NOT INCLUDE ON PAGES THAT SHOULD APPEAR IN SEARCH ENGINES.
172 | 
173 | ## URLs
174 | 
175 | ### Canonical URL
176 | 
177 | Signal to search engines and others "Use this URL for this page!" Useful when
178 | parameters after a `#` or `?` is used to control the display state of a page.
179 | `http://www.example.com/cart.html?shopping-cart-open=true` can be indexed as
180 | the cleaner, more accurate `http://www.example.com/cart.html`.
181 | 
182 | ```html
183 | <link rel="canonical" href="">
184 | ```
185 | 
186 | ### Official shortlink
187 | 
188 | Signal to the world "This is the shortened URL to use this page!" Poorly
189 | supported at this time. Learn more by reading the [article about shortlinks on
190 | the Microformats wiki](http://microformats.org/wiki/rel-shortlink).
191 | 
192 | ```html
193 | <link rel="shortlink" href="h5bp.com">
194 | ```
195 | 
196 | ## App Stores
197 | 
198 | ### Install a Chrome Web Store app
199 | 
200 | Users can install a Chrome app directly from your website, as long as the app
201 | and site have been associated via Google's Webmaster Tools. Read more on
202 | [Chrome Web Store's Inline Installation
203 | docs](https://developers.google.com/chrome/web-store/docs/inline_installation).
204 | 
205 | ```html
206 | <link rel="chrome-webstore-item" href="https://chrome.google.com/webstore/detail/APP_ID">
207 | ```
208 | 
209 | ### Smart App Banners in iOS 6 Safari
210 | 
211 | Stop bothering everyone with gross modals advertising your entry in the App Store.
212 | This bit of code will unintrusively allow the user the option to download your iOS
213 | app, or open it with some data about the user's current state on the website.
214 | 
215 | ```html
216 | <meta name="apple-itunes-app" content="app-id=APP_ID,app-argument=SOME_TEXT">
217 | ```
218 | 
219 | ## Google Analytics augments
220 | 
221 | ### Google Analytics For Mobile
222 | 
223 | Low-end mobile devices may not support JavaScript, same as email tracking, to tackle this issue, Google use image download as a tracker.
224 | 
225 | All the same data that you've come to expect from your Google Analytics reports is now available for mobile websites. Simply paste their server-side code snippets (available for PHP, JSP, ASP.NET, and Perl) on each page you wish to track. Google Analytics then creates a profile for your mobile website where you can view the same kind of information that's in standard Analytics reports including visitor information and traffic sources. You'll be able to track users visiting your mobile website from both high-end "smartphones" and WAP devices. For more information on tracking hits to mobile sites, see the [server-side developer's guide](https://code.google.com/mobile/analytics/docs/web/).
226 | 
227 | ### More tracking settings
228 | 
229 | The [optimized Google Analytics
230 | snippet](https://mathiasbynens.be/notes/async-analytics-snippet) included with
231 | Mobile Boilerplate includes something like this:
232 | 
233 | ```js
234 | var _gaq = [['_setAccount', 'UA-XXXXX-X'], ['_trackPageview']];
235 | ```
236 | 
237 | In case you need more settings, just extend the array literal instead of
238 | [`.push()`ing to the
239 | array](https://mathiasbynens.be/notes/async-analytics-snippet#dont-push-it)
240 | afterwards:
241 | 
242 | ```js
243 | var _gaq = [['_setAccount', 'UA-XXXXX-X'], ['_trackPageview'], ['_setAllowAnchor', true]];
244 | ```
245 | 
246 | ### Anonymize IP addresses
247 | 
248 | In some countries, no personal data may be transferred outside jurisdictions
249 | that do not have similarly strict laws (i.e. from Germany to outside the EU).
250 | Thus a webmaster using the Google Analytics script may have to ensure that no
251 | personal (trackable) data is transferred to the US. You can do that with [the
252 | `_gat.anonymizeIp`
253 | option](https://developers.google.com/analytics/devguides/collection/analyticsjs/advanced#anonymizeip).
254 | In use it looks like this:
255 | 
256 | ```js
257 | var _gaq = [['_setAccount', 'UA-XXXXX-X'], ['_gat._anonymizeIp'], ['_trackPageview']];
258 | ```
259 | 
260 | ### Track jQuery AJAX requests in Google Analytics
261 | 
262 | An article by @JangoSteve explains how to [track jQuery AJAX requests in Google
263 | Analytics](http://www.alfajango.com/blog/track-jquery-ajax-requests-in-google-analytics/).
264 | 
265 | Add this to `plugins.js`:
266 | 
267 | ```js
268 | /*
269 |  * Log all jQuery AJAX requests to Google Analytics
270 |  * See: http://www.alfajango.com/blog/track-jquery-ajax-requests-in-google-analytics/
271 |  */
272 | if (typeof _gaq !== "undefined" && _gaq !== null) {
273 |     $(document).ajaxSend(function(event, xhr, settings){
274 |         _gaq.push(['_trackPageview', settings.url]);
275 |     });
276 | }
277 | ```
278 | 
279 | ### Track JavaScript errors in Google Analytics
280 | 
281 | Add this function after `_gaq` is defined:
282 | 
283 | ```js
284 | (function(window){
285 |     var undefined,
286 |         link = function (href) {
287 |             var a = window.document.createElement('a');
288 |             a.href = href;
289 |             return a;
290 |         };
291 |     window.onerror = function (message, file, row) {
292 |         var host = link(file).hostname;
293 |         _gaq.push([
294 |             '_trackEvent',
295 |             (host == window.location.hostname || host == undefined || host == '' ? '' : 'external ') + 'error',
296 |             message, file + ' LINE: ' + row, undefined, undefined, true
297 |         ]);
298 |     };
299 | }(window));
300 | ```
301 | 
302 | ### Track page scroll
303 | 
304 | Add this function after `_gaq` is defined:
305 | 
306 | ```js
307 | $(function(){
308 |     var isDuplicateScrollEvent,
309 |         scrollTimeStart = new Date,
310 |         $window = $(window),
311 |         $document = $(document),
312 |         scrollPercent;
313 | 
314 |     $window.scroll(function() {
315 |         scrollPercent = Math.round(100 * ($window.height() + $window.scrollTop())/$document.height());
316 |         if (scrollPercent > 90 && !isDuplicateScrollEvent) { //page scrolled to 90%
317 |             isDuplicateScrollEvent = 1;
318 |             _gaq.push(['_trackEvent', 'scroll',
319 |                 'Window: ' + $window.height() + 'px; Document: ' + $document.height() + 'px; Time: ' + Math.round((new Date - scrollTimeStart )/1000,1) + 's',
320 |                 undefined, undefined, true
321 |             ]);
322 |         }
323 |     });
324 | });
325 | ```
326 | 
327 | ### Add to home screen plugins for mobile web app installation
328 | 
329 | There are various JS plugins available to help facilitate installing mobile web apps
330 | to the home screen.
331 | 
332 |  * [Mobile Bookmark Bubble](https://code.google.com/p/mobile-bookmark-bubble/) (Mobile Safari only).
333 |  * [Add to Home Screen](https://github.com/cubiq/add-to-homescreen) (Mobile Safari only).
334 |  * [jQuery Mobile Bookmark Bubble](https://github.com/okamototk/jqm-mobile-bookmark-bubble) (Mobile Safari, Android, BlackBerry).
335 |  * [Concierge](https://github.com/alexgibson/concierge) (Firefox OS, Firefox for Android).
336 | 
337 | ## Theme Color
338 | 
339 | You can add the [`theme-color` meta extension](https://github.com/whatwg/meta-theme-color)
340 | in the `<head>` of your pages to suggest the color that browsers and
341 | OSes should use if they customize the display of individual pages in
342 | their UIs with varying colors.
343 | 
344 | ```html
345 | <meta name="theme-color" content="#ff69b4">
346 | ```
347 | 
348 | The `content` attribute extension can take any valid CSS color.
349 | 
350 | Currently, the `theme-color` meta extension is supported by [Chrome 39+
351 | for Android Lollipop](http://updates.html5rocks.com/2014/11/Support-for-theme-color-in-Chrome-39-for-Android)
352 | and [Firefox OS 2.1+](https://twitter.com/ahmednefzaoui/status/492344698493997057).
353 | 
354 | ## Miscellaneous
355 | 
356 | * Use [HTML5
357 |   polyfills](https://github.com/Modernizr/Modernizr/wiki/HTML5-Cross-browser-Polyfills).
358 | 
359 | * If you're building a web app you may want [native style momentum scrolling in
360 |   iOS5](http://www.johanbrook.com/articles/native-style-momentum-scrolling-to-arrive-in-ios-5/) using
361 |   `-webkit-overflow-scrolling: touch`.
362 | 
363 | * Automatic telephone number detection prevention for iOS and Android using
364 |   `<meta name="format-detection" content="telephone=no">`.
365 |   [Safari HTML Reference Supported Meta Tags](https://developer.apple.com/library/safari/documentation/appleapplications/reference/SafariHTMLRef/Articles/MetaTags.html)
366 | 
367 | * Avoid development/stage websites "leaking" into SERPs (search engine results
368 |   page) by [implementing X-Robots-tag
369 |   headers](https://github.com/h5bp/html5-boilerplate/issues/804).
370 | 
371 | * Screen readers currently have less-than-stellar support for HTML5 but the JS
372 |   script [accessifyhtml5.js](https://github.com/yatil/accessifyhtml5.js) can
373 |   help increase accessibility by adding ARIA roles to HTML5 elements.
374 | 
375 | 
376 | *Many thanks to [Brian Blakely](https://github.com/brianblakely) for
377 | contributing much of this information.*
378 | 


--------------------------------------------------------------------------------
/doc/faq.md:
--------------------------------------------------------------------------------
 1 | [Mobile Boilerplate homepage](http://html5boilerplate.com/mobile/) | [Documentation
 2 | table of contents](README.md)
 3 | 
 4 | # Frequently asked questions
 5 | 
 6 | 
 7 | ### Why is the Google Analytics code at the bottom? Google recommends it be placed in the `head`.
 8 | 
 9 | The advantage to placing it in the `head` is that you will track a user's
10 | pageview even if they leave the page before it has been fully loaded. However,
11 | putting the code at the bottom keeps all the scripts together and reinforces
12 | that scripts at the bottom are the right move.
13 | 
14 | 
15 | ### Do I need to upgrade my sites each time a new version of Mobile Boilerplate is released?
16 | 
17 | No. You don't normally replace the foundations of a house once it has been
18 | built. There is nothing stopping you from trying to work in the latest changes
19 | but you'll have to assess the costs/benefits of doing so.
20 | 
21 | 
22 | ### Where can I get help for support questions?
23 | 
24 | Please ask for help on
25 | [StackOverflow](https://stackoverflow.com/questions/tagged/html5boilerplate).
26 | 


--------------------------------------------------------------------------------
/doc/html.md:
--------------------------------------------------------------------------------
  1 | [Mobile Boilerplate homepage](http://html5boilerplate.com/mobile/) | [Documentation
  2 | table of contents](README.md)
  3 | 
  4 | # The HTML
  5 | 
  6 | 
  7 | ## The `no-js` class
  8 | 
  9 | Allows you to more easily explicitly add custom styles when JavaScript is
 10 | disabled (`no-js`) or enabled (`js`). More here: [Avoiding the
 11 | FOUC](http://paulirish.com/2009/avoiding-the-fouc-v3/).
 12 | 
 13 | 
 14 | ## The order of meta tags, and `<title>`
 15 | 
 16 | As recommended by [the HTML5
 17 | spec](https://html.spec.whatwg.org/multipage/semantics.html#charset)
 18 | (4.2.5.5 Specifying the document's character encoding), add your charset
 19 | declaration early (before any ASCII art ;) to avoid a potential
 20 | [encoding-related security
 21 | issue](https://code.google.com/p/doctype-mirror/wiki/ArticleUtf7) in IE. It
 22 | should come in the first [1024
 23 | bytes](https://html.spec.whatwg.org/multipage/semantics.html#charset1024).
 24 | 
 25 | The charset should also come before the `<title>` tag, due to [potential XSS
 26 | vectors](https://code.google.com/p/doctype-mirror/wiki/ArticleUtf7).
 27 | 
 28 | The meta tag for compatibility mode [needs to be before all elements except
 29 | title and meta](http://h5bp.com/f "Defining Document Compatibility - MSDN").
 30 | And that same meta tag can only be invoked for Google Chrome Frame if it is
 31 | within the [first 1024
 32 | bytes](https://code.google.com/p/chromium/issues/detail?id=23003).
 33 | 
 34 | ## Mobile viewport
 35 | 
 36 | ```html
 37 | <meta name="HandheldFriendly" content="True">
 38 | ```
 39 | 
 40 | The `HandheldFriendly` meta-tag was used initially by older Palm and Blackberry models as well as browsers like AvantGo.
 41 | 
 42 | ```html
 43 | <meta name="MobileOptimized" content="320"/>
 44 | ```
 45 | 
 46 | Microsoft introduced the `MobileOptimized` tag for the PocketPC.
 47 | 
 48 | ```html
 49 | <meta name="viewport" content="width=device-width">
 50 | ```
 51 | 
 52 | This is more widely supported by modern smartphones, including but not limited to: iOS, Android, Palm Pre, Blackberry, Windows Phone 7.
 53 | 
 54 | There are a few different options that you can use with the [`viewport` meta
 55 | tag](https://docs.google.com/present/view?id=dkx3qtm_22dxsrgcf4 "Viewport and
 56 | Media Queries - The Complete Idiot's Guide"). You can find out more in [the
 57 | Apple developer docs](http://j.mp/mobileviewport). HTML5 Mobile Boilerplate comes with
 58 | a simple setup that strikes a good balance for general use cases.
 59 | 
 60 | ## Touch Icons
 61 | 
 62 | Touch Icons can be seen as the favicons of mobile devices and tablets.
 63 | 
 64 | ```html
 65 | <link rel="apple-touch-icon-precomposed" href="apple-touch-icon-precomposed.png">
 66 | ```
 67 | 
 68 | The main sizes of the icons for IOS are:
 69 | 
 70 | * `57×57px` – iPhone with @1x display and iPod Touch, Android stock browser
 71 | * `72×72px` – iPad and iPad mini with @1x display running iOS ≤ 6
 72 | * `76×76px` – iPad and iPad mini with @1x display running iOS ≥ 7
 73 | * `114×114px` – iPhone with @2x display running iOS ≤ 6
 74 | * `120×120px` – iPhone with @2x and @3x display running iOS ≥ 7
 75 | * `144×144px` – iPad and iPad mini with @2x display running iOS ≤ 6
 76 | * `152×152px` – iPad and iPad mini with @2x display running iOS 7
 77 | * `180×180px` – iPad and iPad mini with @2x display running iOS 8
 78 | 
 79 | Displays meaning:
 80 | 
 81 | * @1x - non-Retina
 82 | * @2x - Retina
 83 | * @3x - Retina HD
 84 | 
 85 | More information about the displays of iOS devices can be found
 86 | [here](https://en.wikipedia.org/wiki/List_of_iOS_devices#Display).
 87 | 
 88 | Also, there are `192x192px` and `128x128px` icons included for Chrome 31+.
 89 | 
 90 | For a more comprehensive overview, please refer to Mathias' [article on Touch
 91 | Icons](https://mathiasbynens.be/notes/touch-icons).
 92 | 
 93 | ## Mobile Internet Explorer ClearType Technology
 94 | 
 95 | ```html
 96 | <meta http-equiv="cleartype" content="on">
 97 | ```
 98 | 
 99 | Mobile Internet Explorer allows us to activate [ClearType](https://www.microsoft.com/typography/whatiscleartype.mspx) technology for smoothing fonts for easy reading
100 | 
101 | ## iOS web app
102 | 
103 | ```html
104 | <meta name="apple-mobile-web-app-capable" content="yes">
105 | ```
106 | 
107 | Makes the web page run in full screen mode when launched from the home screen icon; also hides the address bar and component bar at the top and bottom of the browser.
108 | 
109 | ```html
110 | <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
111 | ```
112 | 
113 | Styles the bar at the top of the browser
114 | 
115 | ## Canonical link to the desktop version for SEO
116 | 
117 | ```html
118 | <link rel="canonical" href="http://www.example.com/" >
119 | ```
120 | 
121 | Websites with separate URLs for desktop and mobile websites need to have a canonical link on mobile site pointing back to the desktop version for SEO. More information on [Google Webmaster Docs](https://developers.google.com/webmasters/smartphone-sites/details#separateurls).
122 | 
123 | ## More tags for your 'head'
124 | 
125 | ```html
126 | <!-- more tags for your 'head' to consider https://gist.github.com/849231 -->
127 | ```
128 | 
129 | Other tags that can be used in the head section
130 | 
131 | ## Modernizr
132 | 
133 | HTML5 Mobile Boilerplate uses a custom build of Modernizr.
134 | 
135 | [Modernizr](http://modernizr.com) is a JavaScript library which adds classes to
136 | the `html` element based on the results of feature test and which ensures that
137 | all browsers can make use of HTML5 elements (as it includes the HTML5 Shiv).
138 | This allows you to target parts of your CSS and JavaScript based on the
139 | features supported by a browser.
140 | 
141 | In general, in order to keep page load times to a minimum, it's best to call
142 | any JavaScript at the end of the page because if a script is slow to load
143 | from an external server it may cause the whole page to hang. That said, the
144 | Modernizr script *needs* to run *before* the browser begins rendering the page,
145 | so that browsers lacking support for some of the new HTML5 elements are able to
146 | handle them properly. Therefore the Modernizr script is the only JavaScript
147 | file synchronously loaded at the top of the document.
148 | 
149 | 
150 | ## The content area
151 | 
152 | The central part of the boilerplate template is pretty much empty. This is
153 | intentional, in order to make the boilerplate suitable for both web page and
154 | web app development.
155 | 
156 | ## jQuery
157 | 
158 | HTML5 Mobile Boilerplate comes with the latest version of [jQuery](https://jquery.com).
159 | 
160 | ## Google Analytics Tracking Code
161 | 
162 | Finally, an optimized version of the latest Google Analytics tracking code is
163 | included. Google recommends that this script be placed at the top of the page.
164 | Factors to consider: if you place this script at the top of the page, you’ll be
165 | able to count users who don’t fully load the page, and you’ll incur the max
166 | number of simultaneous connections of the browser.
167 | 
168 | Further information:
169 | 
170 | * [Optimizing the asynchronous Google Analytics
171 |   snippet](https://mathiasbynens.be/notes/async-analytics-snippet).
172 | * [Tracking Site Activity - Google
173 |   Analytics](https://developers.google.com/analytics/devguides/collection/gajs/asyncTracking).
174 | 


--------------------------------------------------------------------------------
/doc/js.md:
--------------------------------------------------------------------------------
  1 | [HTML5 Mobile Boilerplate homepage](http://html5boilerplate.com/mobile) | [Documentation
  2 | table of contents](README.md)
  3 | 
  4 | # The JavaScript
  5 | 
  6 | Information about the default JavaScript included in the project.
  7 | 
  8 | ## helper.js
  9 | 
 10 | A JavaScript helper file is included in the boilerplate with namespace MBP. It contains a selection of kick-ass functions that help you to improve mobile user experience.
 11 | 
 12 | ### iPhone Scale Bug Fix
 13 | 
 14 | `MBP.scaleFix` is used to fix the iPhone reflow scale bug, read more about it here: [a fix for iphone viewport scale bug](http://www.blog.highub.com/mobile-2/a-fix-for-iphone-viewport-scale-bug/)
 15 | 
 16 | Usage: 
 17 | 
 18 | ```
 19 | MBP.scaleFix();
 20 | ```
 21 | 
 22 | ### Hide URL Bar
 23 | 
 24 | `MBP.hideUrlBarOnLoad` is used to hide the URL bar at the top of mobile Safari on your iOS. Mobile space is limited and this helps to leverage every pixel on the screen to maximize display area.
 25 | 
 26 | Usage:
 27 | 
 28 | ``` 
 29 | MBP.hideUrlBarOnLoad();
 30 | ```
 31 | 
 32 | ### Fast Buttons (only use this if you only target webkit browsers, we are still testing out cross-browser support)
 33 | 
 34 | `MBP.fastButton` is used to make instant responsive buttons, 300ms faster to be exact. (It uses `touchstart` to detect click event.) 
 35 | 
 36 | Usage:
 37 | 
 38 | ```
 39 | new MBP.fastButton(document.getElementById('myBtn'), function() {alert("clicked")});
 40 | ```
 41 | 
 42 | ### Autogrow textarea
 43 | 
 44 | `MBP.autogrow` is used to make textarea to grow its height while you are entering more lines of text.
 45 | 
 46 | Usage:
 47 | 
 48 | ``` 
 49 | new MBP.autogrow(document.getElementById('myTextarea'), 14); // 14 -- line height
 50 | ```
 51 | 
 52 | ### Enable CSS active pseudo styles
 53 | 
 54 | A hack to enable CSS active pseudo styles in iOS Safari and various other webkit based mobile browsers.
 55 | 
 56 | Usage:
 57 | 
 58 | ```
 59 | MBP.enableActive();
 60 | ```
 61 | 
 62 | ### Prevent default scrolling on document window
 63 | 
 64 | Prevent default scrolling on the main document window.
 65 | 
 66 | Usage:
 67 | 
 68 | ```
 69 | MBP.preventScrolling();
 70 | ```
 71 | 
 72 | ### Prevent iOS from zooming onfocus
 73 | 
 74 | Prevent iOS Safari from zooming the viewport when form inputs receive focus.
 75 | 
 76 | Usage:
 77 | 
 78 | ```
 79 |  MBP.preventZoom();
 80 | ```
 81 | 
 82 | ### iOS Startup Image helper
 83 | 
 84 | `MBP.startupImage` is used to insert iOS startup image meta tags into the document head. The method will insert the correct type of startup image(s) required by a particular iOS device, including iPhone and iPad in both Retina and non-Retina resolutions.
 85 | 
 86 | Usage:
 87 | 
 88 | ```
 89 | MBP.startupImage();
 90 | ```
 91 | 
 92 | ## main.js
 93 | 
 94 | This file can be used to contain or reference your site/app JavaScript code.
 95 | For larger projects, you can make use of a JavaScript module loader, like
 96 | [Require.js](http://requirejs.org/), to load any other scripts you need to
 97 | run.
 98 | 
 99 | ## plugins.js
100 | 
101 | This file can be used to contain all your plugins, such as jQuery plugins and other 3rd party scripts.
102 | 
103 | One approach is to put jQuery plugins inside of a `(function($){ ... })(window.jQuery);` closure to make sure they're in the jQuery namespace safety blanket.
104 | 
105 | By default the `plugins.js` file contains a small script to avoid `console`
106 | errors in browsers that lack a `console`. The script will make sure that, if
107 | a console method isn't available, that method will have the value of empty
108 | function, thus, preventing the browser from throwing an error.
109 | 
110 | ## vendor
111 | 
112 | This directory can be used to contain all 3rd party library code.
113 | 
114 | Minified versions of the latest jQuery and Modernizr libraries are included by
115 | default. You may wish to create your own [custom Modernizr
116 | build](http://www.modernizr.com/download/).
117 | 


--------------------------------------------------------------------------------
/doc/misc.md:
--------------------------------------------------------------------------------
 1 | [Mobile Boilerplate homepage](http://html5boilerplate.com/mobile/) | [Documentation table of contents](README.md)
 2 | 
 3 | # Miscellaneous
 4 | 
 5 | ## .gitignore
 6 | 
 7 | Mobile Boilerplate includes a basic project-level `.gitignore`. This should
 8 | primarily be used to avoid certain project-level files and directories from
 9 | being kept under source control. Different development-environments will
10 | benefit from different collections of ignores.
11 | 
12 | OS-specific and editor-specific files should be ignored using a "global
13 | ignore" that applies to all repositories on your system.
14 | 
15 | For example, add the following to your `~/.gitconfig`, where the `.gitignore`
16 | in your HOME directory contains the files and directories you'd like to
17 | globally ignore:
18 | 
19 | ```gitignore
20 | [core]
21 |     excludesfile = ~/.gitignore
22 | ```
23 | 
24 | * More on global ignores: https://help.github.com/articles/ignoring-files
25 | * Comprehensive set of ignores on GitHub: https://github.com/github/gitignore
26 | 
27 | ## robots.txt
28 | 
29 | The `robots.txt` file is used to give instructions to web robots on what can
30 | be crawled from the website.
31 | 
32 | By default, the file provided by this project includes the next two lines:
33 | 
34 |  * `User-agent: *` -  the following rules apply to all web robots
35 |  * `Disallow:` - everything on the website is allowed to be crawled
36 | 
37 | If you want to disallow certain pages you will need to specify the path in a
38 | `Disallow` directive (e.g.: `Disallow: /path`) or, if you want to disallow
39 | crawling of all content, use `Disallow: /`.
40 | 
41 | The `/robots.txt` file is not intended for access control, so don't try to
42 | use it as such. Think of it as a "No Entry" sign, rather than a locked door.
43 | URLs disallowed by the `robots.txt` file might still be indexed without being
44 | crawled, and the content from within the `robots.txt` file can be viewed by
45 | anyone, potentially disclosing the location of your private content! So, if
46 | you want to block access to private content, use proper authentication instead.
47 | 
48 | For more information about `robots.txt`, please see:
49 | 
50 |   * [robotstxt.org](http://www.robotstxt.org/)
51 |   * [How Google handles the `robots.txt` file](https://developers.google.com/webmasters/control-crawl-index/docs/robots_txt)


--------------------------------------------------------------------------------
/doc/usage.md:
--------------------------------------------------------------------------------
  1 | [Mobile Boilerplate homepage](http://html5boilerplate.com/mobile/) | [Documentation
  2 | table of contents](README.md)
  3 | 
  4 | # Usage
  5 | 
  6 | Once you have cloned or downloaded Mobile Boilerplate, creating a site or app
  7 | usually involves the following:
  8 | 
  9 | 1. Set up the basic structure of the site.
 10 | 2. Add some content, style, and functionality.
 11 | 3. Run your site locally to see how it looks.
 12 | 4. (Optionally run a build script to automate the optimization of your site -
 13 |    e.g. [ant build script](https://github.com/h5bp/ant-build-script)).
 14 | 5. Deploy your site.
 15 | 
 16 | 
 17 | ## Basic structure
 18 | 
 19 | A basic Mobile Boilerplate site initially looks something like this:
 20 | 
 21 | ```
 22 | .
 23 | ├── css
 24 | │   ├── main.css
 25 | │   └── normalize.css
 26 | ├── doc
 27 | ├── img
 28 | │   ├── startup
 29 | │   │   └── [apple-startup-images]
 30 | │   └── touch
 31 | │       └── [mobile-touch-icons]
 32 | ├── js
 33 | │   ├── helper.js
 34 | │   ├── main.js
 35 | │   ├── plugins.js
 36 | │   └── vendor
 37 | │       ├── modernizr-2.8.3.min.js
 38 | │       └── jquery-2.1.3.min.js
 39 | ├── .htaccess
 40 | ├── 404.html
 41 | ├── index.html
 42 | ├── humans.txt
 43 | ├── robots.txt
 44 | ├── manifest.webapp
 45 | ├── crossdomain.xml
 46 | └── favicon.ico
 47 | ```
 48 | 
 49 | What follows is a general overview of each major part and how to use them.
 50 | 
 51 | ### css
 52 | 
 53 | This directory should contain all your project's CSS files. It includes some
 54 | initial CSS to help get you started from a solid foundation. [About the
 55 | CSS](css.md).
 56 | 
 57 | ### doc
 58 | 
 59 | This directory contains all the Mobile Boilerplate documentation. You can use it
 60 | as the location and basis for your own project's documentation.
 61 | 
 62 | ### js
 63 | 
 64 | This directory should contain all your project's JS files. Libraries, plugins,
 65 | and custom code can all be included here. It includes some initial JS to help
 66 | get you started. [About the JavaScript](js.md).
 67 | 
 68 | ### .htaccess
 69 | 
 70 | The default web server configs are for Apache. For more information, please
 71 | refer to the [Apache Server Configs
 72 | repository](https://github.com/h5bp/server-configs-apache).
 73 | 
 74 | Host your site on a server other than Apache? You're likely to find the
 75 | corresponding server configs project listed in our [Server Configs
 76 | ](https://github.com/h5bp/server-configs/blob/master/README.md) repository.
 77 | 
 78 | ### 404.html
 79 | 
 80 | A helpful custom 404 to get you started.
 81 | 
 82 | ### index.html
 83 | 
 84 | This is the default HTML skeleton that should form the basis of all pages on
 85 | your site. If you are using a server-side templating framework, then you will
 86 | need to integrate this starting HTML with your setup.
 87 | 
 88 | Make sure that you update the URLs for the referenced CSS and JavaScript if you
 89 | modify the directory structure at all.
 90 | 
 91 | If you are using Google Analytics, make sure that you edit the corresponding snippet at the bottom to include your analytics ID.
 92 | 
 93 | ### humans.txt
 94 | 
 95 | Edit this file to include the team that worked on your site/app, and the
 96 | technology powering it.
 97 | 
 98 | ### robots.txt
 99 | 
100 | Edit this file to include any pages you need hidden from search engines.
101 | 
102 | ### manifest.webapp
103 | 
104 | Edit this [manifest](https://developer.mozilla.org/Apps/Developing/Manifest) file to include information about your mobile web app
105 | if you would like to add [Open Web App](https://developer.mozilla.org/Apps) support for Firefox OS devices
106 | as well as Firefox for Android.
107 | 
108 | ### crossdomain.xml
109 | 
110 | A template for working with cross-domain requests. [About
111 | crossdomain.xml](crossdomain.md).
112 | 
113 | ### icons and startup images
114 | 
115 | Replace the default `favicon.ico`, apple touch icons and startup images with your own. You
116 | might want to check out Hans Christian's handy [HTML5 Boilerplate Favicon and
117 | Apple Touch Icon
118 | PSD-Template](https://drublic.de/blog/html5-boilerplate-favicons-psd-template/).
119 | 


--------------------------------------------------------------------------------
/favicon.ico:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/h5bp/mobile-boilerplate/78c876e065d90fa87eb55b04b7c127769d66dc54/favicon.ico


--------------------------------------------------------------------------------
/humans.txt:
--------------------------------------------------------------------------------
 1 | # humanstxt.org/
 2 | # The humans responsible & technology colophon
 3 | 
 4 | # TEAM
 5 | 
 6 |     <name> -- <role> -- <twitter>
 7 | 
 8 | # THANKS
 9 | 
10 |     <name>
11 | 
12 | # TECHNOLOGY COLOPHON
13 | 
14 |     CSS3, HTML5
15 |     Apache Server Configs, jQuery, Modernizr, Normalize.css
16 | 


--------------------------------------------------------------------------------
/img/startup/startup-retina-4in.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/h5bp/mobile-boilerplate/78c876e065d90fa87eb55b04b7c127769d66dc54/img/startup/startup-retina-4in.png


--------------------------------------------------------------------------------
/img/startup/startup-retina.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/h5bp/mobile-boilerplate/78c876e065d90fa87eb55b04b7c127769d66dc54/img/startup/startup-retina.png


--------------------------------------------------------------------------------
/img/startup/startup-tablet-landscape-retina.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/h5bp/mobile-boilerplate/78c876e065d90fa87eb55b04b7c127769d66dc54/img/startup/startup-tablet-landscape-retina.png


--------------------------------------------------------------------------------
/img/startup/startup-tablet-landscape.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/h5bp/mobile-boilerplate/78c876e065d90fa87eb55b04b7c127769d66dc54/img/startup/startup-tablet-landscape.png


--------------------------------------------------------------------------------
/img/startup/startup-tablet-portrait-retina.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/h5bp/mobile-boilerplate/78c876e065d90fa87eb55b04b7c127769d66dc54/img/startup/startup-tablet-portrait-retina.png


--------------------------------------------------------------------------------
/img/startup/startup-tablet-portrait.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/h5bp/mobile-boilerplate/78c876e065d90fa87eb55b04b7c127769d66dc54/img/startup/startup-tablet-portrait.png


--------------------------------------------------------------------------------
/img/startup/startup.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/h5bp/mobile-boilerplate/78c876e065d90fa87eb55b04b7c127769d66dc54/img/startup/startup.png


--------------------------------------------------------------------------------
/img/touch/apple-touch-icon-114x114-precomposed.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/h5bp/mobile-boilerplate/78c876e065d90fa87eb55b04b7c127769d66dc54/img/touch/apple-touch-icon-114x114-precomposed.png


--------------------------------------------------------------------------------
/img/touch/apple-touch-icon-120x120-precomposed.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/h5bp/mobile-boilerplate/78c876e065d90fa87eb55b04b7c127769d66dc54/img/touch/apple-touch-icon-120x120-precomposed.png


--------------------------------------------------------------------------------
/img/touch/apple-touch-icon-144x144-precomposed.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/h5bp/mobile-boilerplate/78c876e065d90fa87eb55b04b7c127769d66dc54/img/touch/apple-touch-icon-144x144-precomposed.png


--------------------------------------------------------------------------------
/img/touch/apple-touch-icon-152x152-precomposed.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/h5bp/mobile-boilerplate/78c876e065d90fa87eb55b04b7c127769d66dc54/img/touch/apple-touch-icon-152x152-precomposed.png


--------------------------------------------------------------------------------
/img/touch/apple-touch-icon-180x180-precomposed.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/h5bp/mobile-boilerplate/78c876e065d90fa87eb55b04b7c127769d66dc54/img/touch/apple-touch-icon-180x180-precomposed.png


--------------------------------------------------------------------------------
/img/touch/apple-touch-icon-57x57-precomposed.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/h5bp/mobile-boilerplate/78c876e065d90fa87eb55b04b7c127769d66dc54/img/touch/apple-touch-icon-57x57-precomposed.png


--------------------------------------------------------------------------------
/img/touch/apple-touch-icon-72x72-precomposed.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/h5bp/mobile-boilerplate/78c876e065d90fa87eb55b04b7c127769d66dc54/img/touch/apple-touch-icon-72x72-precomposed.png


--------------------------------------------------------------------------------
/img/touch/apple-touch-icon-76x76-precomposed.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/h5bp/mobile-boilerplate/78c876e065d90fa87eb55b04b7c127769d66dc54/img/touch/apple-touch-icon-76x76-precomposed.png


--------------------------------------------------------------------------------
/img/touch/apple-touch-icon.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/h5bp/mobile-boilerplate/78c876e065d90fa87eb55b04b7c127769d66dc54/img/touch/apple-touch-icon.png


--------------------------------------------------------------------------------
/img/touch/touch-icon-128x128.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/h5bp/mobile-boilerplate/78c876e065d90fa87eb55b04b7c127769d66dc54/img/touch/touch-icon-128x128.png


--------------------------------------------------------------------------------
/img/touch/touch-icon-192x192.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/h5bp/mobile-boilerplate/78c876e065d90fa87eb55b04b7c127769d66dc54/img/touch/touch-icon-192x192.png


--------------------------------------------------------------------------------
/index.html:
--------------------------------------------------------------------------------
 1 | <!doctype html>
 2 | <html class="no-js" lang="">
 3 |     <head>
 4 |         <meta charset="utf-8">
 5 |         <title></title>
 6 |         <meta name="description" content="">
 7 |         <meta name="HandheldFriendly" content="True">
 8 |         <meta name="MobileOptimized" content="320">
 9 |         <meta name="viewport" content="width=device-width, initial-scale=1">
10 |         <meta http-equiv="cleartype" content="on">
11 | 
12 |         <!-- iPad and iPad mini (with @2× display) iOS ≥ 8 -->
13 |         <link rel="apple-touch-icon-precomposed" sizes="180x180" href="img/touch/apple-touch-icon-180x180-precomposed.png">
14 |         <!-- iPad 3+ (with @2× display) iOS ≥ 7 -->
15 |         <link rel="apple-touch-icon-precomposed" sizes="152x152" href="img/touch/apple-touch-icon-152x152-precomposed.png">
16 |         <!-- iPad (with @2× display) iOS ≤ 6 -->
17 |         <link rel="apple-touch-icon-precomposed" sizes="144x144" href="img/touch/apple-touch-icon-144x144-precomposed.png">
18 |         <!-- iPhone (with @2× and @3 display) iOS ≥ 7 -->
19 |         <link rel="apple-touch-icon-precomposed" sizes="120x120" href="img/touch/apple-touch-icon-120x120-precomposed.png">
20 |         <!-- iPhone (with @2× display) iOS ≤ 6 -->
21 |         <link rel="apple-touch-icon-precomposed" sizes="114x114" href="img/touch/apple-touch-icon-114x114-precomposed.png">
22 |         <!-- iPad mini and the first- and second-generation iPad (@1× display) on iOS ≥ 7 -->
23 |         <link rel="apple-touch-icon-precomposed" sizes="76x76" href="img/touch/apple-touch-icon-76x76-precomposed.png">
24 |         <!-- iPad mini and the first- and second-generation iPad (@1× display) on iOS ≤ 6 -->
25 |         <link rel="apple-touch-icon-precomposed" sizes="72x72" href="img/touch/apple-touch-icon-72x72-precomposed.png">
26 |         <!-- Android Stock Browser and non-Retina iPhone and iPod Touch -->
27 |         <link rel="apple-touch-icon-precomposed" href="img/touch/apple-touch-icon-57x57-precomposed.png">
28 |         <!-- Fallback for everything else -->
29 |         <link rel="shortcut icon" href="img/touch/apple-touch-icon.png">
30 | 
31 |         <!--
32 |             Chrome 31+ has home screen icon 192×192 (the recommended size for multiple resolutions).
33 |             If it’s not defined on that size it will take 128×128.
34 |         -->
35 |         <link rel="icon" sizes="192x192" href="img/touch/touch-icon-192x192.png">
36 |         <link rel="icon" sizes="128x128" href="img/touch/touch-icon-128x128.png">
37 | 
38 |         <!-- Tile icon for Win8 (144x144 + tile color) -->
39 |         <meta name="msapplication-TileImage" content="img/touch/apple-touch-icon-144x144-precomposed.png">
40 |         <meta name="msapplication-TileColor" content="#222222">
41 | 
42 |         <!-- SEO: If mobile URL is different from desktop URL, add a canonical link to the desktop page -->
43 |         <!--
44 |         <link rel="canonical" href="http://www.example.com/" >
45 |         -->
46 | 
47 |         <!-- Add to homescreen for Chrome on Android -->
48 |         <!--
49 |         <meta name="mobile-web-app-capable" content="yes">
50 |         -->
51 | 
52 |         <!-- For iOS web apps. Delete if not needed. https://github.com/h5bp/mobile-boilerplate/issues/94 -->
53 |         <!--
54 |         <meta name="apple-mobile-web-app-capable" content="yes">
55 |         <meta name="apple-mobile-web-app-status-bar-style" content="black">
56 |         <meta name="apple-mobile-web-app-title" content="">
57 |         -->
58 | 
59 |         <!-- This script prevents links from opening in Mobile Safari. https://gist.github.com/1042026 -->
60 |         <!--
61 |         <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>
62 |         -->
63 | 
64 |         <link rel="stylesheet" href="css/normalize.css">
65 |         <link rel="stylesheet" href="css/main.css">
66 |         <script src="js/vendor/modernizr-2.8.3.min.js"></script>
67 |     </head>
68 |     <body>
69 | 
70 |         <!-- Add your site or application content here -->
71 | 
72 |         <script src="js/vendor/jquery-2.1.3.min.js"></script>
73 |         <script src="js/helper.js"></script>
74 |         <script src="js/main.js"></script>
75 | 
76 |         <!-- Google Analytics: change UA-XXXXX-X to be your site's ID. -->
77 |         <script>
78 |             (function(b,o,i,l,e,r){b.GoogleAnalyticsObject=l;b[l]||(b[l]=
79 |             function(){(b[l].q=b[l].q||[]).push(arguments)});b[l].l=+new Date;
80 |             e=o.createElement(i);r=o.getElementsByTagName(i)[0];
81 |             e.src='//www.google-analytics.com/analytics.js';
82 |             r.parentNode.insertBefore(e,r)}(window,document,'script','ga'));
83 |             ga('create','UA-XXXXX-X');ga('send','pageview');
84 |         </script>
85 |     </body>
86 | </html>
87 | 


--------------------------------------------------------------------------------
/js/helper.js:
--------------------------------------------------------------------------------
  1 | /**
  2 |  * MBP - Mobile boilerplate helper functions
  3 |  */
  4 | 
  5 | (function(document) {
  6 | 
  7 |     window.MBP = window.MBP || {};
  8 | 
  9 |     /*globals MBP*/
 10 | 
 11 |     /**
 12 |      * Fix for iPhone viewport scale bug
 13 |      * http://www.blog.highub.com/mobile-2/a-fix-for-iphone-viewport-scale-bug/
 14 |      */
 15 | 
 16 |     MBP.viewportmeta = document.querySelector && document.querySelector('meta[name="viewport"]');
 17 |     MBP.ua = navigator.userAgent;
 18 | 
 19 |     MBP.scaleFix = function() {
 20 |         if (MBP.viewportmeta && /iPhone|iPad|iPod/.test(MBP.ua) && !/Opera Mini/.test(MBP.ua)) {
 21 |             MBP.viewportmeta.content = 'width=device-width, minimum-scale=1.0, maximum-scale=1.0';
 22 |             document.addEventListener('gesturestart', MBP.gestureStart, false);
 23 |         }
 24 |     };
 25 | 
 26 |     MBP.gestureStart = function() {
 27 |         MBP.viewportmeta.content = 'width=device-width, minimum-scale=0.25, maximum-scale=1.6';
 28 |     };
 29 | 
 30 |     /**
 31 |      * Normalized hide address bar for iOS & Android
 32 |      * (c) Scott Jehl, scottjehl.com
 33 |      * MIT License
 34 |      */
 35 | 
 36 |     // If we split this up into two functions we can reuse
 37 |     // this function if we aren't doing full page reloads.
 38 | 
 39 |     // If we cache this we don't need to re-calibrate everytime we call
 40 |     // the hide url bar
 41 |     MBP.BODY_SCROLL_TOP = false;
 42 | 
 43 |     // So we don't redefine this function everytime we
 44 |     // we call hideUrlBar
 45 |     MBP.getScrollTop = function() {
 46 |         var win = window;
 47 |         var doc = document;
 48 | 
 49 |         return win.pageYOffset || doc.compatMode === 'CSS1Compat' && doc.documentElement.scrollTop || doc.body.scrollTop || 0;
 50 |     };
 51 | 
 52 |     // It should be up to the mobile
 53 |     MBP.hideUrlBar = function() {
 54 |         var win = window;
 55 | 
 56 |         // if there is a hash, or MBP.BODY_SCROLL_TOP hasn't been set yet, wait till that happens
 57 |         if (!location.hash && MBP.BODY_SCROLL_TOP !== false) {
 58 |             win.scrollTo( 0, MBP.BODY_SCROLL_TOP === 1 ? 0 : 1 );
 59 |         }
 60 |     };
 61 | 
 62 |     MBP.hideUrlBarOnLoad = function() {
 63 |         var win = window;
 64 |         var doc = win.document;
 65 |         var bodycheck;
 66 | 
 67 |         // If there's a hash, or addEventListener is undefined, stop here
 68 |         if ( !win.navigator.standalone && !location.hash && win.addEventListener ) {
 69 | 
 70 |             // scroll to 1
 71 |             window.scrollTo( 0, 1 );
 72 |             MBP.BODY_SCROLL_TOP = 1;
 73 | 
 74 |             // reset to 0 on bodyready, if needed
 75 |             bodycheck = setInterval(function() {
 76 |                 if ( doc.body ) {
 77 |                     clearInterval( bodycheck );
 78 |                     MBP.BODY_SCROLL_TOP = MBP.getScrollTop();
 79 |                     MBP.hideUrlBar();
 80 |                 }
 81 |             }, 15 );
 82 | 
 83 |             win.addEventListener('load', function() {
 84 |                 setTimeout(function() {
 85 |                     // at load, if user hasn't scrolled more than 20 or so...
 86 |                     if (MBP.getScrollTop() < 20) {
 87 |                         // reset to hide addr bar at onload
 88 |                         MBP.hideUrlBar();
 89 |                     }
 90 |                 }, 0);
 91 |             }, false);
 92 |         }
 93 |     };
 94 | 
 95 |     /**
 96 |      * Fast Buttons - read wiki below before using
 97 |      * https://github.com/h5bp/mobile-boilerplate/wiki/JavaScript-Helper
 98 |      */
 99 | 
100 |     MBP.fastButton = function(element, handler, pressedClass) {
101 |         this.handler = handler;
102 |         // styling of .pressed is defined in the project's CSS files
103 |         this.pressedClass = typeof pressedClass === 'undefined' ? 'pressed' : pressedClass;
104 | 
105 |         MBP.listenForGhostClicks();
106 | 
107 |         if (element.length && element.length > 1) {
108 |             for (var singleElIdx in element) {
109 |                 this.addClickEvent(element[singleElIdx]);
110 |             }
111 |         } else {
112 |             this.addClickEvent(element);
113 |         }
114 |     };
115 | 
116 |     MBP.fastButton.prototype.handleEvent = function(event) {
117 |         event = event || window.event;
118 | 
119 |         switch (event.type) {
120 |             case 'touchstart': this.onTouchStart(event); break;
121 |             case 'touchmove': this.onTouchMove(event); break;
122 |             case 'touchend': this.onClick(event); break;
123 |             case 'click': this.onClick(event); break;
124 |         }
125 |     };
126 | 
127 |     MBP.fastButton.prototype.onTouchStart = function(event) {
128 |         var element = event.target || event.srcElement;
129 |         event.stopPropagation();
130 |         element.addEventListener('touchend', this, false);
131 |         document.body.addEventListener('touchmove', this, false);
132 |         this.startX = event.touches[0].clientX;
133 |         this.startY = event.touches[0].clientY;
134 | 
135 |         element.className+= ' ' + this.pressedClass;
136 |     };
137 | 
138 |     MBP.fastButton.prototype.onTouchMove = function(event) {
139 |         if (Math.abs(event.touches[0].clientX - this.startX) > 10 ||
140 |             Math.abs(event.touches[0].clientY - this.startY) > 10) {
141 |             this.reset(event);
142 |         }
143 |     };
144 | 
145 |     MBP.fastButton.prototype.onClick = function(event) {
146 |         event = event || window.event;
147 |         var element = event.target || event.srcElement;
148 |         if (event.stopPropagation) {
149 |             event.stopPropagation();
150 |         }
151 |         this.reset(event);
152 |         this.handler.apply(event.currentTarget, [event]);
153 |         if (event.type === 'touchend') {
154 |             MBP.preventGhostClick(this.startX, this.startY);
155 |         }
156 |         var pattern = new RegExp(' ?' + this.pressedClass, 'gi');
157 |         element.className = element.className.replace(pattern, '');
158 |     };
159 | 
160 |     MBP.fastButton.prototype.reset = function(event) {
161 |         var element = event.target || event.srcElement;
162 |         rmEvt(element, 'touchend', this, false);
163 |         rmEvt(document.body, 'touchmove', this, false);
164 | 
165 |         var pattern = new RegExp(' ?' + this.pressedClass, 'gi');
166 |         element.className = element.className.replace(pattern, '');
167 |     };
168 | 
169 |     MBP.fastButton.prototype.addClickEvent = function(element) {
170 |         addEvt(element, 'touchstart', this, false);
171 |         addEvt(element, 'click', this, false);
172 |     };
173 | 
174 |     MBP.preventGhostClick = function(x, y) {
175 |         MBP.coords.push(x, y);
176 |         window.setTimeout(function() {
177 |             MBP.coords.splice(0, 2);
178 |         }, 2500);
179 |     };
180 | 
181 |     MBP.ghostClickHandler = function(event) {
182 |         if (!MBP.hadTouchEvent && MBP.dodgyAndroid) {
183 |             // This is a bit of fun for Android 2.3...
184 |             // If you change window.location via fastButton, a click event will fire
185 |             // on the new page, as if the events are continuing from the previous page.
186 |             // We pick that event up here, but MBP.coords is empty, because it's a new page,
187 |             // so we don't prevent it. Here's we're assuming that click events on touch devices
188 |             // that occur without a preceding touchStart are to be ignored.
189 |             event.stopPropagation();
190 |             event.preventDefault();
191 |             return;
192 |         }
193 |         for (var i = 0, len = MBP.coords.length; i < len; i += 2) {
194 |             var x = MBP.coords[i];
195 |             var y = MBP.coords[i + 1];
196 |             if (Math.abs(event.clientX - x) < 25 && Math.abs(event.clientY - y) < 25) {
197 |                 event.stopPropagation();
198 |                 event.preventDefault();
199 |             }
200 |         }
201 |     };
202 | 
203 |     // This bug only affects touch Android 2.3 devices, but a simple ontouchstart test creates a false positive on
204 |     // some Blackberry devices. https://github.com/Modernizr/Modernizr/issues/372
205 |     // The browser sniffing is to avoid the Blackberry case. Bah
206 |     MBP.dodgyAndroid = ('ontouchstart' in window) && (navigator.userAgent.indexOf('Android 2.3') !== -1);
207 | 
208 |     MBP.listenForGhostClicks = (function() {
209 |         var alreadyRan = false;
210 | 
211 |         return function() {
212 |             if(alreadyRan) {
213 |                 return;
214 |             }
215 | 
216 |             if (document.addEventListener) {
217 |                 document.addEventListener('click', MBP.ghostClickHandler, true);
218 |             }
219 |             addEvt(document.documentElement, 'touchstart', function() {
220 |                 MBP.hadTouchEvent = true;
221 |             }, false);
222 | 
223 |             alreadyRan = true;
224 |         };
225 |     })();
226 | 
227 |     MBP.coords = [];
228 | 
229 |     // fn arg can be an object or a function, thanks to handleEvent
230 |     // read more about the explanation at: http://www.thecssninja.com/javascript/handleevent
231 |     function addEvt(el, evt, fn, bubble) {
232 |         if ('addEventListener' in el) {
233 |             // BBOS6 doesn't support handleEvent, catch and polyfill
234 |             try {
235 |                 el.addEventListener(evt, fn, bubble);
236 |             } catch(e) {
237 |                 if (typeof fn === 'object' && fn.handleEvent) {
238 |                     el.addEventListener(evt, function(e){
239 |                         // Bind fn as this and set first arg as event object
240 |                         fn.handleEvent.call(fn,e);
241 |                     }, bubble);
242 |                 } else {
243 |                     throw e;
244 |                 }
245 |             }
246 |         } else if ('attachEvent' in el) {
247 |             // check if the callback is an object and contains handleEvent
248 |             if (typeof fn === 'object' && fn.handleEvent) {
249 |                 el.attachEvent('on' + evt, function(){
250 |                     // Bind fn as this
251 |                     fn.handleEvent.call(fn);
252 |                 });
253 |             } else {
254 |                 el.attachEvent('on' + evt, fn);
255 |             }
256 |         }
257 |     }
258 | 
259 |     function rmEvt(el, evt, fn, bubble) {
260 |         if ('removeEventListener' in el) {
261 |             // BBOS6 doesn't support handleEvent, catch and polyfill
262 |             try {
263 |                 el.removeEventListener(evt, fn, bubble);
264 |             } catch(e) {
265 |                 if (typeof fn === 'object' && fn.handleEvent) {
266 |                     el.removeEventListener(evt, function(e){
267 |                         // Bind fn as this and set first arg as event object
268 |                         fn.handleEvent.call(fn,e);
269 |                     }, bubble);
270 |                 } else {
271 |                     throw e;
272 |                 }
273 |             }
274 |         } else if ('detachEvent' in el) {
275 |             // check if the callback is an object and contains handleEvent
276 |             if (typeof fn === 'object' && fn.handleEvent) {
277 |                 el.detachEvent("on" + evt, function() {
278 |                     // Bind fn as this
279 |                     fn.handleEvent.call(fn);
280 |                 });
281 |             } else {
282 |                 el.detachEvent('on' + evt, fn);
283 |             }
284 |         }
285 |     }
286 | 
287 |     /**
288 |      * Autogrow
289 |      * http://googlecode.blogspot.com/2009/07/gmail-for-mobile-html5-series.html
290 |      */
291 | 
292 |     MBP.autogrow = function(element, lh) {
293 |         function handler() {
294 |             var newHeight = this.scrollHeight;
295 |             var currentHeight = this.clientHeight;
296 |             if (newHeight > currentHeight) {
297 |                 this.style.height = newHeight + 3 * textLineHeight + 'px';
298 |             }
299 |         }
300 | 
301 |         var setLineHeight = (lh) ? lh : 12;
302 |         var textLineHeight = element.currentStyle ? element.currentStyle.lineHeight : getComputedStyle(element, null).lineHeight;
303 | 
304 |         textLineHeight = (textLineHeight.indexOf('px') === -1) ? setLineHeight : parseInt(textLineHeight, 10);
305 | 
306 |         element.style.overflow = 'hidden';
307 | 
308 |         if (element.addEventListener)
309 |           element.addEventListener('input', handler, false);
310 |         else
311 |           element.attachEvent('onpropertychange', handler);
312 |     };
313 | 
314 |     /**
315 |      * Enable CSS active pseudo styles in Mobile Safari
316 |      * http://alxgbsn.co.uk/2011/10/17/enable-css-active-pseudo-styles-in-mobile-safari/
317 |      */
318 | 
319 |     MBP.enableActive = function() {
320 |         document.addEventListener('touchstart', function() {}, false);
321 |     };
322 | 
323 |     /**
324 |      * Prevent default scrolling on document window
325 |      */
326 | 
327 |     MBP.preventScrolling = function() {
328 |         document.addEventListener('touchmove', function(e) {
329 |             if (e.target.type === 'range') { return; }
330 |             e.preventDefault();
331 |         }, false);
332 |     };
333 | 
334 |     /**
335 |      * Prevent iOS from zooming onfocus
336 |      * https://github.com/h5bp/mobile-boilerplate/pull/108
337 |      * Adapted from original jQuery code here: http://nerd.vasilis.nl/prevent-ios-from-zooming-onfocus/
338 |      */
339 | 
340 |     MBP.preventZoom = function() {
341 |         if (MBP.viewportmeta && navigator.platform.match(/iPad|iPhone|iPod/i)) {
342 |             var formFields = document.querySelectorAll('input, select, textarea');
343 |             var contentString = 'width=device-width,initial-scale=1,maximum-scale=';
344 |             var i = 0;
345 |             var fieldLength = formFields.length;
346 | 
347 |             var setViewportOnFocus = function() {
348 |                 MBP.viewportmeta.content = contentString + '1';
349 |             };
350 | 
351 |             var setViewportOnBlur = function() {
352 |                 MBP.viewportmeta.content = contentString + '10';
353 |             };
354 | 
355 |             for (; i < fieldLength; i++) {
356 |                 formFields[i].onfocus = setViewportOnFocus;
357 |                 formFields[i].onblur = setViewportOnBlur;
358 |             }
359 |         }
360 |     };
361 | 
362 |     /**
363 |      * iOS Startup Image helper
364 |      */
365 | 
366 |     MBP.startupImage = function() {
367 |         var portrait;
368 |         var landscape;
369 |         var pixelRatio;
370 |         var head;
371 |         var link1;
372 |         var link2;
373 | 
374 |         pixelRatio = window.devicePixelRatio;
375 |         head = document.getElementsByTagName('head')[0];
376 | 
377 |         if (navigator.platform === 'iPad') {
378 |             portrait = pixelRatio === 2 ? 'img/startup/startup-tablet-portrait-retina.png' : 'img/startup/startup-tablet-portrait.png';
379 |             landscape = pixelRatio === 2 ? 'img/startup/startup-tablet-landscape-retina.png' : 'img/startup/startup-tablet-landscape.png';
380 | 
381 |             link1 = document.createElement('link');
382 |             link1.setAttribute('rel', 'apple-touch-startup-image');
383 |             link1.setAttribute('media', 'screen and (orientation: portrait)');
384 |             link1.setAttribute('href', portrait);
385 |             head.appendChild(link1);
386 | 
387 |             link2 = document.createElement('link');
388 |             link2.setAttribute('rel', 'apple-touch-startup-image');
389 |             link2.setAttribute('media', 'screen and (orientation: landscape)');
390 |             link2.setAttribute('href', landscape);
391 |             head.appendChild(link2);
392 |         } else {
393 |             portrait = pixelRatio === 2 ? "img/startup/startup-retina.png" : "img/startup/startup.png";
394 |             portrait = screen.height === 568 ? "img/startup/startup-retina-4in.png" : portrait;
395 |             link1 = document.createElement('link');
396 |             link1.setAttribute('rel', 'apple-touch-startup-image');
397 |             link1.setAttribute('href', portrait);
398 |             head.appendChild(link1);
399 |         }
400 | 
401 |         //hack to fix letterboxed full screen web apps on 4" iPhone / iPod with iOS 6
402 |         if (navigator.platform.match(/iPhone|iPod/i) && (screen.height === 568) && navigator.userAgent.match(/\bOS 6_/)) {
403 |             if (MBP.viewportmeta) {
404 |                 MBP.viewportmeta.content = MBP.viewportmeta.content
405 |                     .replace(/\bwidth\s*=\s*320\b/, 'width=320.1')
406 |                     .replace(/\bwidth\s*=\s*device-width\b/, '');
407 |             }
408 |         }
409 |     };
410 | 
411 | })(document);
412 | 


--------------------------------------------------------------------------------
/js/main.js:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/h5bp/mobile-boilerplate/78c876e065d90fa87eb55b04b7c127769d66dc54/js/main.js


--------------------------------------------------------------------------------
/js/plugins.js:
--------------------------------------------------------------------------------
 1 | // Avoid `console` errors in browsers that lack a console.
 2 | (function() {
 3 |     var method;
 4 |     var noop = function () {};
 5 |     var methods = [
 6 |         'assert', 'clear', 'count', 'debug', 'dir', 'dirxml', 'error',
 7 |         'exception', 'group', 'groupCollapsed', 'groupEnd', 'info', 'log',
 8 |         'markTimeline', 'profile', 'profileEnd', 'table', 'time', 'timeEnd',
 9 |         'timeline', 'timelineEnd', 'timeStamp', 'trace', 'warn'
10 |     ];
11 |     var length = methods.length;
12 |     var console = (window.console = window.console || {});
13 | 
14 |     while (length--) {
15 |         method = methods[length];
16 | 
17 |         // Only stub undefined methods.
18 |         if (!console[method]) {
19 |             console[method] = noop;
20 |         }
21 |     }
22 | }());
23 | 
24 | // Place any jQuery/helper plugins in here.
25 | 


--------------------------------------------------------------------------------
/js/vendor/modernizr-2.8.3.min.js:
--------------------------------------------------------------------------------
1 | /* Modernizr 2.8.3 (Custom Build) | MIT & BSD
2 |  * Build: http://modernizr.com/download/#-fontface-backgroundsize-borderimage-borderradius-boxshadow-flexbox-flexboxlegacy-hsla-multiplebgs-opacity-rgba-textshadow-cssanimations-csscolumns-generatedcontent-cssgradients-cssreflections-csstransforms-csstransforms3d-csstransitions-applicationcache-canvas-canvastext-draganddrop-hashchange-history-audio-video-indexeddb-input-inputtypes-localstorage-postmessage-sessionstorage-websockets-websqldatabase-webworkers-geolocation-inlinesvg-smil-svg-svgclippaths-touch-webgl-shiv-mq-cssclasses-teststyles-testprop-testallprops-hasevent-prefixes-domprefixes-load
3 |  */
4 | ;window.Modernizr=function(a,b,c){function D(a){j.cssText=a}function E(a,b){return D(n.join(a+";")+(b||""))}function F(a,b){return typeof a===b}function G(a,b){return!!~(""+a).indexOf(b)}function H(a,b){for(var d in a){var e=a[d];if(!G(e,"-")&&j[e]!==c)return b=="pfx"?e:!0}return!1}function I(a,b,d){for(var e in a){var f=b[a[e]];if(f!==c)return d===!1?a[e]:F(f,"function")?f.bind(d||b):f}return!1}function J(a,b,c){var d=a.charAt(0).toUpperCase()+a.slice(1),e=(a+" "+p.join(d+" ")+d).split(" ");return F(b,"string")||F(b,"undefined")?H(e,b):(e=(a+" "+q.join(d+" ")+d).split(" "),I(e,b,c))}function K(){e.input=function(c){for(var d=0,e=c.length;d<e;d++)u[c[d]]=c[d]in k;return u.list&&(u.list=!!b.createElement("datalist")&&!!a.HTMLDataListElement),u}("autocomplete autofocus list placeholder max min multiple pattern required step".split(" ")),e.inputtypes=function(a){for(var d=0,e,f,h,i=a.length;d<i;d++)k.setAttribute("type",f=a[d]),e=k.type!=="text",e&&(k.value=l,k.style.cssText="position:absolute;visibility:hidden;",/^range$/.test(f)&&k.style.WebkitAppearance!==c?(g.appendChild(k),h=b.defaultView,e=h.getComputedStyle&&h.getComputedStyle(k,null).WebkitAppearance!=="textfield"&&k.offsetHeight!==0,g.removeChild(k)):/^(search|tel)$/.test(f)||(/^(url|email)$/.test(f)?e=k.checkValidity&&k.checkValidity()===!1:e=k.value!=l)),t[a[d]]=!!e;return t}("search tel url email datetime date month week time datetime-local number range color".split(" "))}var d="2.8.3",e={},f=!0,g=b.documentElement,h="modernizr",i=b.createElement(h),j=i.style,k=b.createElement("input"),l=":)",m={}.toString,n=" -webkit- -moz- -o- -ms- ".split(" "),o="Webkit Moz O ms",p=o.split(" "),q=o.toLowerCase().split(" "),r={svg:"http://www.w3.org/2000/svg"},s={},t={},u={},v=[],w=v.slice,x,y=function(a,c,d,e){var f,i,j,k,l=b.createElement("div"),m=b.body,n=m||b.createElement("body");if(parseInt(d,10))while(d--)j=b.createElement("div"),j.id=e?e[d]:h+(d+1),l.appendChild(j);return f=["&#173;",'<style id="s',h,'">',a,"</style>"].join(""),l.id=h,(m?l:n).innerHTML+=f,n.appendChild(l),m||(n.style.background="",n.style.overflow="hidden",k=g.style.overflow,g.style.overflow="hidden",g.appendChild(n)),i=c(l,a),m?l.parentNode.removeChild(l):(n.parentNode.removeChild(n),g.style.overflow=k),!!i},z=function(b){var c=a.matchMedia||a.msMatchMedia;if(c)return c(b)&&c(b).matches||!1;var d;return y("@media "+b+" { #"+h+" { position: absolute; } }",function(b){d=(a.getComputedStyle?getComputedStyle(b,null):b.currentStyle)["position"]=="absolute"}),d},A=function(){function d(d,e){e=e||b.createElement(a[d]||"div"),d="on"+d;var f=d in e;return f||(e.setAttribute||(e=b.createElement("div")),e.setAttribute&&e.removeAttribute&&(e.setAttribute(d,""),f=F(e[d],"function"),F(e[d],"undefined")||(e[d]=c),e.removeAttribute(d))),e=null,f}var a={select:"input",change:"input",submit:"form",reset:"form",error:"img",load:"img",abort:"img"};return d}(),B={}.hasOwnProperty,C;!F(B,"undefined")&&!F(B.call,"undefined")?C=function(a,b){return B.call(a,b)}:C=function(a,b){return b in a&&F(a.constructor.prototype[b],"undefined")},Function.prototype.bind||(Function.prototype.bind=function(b){var c=this;if(typeof c!="function")throw new TypeError;var d=w.call(arguments,1),e=function(){if(this instanceof e){var a=function(){};a.prototype=c.prototype;var f=new a,g=c.apply(f,d.concat(w.call(arguments)));return Object(g)===g?g:f}return c.apply(b,d.concat(w.call(arguments)))};return e}),s.flexbox=function(){return J("flexWrap")},s.flexboxlegacy=function(){return J("boxDirection")},s.canvas=function(){var a=b.createElement("canvas");return!!a.getContext&&!!a.getContext("2d")},s.canvastext=function(){return!!e.canvas&&!!F(b.createElement("canvas").getContext("2d").fillText,"function")},s.webgl=function(){return!!a.WebGLRenderingContext},s.touch=function(){var c;return"ontouchstart"in a||a.DocumentTouch&&b instanceof DocumentTouch?c=!0:y(["@media (",n.join("touch-enabled),("),h,")","{#modernizr{top:9px;position:absolute}}"].join(""),function(a){c=a.offsetTop===9}),c},s.geolocation=function(){return"geolocation"in navigator},s.postmessage=function(){return!!a.postMessage},s.websqldatabase=function(){return!!a.openDatabase},s.indexedDB=function(){return!!J("indexedDB",a)},s.hashchange=function(){return A("hashchange",a)&&(b.documentMode===c||b.documentMode>7)},s.history=function(){return!!a.history&&!!history.pushState},s.draganddrop=function(){var a=b.createElement("div");return"draggable"in a||"ondragstart"in a&&"ondrop"in a},s.websockets=function(){return"WebSocket"in a||"MozWebSocket"in a},s.rgba=function(){return D("background-color:rgba(150,255,150,.5)"),G(j.backgroundColor,"rgba")},s.hsla=function(){return D("background-color:hsla(120,40%,100%,.5)"),G(j.backgroundColor,"rgba")||G(j.backgroundColor,"hsla")},s.multiplebgs=function(){return D("background:url(https://),url(https://),red url(https://)"),/(url\s*\(.*?){3}/.test(j.background)},s.backgroundsize=function(){return J("backgroundSize")},s.borderimage=function(){return J("borderImage")},s.borderradius=function(){return J("borderRadius")},s.boxshadow=function(){return J("boxShadow")},s.textshadow=function(){return b.createElement("div").style.textShadow===""},s.opacity=function(){return E("opacity:.55"),/^0.55$/.test(j.opacity)},s.cssanimations=function(){return J("animationName")},s.csscolumns=function(){return J("columnCount")},s.cssgradients=function(){var a="background-image:",b="gradient(linear,left top,right bottom,from(#9f9),to(white));",c="linear-gradient(left top,#9f9, white);";return D((a+"-webkit- ".split(" ").join(b+a)+n.join(c+a)).slice(0,-a.length)),G(j.backgroundImage,"gradient")},s.cssreflections=function(){return J("boxReflect")},s.csstransforms=function(){return!!J("transform")},s.csstransforms3d=function(){var a=!!J("perspective");return a&&"webkitPerspective"in g.style&&y("@media (transform-3d),(-webkit-transform-3d){#modernizr{left:9px;position:absolute;height:3px;}}",function(b,c){a=b.offsetLeft===9&&b.offsetHeight===3}),a},s.csstransitions=function(){return J("transition")},s.fontface=function(){var a;return y('@font-face {font-family:"font";src:url("https://")}',function(c,d){var e=b.getElementById("smodernizr"),f=e.sheet||e.styleSheet,g=f?f.cssRules&&f.cssRules[0]?f.cssRules[0].cssText:f.cssText||"":"";a=/src/i.test(g)&&g.indexOf(d.split(" ")[0])===0}),a},s.generatedcontent=function(){var a;return y(["#",h,"{font:0/0 a}#",h,':after{content:"',l,'";visibility:hidden;font:3px/1 a}'].join(""),function(b){a=b.offsetHeight>=3}),a},s.video=function(){var a=b.createElement("video"),c=!1;try{if(c=!!a.canPlayType)c=new Boolean(c),c.ogg=a.canPlayType('video/ogg; codecs="theora"').replace(/^no$/,""),c.h264=a.canPlayType('video/mp4; codecs="avc1.42E01E"').replace(/^no$/,""),c.webm=a.canPlayType('video/webm; codecs="vp8, vorbis"').replace(/^no$/,"")}catch(d){}return c},s.audio=function(){var a=b.createElement("audio"),c=!1;try{if(c=!!a.canPlayType)c=new Boolean(c),c.ogg=a.canPlayType('audio/ogg; codecs="vorbis"').replace(/^no$/,""),c.mp3=a.canPlayType("audio/mpeg;").replace(/^no$/,""),c.wav=a.canPlayType('audio/wav; codecs="1"').replace(/^no$/,""),c.m4a=(a.canPlayType("audio/x-m4a;")||a.canPlayType("audio/aac;")).replace(/^no$/,"")}catch(d){}return c},s.localstorage=function(){try{return localStorage.setItem(h,h),localStorage.removeItem(h),!0}catch(a){return!1}},s.sessionstorage=function(){try{return sessionStorage.setItem(h,h),sessionStorage.removeItem(h),!0}catch(a){return!1}},s.webworkers=function(){return!!a.Worker},s.applicationcache=function(){return!!a.applicationCache},s.svg=function(){return!!b.createElementNS&&!!b.createElementNS(r.svg,"svg").createSVGRect},s.inlinesvg=function(){var a=b.createElement("div");return a.innerHTML="<svg/>",(a.firstChild&&a.firstChild.namespaceURI)==r.svg},s.smil=function(){return!!b.createElementNS&&/SVGAnimate/.test(m.call(b.createElementNS(r.svg,"animate")))},s.svgclippaths=function(){return!!b.createElementNS&&/SVGClipPath/.test(m.call(b.createElementNS(r.svg,"clipPath")))};for(var L in s)C(s,L)&&(x=L.toLowerCase(),e[x]=s[L](),v.push((e[x]?"":"no-")+x));return e.input||K(),e.addTest=function(a,b){if(typeof a=="object")for(var d in a)C(a,d)&&e.addTest(d,a[d]);else{a=a.toLowerCase();if(e[a]!==c)return e;b=typeof b=="function"?b():b,typeof f!="undefined"&&f&&(g.className+=" "+(b?"":"no-")+a),e[a]=b}return e},D(""),i=k=null,function(a,b){function l(a,b){var c=a.createElement("p"),d=a.getElementsByTagName("head")[0]||a.documentElement;return c.innerHTML="x<style>"+b+"</style>",d.insertBefore(c.lastChild,d.firstChild)}function m(){var a=s.elements;return typeof a=="string"?a.split(" "):a}function n(a){var b=j[a[h]];return b||(b={},i++,a[h]=i,j[i]=b),b}function o(a,c,d){c||(c=b);if(k)return c.createElement(a);d||(d=n(c));var g;return d.cache[a]?g=d.cache[a].cloneNode():f.test(a)?g=(d.cache[a]=d.createElem(a)).cloneNode():g=d.createElem(a),g.canHaveChildren&&!e.test(a)&&!g.tagUrn?d.frag.appendChild(g):g}function p(a,c){a||(a=b);if(k)return a.createDocumentFragment();c=c||n(a);var d=c.frag.cloneNode(),e=0,f=m(),g=f.length;for(;e<g;e++)d.createElement(f[e]);return d}function q(a,b){b.cache||(b.cache={},b.createElem=a.createElement,b.createFrag=a.createDocumentFragment,b.frag=b.createFrag()),a.createElement=function(c){return s.shivMethods?o(c,a,b):b.createElem(c)},a.createDocumentFragment=Function("h,f","return function(){var n=f.cloneNode(),c=n.createElement;h.shivMethods&&("+m().join().replace(/[\w\-]+/g,function(a){return b.createElem(a),b.frag.createElement(a),'c("'+a+'")'})+");return n}")(s,b.frag)}function r(a){a||(a=b);var c=n(a);return s.shivCSS&&!g&&!c.hasCSS&&(c.hasCSS=!!l(a,"article,aside,dialog,figcaption,figure,footer,header,hgroup,main,nav,section{display:block}mark{background:#FF0;color:#000}template{display:none}")),k||q(a,c),a}var c="3.7.0",d=a.html5||{},e=/^<|^(?:button|map|select|textarea|object|iframe|option|optgroup)$/i,f=/^(?:a|b|code|div|fieldset|h1|h2|h3|h4|h5|h6|i|label|li|ol|p|q|span|strong|style|table|tbody|td|th|tr|ul)$/i,g,h="_html5shiv",i=0,j={},k;(function(){try{var a=b.createElement("a");a.innerHTML="<xyz></xyz>",g="hidden"in a,k=a.childNodes.length==1||function(){b.createElement("a");var a=b.createDocumentFragment();return typeof a.cloneNode=="undefined"||typeof a.createDocumentFragment=="undefined"||typeof a.createElement=="undefined"}()}catch(c){g=!0,k=!0}})();var s={elements:d.elements||"abbr article aside audio bdi canvas data datalist details dialog figcaption figure footer header hgroup main mark meter nav output progress section summary template time video",version:c,shivCSS:d.shivCSS!==!1,supportsUnknownElements:k,shivMethods:d.shivMethods!==!1,type:"default",shivDocument:r,createElement:o,createDocumentFragment:p};a.html5=s,r(b)}(this,b),e._version=d,e._prefixes=n,e._domPrefixes=q,e._cssomPrefixes=p,e.mq=z,e.hasEvent=A,e.testProp=function(a){return H([a])},e.testAllProps=J,e.testStyles=y,g.className=g.className.replace(/(^|\s)no-js(\s|$)/,"$1$2")+(f?" js "+v.join(" "):""),e}(this,this.document),function(a,b,c){function d(a){return"[object Function]"==o.call(a)}function e(a){return"string"==typeof a}function f(){}function g(a){return!a||"loaded"==a||"complete"==a||"uninitialized"==a}function h(){var a=p.shift();q=1,a?a.t?m(function(){("c"==a.t?B.injectCss:B.injectJs)(a.s,0,a.a,a.x,a.e,1)},0):(a(),h()):q=0}function i(a,c,d,e,f,i,j){function k(b){if(!o&&g(l.readyState)&&(u.r=o=1,!q&&h(),l.onload=l.onreadystatechange=null,b)){"img"!=a&&m(function(){t.removeChild(l)},50);for(var d in y[c])y[c].hasOwnProperty(d)&&y[c][d].onload()}}var j=j||B.errorTimeout,l=b.createElement(a),o=0,r=0,u={t:d,s:c,e:f,a:i,x:j};1===y[c]&&(r=1,y[c]=[]),"object"==a?l.data=c:(l.src=c,l.type=a),l.width=l.height="0",l.onerror=l.onload=l.onreadystatechange=function(){k.call(this,r)},p.splice(e,0,u),"img"!=a&&(r||2===y[c]?(t.insertBefore(l,s?null:n),m(k,j)):y[c].push(l))}function j(a,b,c,d,f){return q=0,b=b||"j",e(a)?i("c"==b?v:u,a,b,this.i++,c,d,f):(p.splice(this.i++,0,a),1==p.length&&h()),this}function k(){var a=B;return a.loader={load:j,i:0},a}var l=b.documentElement,m=a.setTimeout,n=b.getElementsByTagName("script")[0],o={}.toString,p=[],q=0,r="MozAppearance"in l.style,s=r&&!!b.createRange().compareNode,t=s?l:n.parentNode,l=a.opera&&"[object Opera]"==o.call(a.opera),l=!!b.attachEvent&&!l,u=r?"object":l?"script":"img",v=l?"script":u,w=Array.isArray||function(a){return"[object Array]"==o.call(a)},x=[],y={},z={timeout:function(a,b){return b.length&&(a.timeout=b[0]),a}},A,B;B=function(a){function b(a){var a=a.split("!"),b=x.length,c=a.pop(),d=a.length,c={url:c,origUrl:c,prefixes:a},e,f,g;for(f=0;f<d;f++)g=a[f].split("="),(e=z[g.shift()])&&(c=e(c,g));for(f=0;f<b;f++)c=x[f](c);return c}function g(a,e,f,g,h){var i=b(a),j=i.autoCallback;i.url.split(".").pop().split("?").shift(),i.bypass||(e&&(e=d(e)?e:e[a]||e[g]||e[a.split("/").pop().split("?")[0]]),i.instead?i.instead(a,e,f,g,h):(y[i.url]?i.noexec=!0:y[i.url]=1,f.load(i.url,i.forceCSS||!i.forceJS&&"css"==i.url.split(".").pop().split("?").shift()?"c":c,i.noexec,i.attrs,i.timeout),(d(e)||d(j))&&f.load(function(){k(),e&&e(i.origUrl,h,g),j&&j(i.origUrl,h,g),y[i.url]=2})))}function h(a,b){function c(a,c){if(a){if(e(a))c||(j=function(){var a=[].slice.call(arguments);k.apply(this,a),l()}),g(a,j,b,0,h);else if(Object(a)===a)for(n in m=function(){var b=0,c;for(c in a)a.hasOwnProperty(c)&&b++;return b}(),a)a.hasOwnProperty(n)&&(!c&&!--m&&(d(j)?j=function(){var a=[].slice.call(arguments);k.apply(this,a),l()}:j[n]=function(a){return function(){var b=[].slice.call(arguments);a&&a.apply(this,b),l()}}(k[n])),g(a[n],j,b,n,h))}else!c&&l()}var h=!!a.test,i=a.load||a.both,j=a.callback||f,k=j,l=a.complete||f,m,n;c(h?a.yep:a.nope,!!i),i&&c(i)}var i,j,l=this.yepnope.loader;if(e(a))g(a,0,l,0);else if(w(a))for(i=0;i<a.length;i++)j=a[i],e(j)?g(j,0,l,0):w(j)?B(j):Object(j)===j&&h(j,l);else Object(a)===a&&h(a,l)},B.addPrefix=function(a,b){z[a]=b},B.addFilter=function(a){x.push(a)},B.errorTimeout=1e4,null==b.readyState&&b.addEventListener&&(b.readyState="loading",b.addEventListener("DOMContentLoaded",A=function(){b.removeEventListener("DOMContentLoaded",A,0),b.readyState="complete"},0)),a.yepnope=k(),a.yepnope.executeStack=h,a.yepnope.injectJs=function(a,c,d,e,i,j){var k=b.createElement("script"),l,o,e=e||B.errorTimeout;k.src=a;for(o in d)k.setAttribute(o,d[o]);c=j?h:c||f,k.onreadystatechange=k.onload=function(){!l&&g(k.readyState)&&(l=1,c(),k.onload=k.onreadystatechange=null)},m(function(){l||(l=1,c(1))},e),i?k.onload():n.parentNode.insertBefore(k,n)},a.yepnope.injectCss=function(a,c,d,e,g,i){var e=b.createElement("link"),j,c=i?h:c||f;e.href=a,e.rel="stylesheet",e.type="text/css";for(j in d)e.setAttribute(j,d[j]);g||(n.parentNode.insertBefore(e,n),m(c,0))}}(this,document),Modernizr.load=function(){yepnope.apply(window,[].slice.call(arguments,0))};
5 | 


--------------------------------------------------------------------------------
/manifest.webapp:
--------------------------------------------------------------------------------
 1 | {
 2 |   "version": "1.0.0",
 3 |   "name": "Mobile Boilerplate",
 4 |   "launch_path": "/index.html",
 5 |   "description": "A front-end template that helps you build fast, modern mobile web apps.",
 6 |   "icons": {
 7 |     "60": "/img/touch/touch-icon-60x60.png",
 8 |     "128": "/img/touch/touch-icon-128x128.png"
 9 |   },
10 |   "developer": {
11 |     "name": "",
12 |     "url": ""
13 |   },
14 |   "installs_allowed_from": [
15 |     "*"
16 |   ],
17 |   "default_locale": "en",
18 |   "permissions": {
19 |   },
20 |   "locales": {
21 |     "en": {
22 |       "name": "Mobile Boilerplate",
23 |       "description": "A front-end template that helps you build fast, modern mobile web apps."
24 |     }
25 |   }
26 | }
27 | 


--------------------------------------------------------------------------------
/robots.txt:
--------------------------------------------------------------------------------
1 | # www.robotstxt.org/
2 | 
3 | # Allow crawling of all content
4 | User-agent: *
5 | Disallow:
6 | 


--------------------------------------------------------------------------------