Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
Browse files

Initial commit

  • Loading branch information...
commit 640eb0b6c3c875860c53e2a975f3523cd6fefc00 0 parents
@necolas necolas authored
2  .gitignore
@@ -0,0 +1,2 @@
+dist
+node_modules
14 .jshintrc
@@ -0,0 +1,14 @@
+{
+ "browser": false,
+ "curly": true,
+ "eqeqeq": true,
+ "latedef": true,
+ "newcap": true,
+ "noarg": true,
+ "sub": true,
+ "undef": true,
+ "boss": true,
+ "eqnull": true,
+ "node": true,
+ "es5": true
+}
19 LICENSE.md
@@ -0,0 +1,19 @@
+Copyright (c) HTML5 Boilerplate
+
+Permission is hereby granted, free of charge, to any person obtaining a copy of
+this software and associated documentation files (the "Software"), to deal in
+the Software without restriction, including without limitation the rights to
+use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies
+of the Software, and to permit persons to whom the Software is furnished to do
+so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
22 README.md
@@ -0,0 +1,22 @@
+# mobileboilerplate.com source code
+
+The Mobile Boilerplate website is a simple static site.
+
+* The development code is in the `src` directory.
+* The build process relies on grunt - a Node.js build script. The grunt
+ configuration is found in `grunt.js` and the individual tasks are found in
+ the `tasks` directory.
+
+## Development setup
+
+1. Install Node.js and npm
+2. Install grunt globally: `npm install -g grunt`.
+3. Run `npm install`.
+
+You should be able to work almost entirely in the `src` directory.
+
+When you have finished your changes, make sure that the distribution package is
+correct by running `grunt build` and then checking the output.
+
+If you need to modify the grunt tasks or configuration, please run `grunt lint`
+and make sure that there are no errors before committing code.
60 grunt.js
@@ -0,0 +1,60 @@
+module.exports = function(grunt) {
+ 'use strict';
+
+ // readOptionalJSON
+ // by Ben Alman
+ // https://gist.github.com/2876125
+ function readOptionalJSON( filepath ) {
+ var data = {};
+ try {
+ data = grunt.file.readJSON( filepath );
+ grunt.verbose.write( "Reading " + filepath + "..." ).ok();
+ } catch(e) {}
+ return data;
+ }
+
+ // Project configuration.
+ grunt.initConfig({
+ dir: {
+ src: 'src',
+ dest: 'dist'
+ },
+
+ lint: {
+ grunt: ['grunt.js']
+ },
+
+ min: {
+ 'dist/js/main.min.js': '<%= dir.src %>/js/main.js'
+ },
+
+ mincss: {
+ 'dist/css/main.min.css': [
+ '<%= dir.src %>/css/_normalize.css',
+ '<%= dir.src %>/css/_base.css',
+ '<%= dir.src %>/css/_utils.css',
+ '<%= dir.src %>/css/_components.css',
+ '<%= dir.src %>/css/_site.css',
+ '<%= dir.src %>/css/_mq.css',
+ '<%= dir.src %>/css/_print.css'
+ ]
+ },
+
+ jshint: {
+ options: readOptionalJSON('.jshintrc')
+ },
+
+ watch: {
+ lint: {
+ files: '<config:lint.grunt>',
+ tasks: ['lint']
+ }
+ }
+ });
+
+ grunt.loadTasks('tasks');
+ // Default task.
+ grunt.registerTask('default', ['watch']);
+ // Build task.
+ grunt.registerTask('build', ['clean', 'copy', 'min', 'mincss', 'usemin']);
+};
27 package.json
@@ -0,0 +1,27 @@
+{
+ "name": "html5boilerplate-com",
+ "description": "Website for the HTML5 Boilerplate project",
+ "version": "1.0.0",
+ "author": "Nicolas Gallagher (http://nicolasgallagher.com/)",
+ "homepage": "http://html5boilerplate.com",
+ "repository": {
+ "type": "git",
+ "url": "https://github.com/h5bp/html5boilerplate.com.git"
+ },
+ "bugs": {
+ "url" : "https://github.com/h5bp/html5boilerplate.com/issues"
+ },
+ "licenses": [
+ {
+ "type": "MIT",
+ "url": "https://github.com/h5bp/html5boilerplate.com/blob/master/LICENSE"
+ }
+ ],
+ "dependencies": {
+ },
+ "devDependencies": {
+ "clean-css": "~0.4.1",
+ "grunt": "0.3.x",
+ "rimraf": "2.0.x"
+ }
+}
301 src/.htaccess
@@ -0,0 +1,301 @@
+# ----------------------------------------------------------------------
+# Start rewrite engine
+# ----------------------------------------------------------------------
+
+# Turning on the rewrite engine is necessary for the following rules and
+# features. FollowSymLinks must be enabled for this to work.
+
+# Some cloud hosting services require RewriteBase to be set: goo.gl/HOcPN
+# If using the h5bp in a subdirectory, use `RewriteBase /foo` instead where
+# 'foo' is your directory.
+
+# If your web host doesn't allow the FollowSymlinks option, you may need to
+# comment it out and use `Options +SymLinksOfOwnerMatch`, but be aware of the
+# performance impact: http://goo.gl/Mluzd
+
+<IfModule mod_rewrite.c>
+ Options +FollowSymlinks
+# Options +SymLinksIfOwnerMatch
+ Options +FollowSymlinks
+ RewriteEngine On
+# RewriteBase /
+</IfModule>
+
+
+# Option 1:
+# Rewrite "www.example.com -> example.com".
+<IfModule mod_rewrite.c>
+ RewriteEngine On
+ RewriteCond %{HTTPS} !=on
+ RewriteCond %{HTTP_HOST} ^www\.(.+)$ [NC]
+ RewriteRule ^ http://%1%{REQUEST_URI} [R=301,L]
+</IfModule>
+
+
+# ----------------------------------------------------------------------
+# Prevent 404 errors for non-existing redirected folders
+# ----------------------------------------------------------------------
+
+# without -MultiViews, Apache will give a 404 for a rewrite if a folder of the
+# same name does not exist.
+# webmasterworld.com/apache/3808792.htm
+
+Options -MultiViews
+
+
+# ----------------------------------------------------------------------
+# Custom 404 page
+# ----------------------------------------------------------------------
+
+# You can add custom pages to handle 500 or 403 pretty easily, if you like.
+# If you are hosting your site in subdirectory, adjust this accordingly
+# e.g. ErrorDocument 404 /subdir/404.html
+ErrorDocument 404 /404.html
+
+
+# ----------------------------------------------------------------------
+# UTF-8 encoding
+# ----------------------------------------------------------------------
+
+# Use UTF-8 encoding for anything served text/plain or text/html
+AddDefaultCharset utf-8
+
+# Force UTF-8 for a number of file formats
+AddCharset utf-8 .atom .css .js .json .rss .vtt .xml
+
+
+# ----------------------------------------------------------------------
+# Better website experience for IE users
+# ----------------------------------------------------------------------
+
+# Force the latest IE version, in various cases when it may fall back to IE7 mode
+# github.com/rails/rails/commit/123eb25#commitcomment-118920
+# Use ChromeFrame if it's installed for a better experience for the poor IE folk
+
+<IfModule mod_headers.c>
+ Header set X-UA-Compatible "IE=Edge,chrome=1"
+ # mod_headers can't match by content-type, but we don't want to send this header on *everything*...
+ <FilesMatch "\.(js|css|gif|png|jpe?g|pdf|xml|oga|ogg|m4a|ogv|mp4|m4v|webm|svg|svgz|eot|ttf|otf|woff|ico|webp|appcache|manifest|htc|crx|oex|xpi|safariextz|vcf)$" >
+ Header unset X-UA-Compatible
+ </FilesMatch>
+</IfModule>
+
+
+# ----------------------------------------------------------------------
+# Webfont access
+# ----------------------------------------------------------------------
+
+# Allow access from all domains for webfonts.
+# Alternatively you could only whitelist your
+# subdomains like "subdomain.example.com".
+
+<IfModule mod_headers.c>
+ <FilesMatch "\.(ttf|ttc|otf|eot|woff|font.css)$">
+ Header set Access-Control-Allow-Origin "*"
+ </FilesMatch>
+</IfModule>
+
+
+
+# ----------------------------------------------------------------------
+# Proper MIME type for all files
+# ----------------------------------------------------------------------
+
+# JavaScript
+# Normalize to standard type (it's sniffed in IE anyways)
+# tools.ietf.org/html/rfc4329#section-7.2
+AddType application/javascript js jsonp
+AddType application/json json
+
+# Audio
+AddType audio/ogg oga ogg
+AddType audio/mp4 m4a f4a f4b
+
+# Video
+AddType video/ogg ogv
+AddType video/mp4 mp4 m4v f4v f4p
+AddType video/webm webm
+AddType video/x-flv flv
+
+# SVG
+# Required for svg webfonts on iPad
+# twitter.com/FontSquirrel/status/14855840545
+AddType image/svg+xml svg svgz
+AddEncoding gzip svgz
+
+# Webfonts
+AddType application/vnd.ms-fontobject eot
+AddType application/x-font-ttf ttf ttc
+AddType font/opentype otf
+AddType application/x-font-woff woff
+
+# Assorted types
+AddType image/x-icon ico
+AddType image/webp webp
+AddType text/cache-manifest appcache manifest
+AddType text/x-component htc
+AddType application/xml rss atom xml rdf
+AddType application/x-chrome-extension crx
+AddType application/x-opera-extension oex
+AddType application/x-xpinstall xpi
+AddType application/octet-stream safariextz
+AddType application/x-web-app-manifest+json webapp
+AddType text/x-vcard vcf
+AddType application/x-shockwave-flash swf
+AddType text/vtt vtt
+
+
+# ----------------------------------------------------------------------
+# Gzip compression
+# ----------------------------------------------------------------------
+
+<IfModule mod_deflate.c>
+
+ # Force deflate for mangled headers developer.yahoo.com/blogs/ydn/posts/2010/12/pushing-beyond-gzipping/
+ <IfModule mod_setenvif.c>
+ <IfModule mod_headers.c>
+ SetEnvIfNoCase ^(Accept-EncodXng|X-cept-Encoding|X{15}|~{15}|-{15})$ ^((gzip|deflate)\s*,?\s*)+|[X~-]{4,13}$ HAVE_Accept-Encoding
+ RequestHeader append Accept-Encoding "gzip,deflate" env=HAVE_Accept-Encoding
+ </IfModule>
+ </IfModule>
+
+ # Compress all output labeled with one of the following MIME-types
+ <IfModule mod_filter.c>
+ AddOutputFilterByType DEFLATE application/atom+xml \
+ application/javascript \
+ application/json \
+ application/rss+xml \
+ application/vnd.ms-fontobject \
+ application/x-font-ttf \
+ application/xhtml+xml \
+ application/xml \
+ font/opentype \
+ image/svg+xml \
+ image/x-icon \
+ text/css \
+ text/html \
+ text/plain \
+ text/x-component \
+ text/xml
+ </IfModule>
+
+</IfModule>
+
+
+# ----------------------------------------------------------------------
+# Expires headers (for better cache control)
+# ----------------------------------------------------------------------
+
+# These are pretty far-future expires headers.
+# They assume you control versioning with filename-based cache busting
+# Additionally, consider that outdated proxies may miscache
+# www.stevesouders.com/blog/2008/08/23/revving-filenames-dont-use-querystring/
+
+# If you don't use filenames to version, lower the CSS and JS to something like
+# "access plus 1 week".
+
+<IfModule mod_expires.c>
+ ExpiresActive on
+
+# Perhaps better to whitelist expires rules? Perhaps.
+ ExpiresDefault "access plus 1 month"
+
+# cache.appcache needs re-requests in FF 3.6 (thanks Remy ~Introducing HTML5)
+ ExpiresByType text/cache-manifest "access plus 0 seconds"
+
+# Your document html
+ ExpiresByType text/html "access plus 0 seconds"
+
+# Data
+ ExpiresByType text/xml "access plus 0 seconds"
+ ExpiresByType application/xml "access plus 0 seconds"
+ ExpiresByType application/json "access plus 0 seconds"
+
+# Feed
+ ExpiresByType application/rss+xml "access plus 1 hour"
+ ExpiresByType application/atom+xml "access plus 1 hour"
+
+# Favicon (cannot be renamed)
+ ExpiresByType image/x-icon "access plus 1 week"
+
+# Media: images, video, audio
+ ExpiresByType image/gif "access plus 1 month"
+ ExpiresByType image/png "access plus 1 month"
+ ExpiresByType image/jpeg "access plus 1 month"
+ ExpiresByType video/ogg "access plus 1 month"
+ ExpiresByType audio/ogg "access plus 1 month"
+ ExpiresByType video/mp4 "access plus 1 month"
+ ExpiresByType video/webm "access plus 1 month"
+
+# HTC files (css3pie)
+ ExpiresByType text/x-component "access plus 1 month"
+
+# Webfonts
+ ExpiresByType application/x-font-ttf "access plus 1 month"
+ ExpiresByType font/opentype "access plus 1 month"
+ ExpiresByType application/x-font-woff "access plus 1 month"
+ ExpiresByType image/svg+xml "access plus 1 month"
+
+# CSS and JavaScript
+ ExpiresByType text/css "access plus 1 year"
+ ExpiresByType application/javascript "access plus 1 year"
+
+</IfModule>
+
+
+# ----------------------------------------------------------------------
+# ETag removal
+# ----------------------------------------------------------------------
+
+# FileETag None is not enough for every server.
+<IfModule mod_headers.c>
+ Header unset ETag
+</IfModule>
+
+# Since we're sending far-future expires, we don't need ETags for
+# static content.
+# developer.yahoo.com/performance/rules.html#etags
+FileETag None
+
+
+# ----------------------------------------------------------------------
+# Prevent mobile network providers from modifying your site
+# ----------------------------------------------------------------------
+
+# The following header prevents modification of your code over 3G on some
+# European providers.
+# This is the official 'bypass' suggested by O2 in the UK.
+
+# <IfModule mod_headers.c>
+# Header set Cache-Control "no-transform"
+# </IfModule>
+
+
+# ----------------------------------------------------------------------
+# A little more security
+# ----------------------------------------------------------------------
+
+# To avoid displaying the exact version number of Apache being used, add the
+# following to httpd.conf (it will not work in .htaccess):
+# ServerTokens Prod
+
+# "-Indexes" will have Apache block users from browsing folders without a
+# default document Usually you should leave this activated, because you
+# shouldn't allow everybody to surf through every folder on your server (which
+# includes rather private places like CMS system folders).
+<IfModule mod_autoindex.c>
+ Options -Indexes
+</IfModule>
+
+# Block access to "hidden" directories or files whose names begin with a
+# period. This includes directories used by version control systems such as
+# Subversion or Git.
+<IfModule mod_rewrite.c>
+ RewriteCond %{SCRIPT_FILENAME} -d [OR]
+ RewriteCond %{SCRIPT_FILENAME} -f
+ RewriteRule "(^|/)\." - [F]
+</IfModule>
+
+
+# We don't need to tell everyone we're Apache.
+ServerSignature Off
157 src/404.html
@@ -0,0 +1,157 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+ <meta charset="utf-8">
+ <title>Page Not Found :(</title>
+ <style>
+ ::-moz-selection {
+ background: #b3d4fc;
+ text-shadow: none;
+ }
+
+ ::selection {
+ background: #b3d4fc;
+ text-shadow: none;
+ }
+
+ html {
+ padding: 30px 10px;
+ font-size: 20px;
+ line-height: 1.4;
+ color: #737373;
+ background: #f0f0f0;
+ -webkit-text-size-adjust: 100%;
+ -ms-text-size-adjust: 100%;
+ }
+
+ html,
+ input {
+ font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
+ }
+
+ body {
+ max-width: 500px;
+ _width: 500px;
+ padding: 30px 20px 50px;
+ border: 1px solid #b3b3b3;
+ border-radius: 4px;
+ margin: 0 auto;
+ box-shadow: 0 1px 10px #a7a7a7, inset 0 1px 0 #fff;
+ background: #fcfcfc;
+ }
+
+ h1 {
+ margin: 0 10px;
+ font-size: 50px;
+ text-align: center;
+ }
+
+ h1 span {
+ color: #bbb;
+ }
+
+ h3 {
+ margin: 1.5em 0 0.5em;
+ }
+
+ p {
+ margin: 1em 0;
+ }
+
+ ul {
+ padding: 0 0 0 40px;
+ margin: 1em 0;
+ }
+
+ .container {
+ max-width: 380px;
+ _width: 380px;
+ margin: 0 auto;
+ }
+
+ /* google search */
+
+ #goog-fixurl ul {
+ list-style: none;
+ padding: 0;
+ margin: 0;
+ }
+
+ #goog-fixurl form {
+ margin: 0;
+ }
+
+ #goog-wm-qt,
+ #goog-wm-sb {
+ border: 1px solid #bbb;
+ font-size: 16px;
+ line-height: normal;
+ vertical-align: top;
+ color: #444;
+ border-radius: 2px;
+ }
+
+ #goog-wm-qt {
+ width: 220px;
+ height: 20px;
+ padding: 5px;
+ margin: 5px 10px 0 0;
+ box-shadow: inset 0 1px 1px #ccc;
+ }
+
+ #goog-wm-sb {
+ display: inline-block;
+ height: 32px;
+ padding: 0 10px;
+ margin: 5px 0 0;
+ white-space: nowrap;
+ cursor: pointer;
+ background-color: #f5f5f5;
+ background-image: -webkit-linear-gradient(rgba(255,255,255,0), #f1f1f1);
+ background-image: -moz-linear-gradient(rgba(255,255,255,0), #f1f1f1);
+ background-image: -ms-linear-gradient(rgba(255,255,255,0), #f1f1f1);
+ background-image: -o-linear-gradient(rgba(255,255,255,0), #f1f1f1);
+ -webkit-appearance: none;
+ -moz-appearance: none;
+ appearance: none;
+ *overflow: visible;
+ *display: inline;
+ *zoom: 1;
+ }
+
+ #goog-wm-sb:hover,
+ #goog-wm-sb:focus {
+ border-color: #aaa;
+ box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
+ background-color: #f8f8f8;
+ }
+
+ #goog-wm-qt:hover,
+ #goog-wm-qt:focus {
+ border-color: #105cb6;
+ outline: 0;
+ color: #222;
+ }
+
+ input::-moz-focus-inner {
+ padding: 0;
+ border: 0;
+ }
+ </style>
+</head>
+<body>
+ <div class="container">
+ <h1>Not found <span>:(</span></h1>
+ <p>Sorry, but the page you were trying to view does not exist.</p>
+ <p>It looks like this was the result of either:</p>
+ <ul>
+ <li>a mistyped address</li>
+ <li>an out-of-date link</li>
+ </ul>
+ <script>
+ var GOOG_FIXURL_LANG = (navigator.language || '').slice(0,2),GOOG_FIXURL_SITE = location.host;
+ </script>
+ <script src="http://linkhelp.clients.google.com/tbproxy/lh/wm/fixurl.js"></script>
+ </div>
+</body>
+</html>
BIN  src/apple-touch-icon-114x114-precomposed.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
BIN  src/apple-touch-icon-144x144-precomposed.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
BIN  src/apple-touch-icon-57x57-precomposed.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
BIN  src/apple-touch-icon-72x72-precomposed.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
BIN  src/apple-touch-icon-precomposed.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
BIN  src/apple-touch-icon.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
73 src/css/_base.css
@@ -0,0 +1,73 @@
+/* ==========================================================================
+ Base styles
+ ========================================================================== */
+
+html {
+ color: #fff;
+ font-family: 'Open sans', sans-serif;
+ font-size: 16px;
+ line-height: 1.4;
+ text-align: center;
+}
+
+body {
+ background: #222;
+}
+
+a {
+ color: #069;
+ text-decoration: none;
+}
+
+a:hover,
+a:focus,
+a:active {
+ text-decoration: underline;
+}
+
+/*
+ * Remove text-shadow in selection highlight.
+ * These selection declarations have to be separate.
+ */
+
+::-moz-selection {
+ background: #b3d4fc;
+ text-shadow: none;
+}
+
+::selection {
+ background: #b3d4fc;
+ text-shadow: none;
+}
+
+/*
+ * Remove the gap between images and the bottom of their containers: h5bp.com/i/440
+ */
+
+img {
+ vertical-align: middle;
+}
+
+/* Typography
+ ========================================================================== */
+
+h1 {
+ margin: 0 0 0.75em;
+ font-size: 3em;
+ line-height: 1.2em;
+}
+
+h2 {
+ margin: 1.5em 0 1em;
+ font-size: 2em;
+}
+
+h3 {
+ margin: 0 0 0.5em;
+ color: #555;
+ font-size: 1.25em;
+}
+
+p {
+ margin: 0 0 2em;
+}
101 src/css/_components.css
@@ -0,0 +1,101 @@
+/* ==========================================================================
+ Reusable components
+ ========================================================================== */
+
+/**
+ * Container
+ *
+ * Controls consitent width and centering of site structure.
+ */
+
+.container {
+ max-width: 720px;
+ padding: 0 10px;
+ margin: 0 auto;
+}
+
+/**
+ * Aside
+ */
+
+.aside {
+ padding: 1em 0;
+ border: solid #e3e3e3;
+ border-width: 1px 0;
+ background: #eee;
+ font-size: 1.125em;
+}
+
+/**
+ * Calls to action
+ */
+
+.cta-option {
+ position: relative;
+ display: inline-block;
+ margin: 2.5em 0.5em 0;
+ vertical-align: top;
+}
+
+/**
+ * Download button
+ */
+
+.btn-download {
+ position: relative;
+ display: inline-block;
+ vertical-align: middle;
+ padding: 0.6em 1em;
+ border: 1px solid #995309;
+ color: #fff;
+ background: #d9750b;
+ border-radius: 4px;
+ box-shadow: 0 2px 5px -2px #111, inset 0 2px 5px 0 rgba(255, 255, 255, 0.3);
+ font-size: 1.5em;
+ text-decoration: none;
+}
+
+.btn-download:hover,
+.btn-download:focus,
+.btn-download:active {
+ background: #e0811b;
+ text-decoration: none;
+}
+
+.btn-download:active {
+ box-shadow: inset 0 2px 3px 0 rgba(0,0,0,0.2);
+ background: #cf6a00;
+}
+
+/**
+ * Alternative download button
+ *
+ * @extends .btn-download
+ */
+
+.btn-download-alt {
+ margin-top: 0.25em;
+ border-color: #222;
+ background: #444;
+ box-shadow: none;
+ font-size: 1.25em;
+
+}
+
+.btn-download-alt:hover,
+.btn-download-alt:focus,
+.btn-download-alt:active {
+ background: #555;
+}
+
+.btn-download-alt:active {
+ background: #3f3f3f;
+}
+
+/**
+ * Star
+ */
+
+.star {
+ color: #e08524;
+}
36 src/css/_mq.css
@@ -0,0 +1,36 @@
+/* ==========================================================================
+ Media Queries for Responsive Design.
+ ========================================================================== */
+
+@media only screen and (max-width: 720px) {
+ .site-logo,
+ .site-nav {
+ float: none;
+ }
+
+ .site-nav li {
+ margin: 0 0.5em;
+ }
+}
+
+@media only screen and (max-width: 500px) {
+ html {
+ font-size: 14px;
+ }
+}
+
+@media only screen and (max-width: 460px) {
+ .grid-cell {
+ width: 100%;
+ }
+}
+
+@media only screen and (max-width: 420px) {
+ html {
+ font-size: 13px;
+ }
+
+ h1 {
+ font-size: 2.5em;
+ }
+}
375 src/css/_normalize.css
@@ -0,0 +1,375 @@
+/*! normalize.css v2.0.1 | MIT License | git.io/normalize */
+
+/* ==========================================================================
+ HTML5 display definitions
+ ========================================================================== */
+
+/*
+ * Corrects `block` display not defined in IE 8/9.
+ */
+
+article,
+aside,
+details,
+figcaption,
+figure,
+footer,
+header,
+hgroup,
+nav,
+section,
+summary {
+ display: block;
+}
+
+/*
+ * Corrects `inline-block` display not defined in IE 8/9.
+ */
+
+audio,
+canvas,
+video {
+ display: inline-block;
+}
+
+/*
+ * Prevents modern browsers from displaying `audio` without controls.
+ * Remove excess height in iOS 5 devices.
+ */
+
+audio:not([controls]) {
+ display: none;
+ height: 0;
+}
+
+/*
+ * Addresses styling for `hidden` attribute not present in IE 8/9.
+ */
+
+[hidden] {
+ display: none;
+}
+
+/* ==========================================================================
+ Base
+ ========================================================================== */
+
+/*
+ * 1. Sets default font family to sans-serif.
+ * 2. Prevents iOS text size adjust after orientation change, without disabling
+ * user zoom.
+ */
+
+html {
+ font-family: sans-serif; /* 1 */
+ -webkit-text-size-adjust: 100%; /* 2 */
+ -ms-text-size-adjust: 100%; /* 2 */
+}
+
+/*
+ * Removes default margin.
+ */
+
+body {
+ margin: 0;
+}
+
+/* ==========================================================================
+ Links
+ ========================================================================== */
+
+/*
+ * Addresses `outline` inconsistency between Chrome and other browsers.
+ */
+
+a:focus {
+ outline: thin dotted;
+}
+
+/*
+ * Improves readability when focused and also mouse hovered in all browsers.
+ */
+
+a:active,
+a:hover {
+ outline: 0;
+}
+
+/* ==========================================================================
+ Typography
+ ========================================================================== */
+
+/*
+ * Addresses `h1` font sizes within `section` and `article` in Firefox 4+,
+ * Safari 5, and Chrome.
+ */
+
+h1 {
+ font-size: 2em;
+}
+
+/*
+ * Addresses styling not present in IE 8/9, Safari 5, and Chrome.
+ */
+
+abbr[title] {
+ border-bottom: 1px dotted;
+}
+
+/*
+ * Addresses style set to `bolder` in Firefox 4+, Safari 5, and Chrome.
+ */
+
+b,
+strong {
+ font-weight: bold;
+}
+
+/*
+ * Addresses styling not present in Safari 5 and Chrome.
+ */
+
+dfn {
+ font-style: italic;
+}
+
+/*
+ * Addresses styling not present in IE 8/9.
+ */
+
+mark {
+ background: #ff0;
+ color: #000;
+}
+
+
+/*
+ * Corrects font family set oddly in Safari 5 and Chrome.
+ */
+
+code,
+kbd,
+pre,
+samp {
+ font-family: monospace, serif;
+ font-size: 1em;
+}
+
+/*
+ * Improves readability of pre-formatted text in all browsers.
+ */
+
+pre {
+ white-space: pre;
+ white-space: pre-wrap;
+ word-wrap: break-word;
+}
+
+/*
+ * Sets consistent quote types.
+ */
+
+q {
+ quotes: "\201C" "\201D" "\2018" "\2019";
+}
+
+/*
+ * Addresses inconsistent and variable font size in all browsers.
+ */
+
+small {
+ font-size: 80%;
+}
+
+/*
+ * Prevents `sub` and `sup` affecting `line-height` in all browsers.
+ */
+
+sub,
+sup {
+ font-size: 75%;
+ line-height: 0;
+ position: relative;
+ vertical-align: baseline;
+}
+
+sup {
+ top: -0.5em;
+}
+
+sub {
+ bottom: -0.25em;
+}
+
+/* ==========================================================================
+ Embedded content
+ ========================================================================== */
+
+/*
+ * Removes border when inside `a` element in IE 8/9.
+ */
+
+img {
+ border: 0;
+}
+
+/*
+ * Corrects overflow displayed oddly in IE 9.
+ */
+
+svg:not(:root) {
+ overflow: hidden;
+}
+
+/* ==========================================================================
+ Figures
+ ========================================================================== */
+
+/*
+ * Addresses margin not present in IE 8/9 and Safari 5.
+ */
+
+figure {
+ margin: 0;
+}
+
+/* ==========================================================================
+ Forms
+ ========================================================================== */
+
+/*
+ * Define consistent border, margin, and padding.
+ */
+
+fieldset {
+ border: 1px solid #c0c0c0;
+ margin: 0 2px;
+ padding: 0.35em 0.625em 0.75em;
+}
+
+/*
+ * 1. Corrects color not being inherited in IE 8/9.
+ * 2. Remove padding so people aren't caught out if they zero out fieldsets.
+ */
+
+legend {
+ border: 0; /* 1 */
+ padding: 0; /* 2 */
+}
+
+/*
+ * 1. Corrects font family not being inherited in all browsers.
+ * 2. Corrects font size not being inherited in all browsers.
+ * 3. Addresses margins set differently in Firefox 4+, Safari 5, and Chrome
+ */
+
+button,
+input,
+select,
+textarea {
+ font-family: inherit; /* 1 */
+ font-size: 100%; /* 2 */
+ margin: 0; /* 3 */
+}
+
+/*
+ * Addresses Firefox 4+ setting `line-height` on `input` using `!important` in
+ * the UA stylesheet.
+ */
+
+button,
+input {
+ line-height: normal;
+}
+
+/*
+ * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
+ * and `video` controls.
+ * 2. Corrects inability to style clickable `input` types in iOS.
+ * 3. Improves usability and consistency of cursor style between image-type
+ * `input` and others.
+ */
+
+button,
+html input[type="button"], /* 1 */
+input[type="reset"],
+input[type="submit"] {
+ -webkit-appearance: button; /* 2 */
+ cursor: pointer; /* 3 */
+}
+
+/*
+ * Re-set default cursor for disabled elements.
+ */
+
+button[disabled],
+input[disabled] {
+ cursor: default;
+}
+
+/*
+ * 1. Addresses box sizing set to `content-box` in IE 8/9.
+ * 2. Removes excess padding in IE 8/9.
+ */
+
+input[type="checkbox"],
+input[type="radio"] {
+ box-sizing: border-box; /* 1 */
+ padding: 0; /* 2 */
+}
+
+/*
+ * 1. Addresses `appearance` set to `searchfield` in Safari 5 and Chrome.
+ * 2. Addresses `box-sizing` set to `border-box` in Safari 5 and Chrome
+ * (include `-moz` to future-proof).
+ */
+
+input[type="search"] {
+ -webkit-appearance: textfield; /* 1 */
+ -moz-box-sizing: content-box;
+ -webkit-box-sizing: content-box; /* 2 */
+ box-sizing: content-box;
+}
+
+/*
+ * Removes inner padding and search cancel button in Safari 5 and Chrome
+ * on OS X.
+ */
+
+input[type="search"]::-webkit-search-cancel-button,
+input[type="search"]::-webkit-search-decoration {
+ -webkit-appearance: none;
+}
+
+/*
+ * Removes inner padding and border in Firefox 4+.
+ */
+
+button::-moz-focus-inner,
+input::-moz-focus-inner {
+ border: 0;
+ padding: 0;
+}
+
+/*
+ * 1. Removes default vertical scrollbar in IE 8/9.
+ * 2. Improves readability and alignment in all browsers.
+ */
+
+textarea {
+ overflow: auto; /* 1 */
+ vertical-align: top; /* 2 */
+}
+
+/* ==========================================================================
+ Tables
+ ========================================================================== */
+
+/*
+ * Remove most spacing between table cells.
+ */
+
+table {
+ border-collapse: collapse;
+ border-spacing: 0;
+}
57 src/css/_print.css
@@ -0,0 +1,57 @@
+/* ==========================================================================
+ Print styles.
+ ========================================================================== */
+
+@media print {
+ * {
+ background: transparent !important;
+ color: #000 !important; /* Black prints faster: h5bp.com/s */
+ box-shadow:none !important;
+ text-shadow: none !important;
+ }
+
+ a,
+ a:visited {
+ text-decoration: underline;
+ }
+
+ pre,
+ blockquote {
+ border: 1px solid #999;
+ page-break-inside: avoid;
+ }
+
+ thead {
+ display: table-header-group; /* h5bp.com/t */
+ }
+
+ tr,
+ img {
+ page-break-inside: avoid;
+ }
+
+ img {
+ max-width: 100% !important;
+ }
+
+ .flex-embed,
+ iframe {
+ display: none;
+ }
+
+ .site-promo {
+ margin-bottom: 0;
+ }
+
+ p,
+ h2,
+ h3 {
+ orphans: 3;
+ widows: 3;
+ }
+
+ h2,
+ h3 {
+ page-break-after: avoid;
+ }
+}
102 src/css/_site.css
@@ -0,0 +1,102 @@
+/* ==========================================================================
+ Major site components
+ ========================================================================== */
+
+/**
+ * Site header
+ */
+
+.site-header {
+ padding-top: 30px;
+}
+
+/* Site logo */
+
+.site-logo {
+ float: left;
+ color: #fff;
+ font-weight: bold;
+ font-size: 24px;
+ line-height: 32px;
+ text-decoration: none;
+ text-transform: uppercase;
+ text-shadow: 2px 2px 0 #000;
+}
+
+/* Site nav */
+
+.site-nav {
+ float: right;
+ padding: 0;
+ margin: 7px 0 0;
+ list-style: none;
+}
+
+.site-nav a {
+ display: block;
+ color: #e08524;
+ text-decoration: none;
+ text-transform: uppercase;
+}
+
+.site-nav a:hover,
+.site-nav a:focus,
+.site-nav a:active {
+ color: #fff;
+}
+
+/**
+ * Site promo
+ */
+
+.site-promo {
+ padding: 3em 0;
+}
+
+.site-promo .description {
+ margin: 1em 2em 0;
+ font-size: 1.25em;
+ color: #ddd;
+}
+
+.last-update {
+ display: block;
+ margin-top: 10px;
+ color: #999;
+ font-size: 0.75em;
+}
+
+/**
+ * Support content
+ */
+
+.site-content {
+ overflow: hidden;
+ padding: 1em 0 5em;
+ color: #333;
+ background: #fff;
+}
+
+.in-the-wild {
+ max-width: 500px;
+ margin: 0 auto;
+ font-size: 1.25em;
+ font-weight: bold;
+}
+
+/**
+ * Site footer
+ */
+
+.site-footer {
+ padding: 2em 0;
+ font-size: 0.875em;
+}
+
+.site-footer .container {
+ max-width: 500px;
+}
+
+.site-footer a {
+ color: #e08524;
+}
106 src/css/_utils.css
@@ -0,0 +1,106 @@
+/* ==========================================================================
+ Utilities
+ ========================================================================== */
+
+/**
+ * Grid
+ */
+
+.grid {
+ margin: 0 -15px;
+ /* Remove inter-unit whitespace for all non-monospace font-families */
+ letter-spacing: -0.31em;
+ word-spacing: -0.43em;
+ /* Protect against WebKit bug with optimizelegibility */
+ text-rendering: optimizespeed;
+}
+
+.grid-cell {
+ display: inline-block;
+ vertical-align: top;
+ width: 50%;
+ letter-spacing: normal;
+ word-spacing: normal;
+ text-align: left;
+ text-rendering: auto;
+}
+
+.grid-cell > * {
+ padding: 0 15px;
+}
+
+/**
+ * Inline-block list items
+ */
+
+.inline-block-list {
+ padding: 0;
+ margin: 0;
+ list-style: none;
+}
+
+.inline-block-list li {
+ display: inline-block;
+ padding: 0;
+ margin: 0 0 0 1.5em;
+ vertical-align: top;
+}
+
+.inline-block-list li:first-child {
+ margin-left: 0;
+}
+
+/**
+ * Icons
+ */
+
+.icon {
+ position: relative;
+ top: 5px;
+ float: left;
+ margin-right: 5px;
+}
+
+/**
+ * Flexible multi-media embeds
+ */
+
+.flex-embed {
+ position: relative;
+ height: 0;
+ overflow: hidden;
+ padding-bottom: 56.25%
+}
+
+.flex-embed iframe,
+.flex-embed embed,
+.flex-embed object {
+ position: absolute;
+ left: 0;
+ top: 0;
+ width: 100%;
+ height: 100%;
+}
+
+/**
+ * Clearfix helper
+ */
+
+.cf:before,
+.cf:after {
+ content: " ";
+ display: table;
+}
+
+.cf:after {
+ clear: both;
+}
+
+/*
+ * For IE 6/7 only
+ * Include this rule to trigger hasLayout and contain floats.
+ */
+
+.clearfix {
+ *zoom: 1;
+}
11 src/css/main.css
@@ -0,0 +1,11 @@
+/**
+ * html5boilerplate.com
+ */
+
+@import "_normalize.css";
+@import "_base.css";
+@import "_utils.css";
+@import "_components.css";
+@import "_site.css";
+@import "_mq.css";
+@import "_print.css";
BIN  src/favicon.ico
Binary file not shown
22 src/humans.txt
@@ -0,0 +1,22 @@
+# humanstxt.org/
+# The humans responsible & technology colophon
+
+# TEAM
+
+ Nicolas Gallagher -- @necolas
+ Paul Irish -- @paul_irish
+ Divya Manian -- @divya
+ Mathias Bynens -- @mathias
+ Hans Christian Reinl -- @drublic
+
+# THANKS
+
+ Mickael Daniel -- @mklabs
+ Catalin Maris -- @alrra
+
+# TECHNOLOGY COLOPHON
+
+ HTML5, CSS3
+ Normalize.css, HTML5 Boilerplate, Grunt
+
+ Source: https://github.com/h5bp/html5boilerplate.com
147 src/index.html
@@ -0,0 +1,147 @@
+<!DOCTYPE html>
+<html lang="en-us">
+ <head>
+ <meta charset="utf-8">
+ <title>Mobile Boilerplate: A best practice baseline for your mobile web app</title>
+ <meta name="description" content="Mobile Boilerplate is a professional front-end template that helps you build fast and robust mobile web applications. Spend more time developing and less time reinventing the wheel.">
+ <meta name="viewport" content="width=device-width">
+ <link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Open+Sans:400,700">
+ <link rel="stylesheet" href="css/main.css">
+ <script src="js/html5.js"></script>
+ </head>
+ <body>
+
+ <div class="container">
+ <header class="site-header cf" role="banner">
+ <div class="site-logo">
+ Mobile <span class="star">&#x2605;</span> Boilerplate
+ </div>
+ <ul class="site-nav inline-block-list">
+ <li><a href="https://github.com/h5bp/mobile-boilerplate"
+ data-ga-category="Outbound links"
+ data-ga-action="Nav click"
+ data-ga-label="Source code">Source code</a></li>
+ <li><a href="https://github.com/h5bp/mobile-boilerplate/blob/master/doc/README.md"
+ data-ga-category="Outbound links"
+ data-ga-action="Nav click"
+ data-ga-label="Docs">Docs</a></li><!-- change 'master' to 'v4.0.0' -->
+ <li><a href="http://h5bp.github.com"
+ data-ga-category="Outbound links"
+ data-ga-action="Nav click"
+ data-ga-label="Other projects">Other projects</a></li>
+ </ul>
+ </header><!-- end site-header -->
+
+ <div class="site-promo">
+ <h1>A best practice baseline for your mobile web app</h1>
+ <p class="description">Mobile Boilerplate helps you create <strong>rich</strong>, <strong>performant</strong>, and <strong>modern</strong> mobile web apps. Kick-start your project with dozens of mobile optimizations and helpers.</p>
+
+ <div class="cta-option">
+ <a class="btn-download"
+ href="https://github.com/h5bp/mobile-boilerplate/zipball/v3.0"
+ data-ga-category="Download"
+ data-ga-action="Download - top"
+ data-ga-label="v3.0">
+ <strong>Download</strong>
+ <span class="version">v3.0</span>
+ </a>
+ <a class="last-update" href="https://github.com/h5bp/mobile-boilerplate/tree/master/CHANGELOG.md">Released on February 5, 2012</a><!-- change 'master' to 'v4.0.0' -->
+ </div>
+ </div><!-- end site-promo -->
+ </div>
+
+ <div class="site-content">
+ <div class="container">
+ <h2>A mobile-focused app template.</h2>
+
+ <div class="grid">
+ <div class="grid-cell">
+ <h3><span class="star">&#x2605;</span> Analytics, icons, and more</h3>
+ <p>A lean, mobile-friendly HTML template; optimized Google Analytics snippet; placeholder touch-device icons; and several mobile-focused tools and helpers.</p>
+ </div>
+
+ <div class="grid-cell">
+ <h3><span class="star">&#x2605;</span> Normalize.css and helpers</h3>
+ <p>Includes <a href="http://necolas.github.com/normalize.css/">Normalize.css</a> v2.0.x &mdash; a modern, HTML5-ready alternative to CSS resets &mdash; and further base styles, utilities, and media queries.</p>
+ </div>
+
+ <div class="grid-cell">
+ <h3><span class="star">&#x2605;</span> Zepto and Modernizr</h3>
+ <p>Get the latest minified versions of <a href="http://zeptojs.com/">Zepto</a> (a minimalist jQuery-like library for modern browsers) and the <a href="http://modernizr.com/">Modernizr</a> feature detection library.</p>
+ </div>
+
+ <div class="grid-cell">
+ <h3><span class="star">&#x2605;</span> High performance</h3>
+ <p>Apache settings to help you deliver excellent site performance. We independently maintain <a href="https://github.com/h5bp/server-configs">other server configs</a>, a <a href="https://github.com/h5bp/node-build-script">node build script</a>, and an <a href="https://github.com/h5bp/ant-build-script">ant build script</a>.</p>
+ </div>
+ </div>
+
+ </div>
+ </div>
+
+ <aside class="aside">
+ <div class="container">
+ <ul class="inline-block-list">
+ <li><a href="https://github.com/h5bp/mobile-boilerplate/issues"
+ data-ga-category="Outbound links"
+ data-ga-action="Footer click"
+ data-ga-label="Report issues">
+ <img class="icon" src="http://www.google.com/s2/favicons?domain=github.com" alt="">
+ Report issues
+ </a></li>
+ <li><a href="https://github.com/h5bp/mobile-boilerplate/wiki"
+ data-ga-category="Outbound links"
+ data-ga-action="Footer click"
+ data-ga-label="Read the wiki">
+ <img class="icon" src="http://www.google.com/s2/favicons?domain=github.com" alt="">
+ Read the wiki
+ </a></li>
+ <li><a href="http://stackoverflow.com/questions/tagged/mobile"
+ data-ga-category="Outbound links"
+ data-ga-action="Footer click"
+ data-ga-label="Help on Stack Overflow">
+ <img class="icon" src="http://www.google.com/s2/favicons?domain=stackoverflow.com" alt="">
+ Help on Stack Overflow
+ </a></li>
+ </ul>
+ </div>
+ </aside><!-- end aside -->
+
+ <footer class="site-footer" role="contentinfo">
+ <div class="container">
+ <p>
+ <a class="twitter-share-button"
+ href="https://twitter.com/share"
+ data-count="none"
+ data-lang="en"
+ data-via="h5bp"
+ data-size="large"
+ data-text="HTML5 Boilerplate: The rock-solid professional front-end template"
+ data-url="http://html5boilerplate.com">Tweet</a>
+ &nbsp;
+ <a class="twitter-follow-button"
+ href="https://twitter.com/h5bp"
+ data-show-count="false"
+ data-lang="en"
+ data-size="large">Follow @h5bp</a>
+ </p>
+
+ A project from <a href="https://github.com/h5bp">H5BP</a> currently maintained by <a href="http://alxgbsn.co.uk/">Alex Gibson</a>, <a href="http://nicolasgallagher.com/">Nicolas Gallagher</a>, and <a href="http://www.blog.highub.com/">Shi Chuan</a>.
+ </div>
+ </footer><!-- end site-footer -->
+
+ <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
+ <script src="js/main.js"></script>
+
+ <script>
+ // Twitter widgets
+ !function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src='http://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document,'script','twitter-wjs');
+
+ // Google Analytics
+ var _gaq=[['_setAccount','UA-17904194-4'],['_trackPageview']];
+ (function(d,t){var g=d.createElement(t),s=d.getElementsByTagName(t)[0];
+ g.src=('https:'==location.protocol?'//ssl':'//www')+'.google-analytics.com/ga.js';
+ s.parentNode.insertBefore(g,s)}(document,'script'));
+ </script>
+ </body>
+</html>
6 src/js/html5.js
@@ -0,0 +1,6 @@
+/*! HTML5 Shiv v3.6.1 | @afarkas @jdalton @jon_neal @rem | MIT/GPL2 Licensed */
+(function(l,f){function m(){var a=e.elements;return"string"==typeof a?a.split(" "):a}function i(a){var b=n[a[o]];b||(b={},h++,a[o]=h,n[h]=b);return b}function p(a,b,c){b||(b=f);if(g)return b.createElement(a);c||(c=i(b));b=c.cache[a]?c.cache[a].cloneNode():r.test(a)?(c.cache[a]=c.createElem(a)).cloneNode():c.createElem(a);return b.canHaveChildren&&!s.test(a)?c.frag.appendChild(b):b}function t(a,b){if(!b.cache)b.cache={},b.createElem=a.createElement,b.createFrag=a.createDocumentFragment,b.frag=b.createFrag();
+a.createElement=function(c){return!e.shivMethods?b.createElem(c):p(c,a,b)};a.createDocumentFragment=Function("h,f","return function(){var n=f.cloneNode(),c=n.createElement;h.shivMethods&&("+m().join().replace(/\w+/g,function(a){b.createElem(a);b.frag.createElement(a);return'c("'+a+'")'})+");return n}")(e,b.frag)}function q(a){a||(a=f);var b=i(a);if(e.shivCSS&&!j&&!b.hasCSS){var c,d=a;c=d.createElement("p");d=d.getElementsByTagName("head")[0]||d.documentElement;c.innerHTML="x<style>article,aside,figcaption,figure,footer,header,hgroup,nav,section{display:block}mark{background:#FF0;color:#000}</style>";
+c=d.insertBefore(c.lastChild,d.firstChild);b.hasCSS=!!c}g||t(a,b);return a}var k=l.html5||{},s=/^<|^(?:button|map|select|textarea|object|iframe|option|optgroup)$/i,r=/^(?: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,j,o="_html5shiv",h=0,n={},g;(function(){try{var a=f.createElement("a");a.innerHTML="<xyz></xyz>";j="hidden"in a;var b;if(!(b=1==a.childNodes.length)){f.createElement("a");var c=f.createDocumentFragment();b="undefined"==typeof c.cloneNode||
+"undefined"==typeof c.createDocumentFragment||"undefined"==typeof c.createElement}g=b}catch(d){g=j=!0}})();var e={elements:k.elements||"abbr article aside audio bdi canvas data datalist details figcaption figure footer header hgroup mark meter nav output progress section summary time video",shivCSS:!1!==k.shivCSS,supportsUnknownElements:g,shivMethods:!1!==k.shivMethods,type:"default",shivDocument:q,createElement:p,createDocumentFragment:function(a,b){a||(a=f);if(g)return a.createDocumentFragment();
+for(var b=b||i(a),c=b.frag.cloneNode(),d=0,e=m(),h=e.length;d<h;d++)c.createElement(e[d]);return c}};l.html5=e;q(f)})(this,document);
53 src/js/main.js
@@ -0,0 +1,53 @@
+var H5BP = H5BP || {};
+
+// Google Analytics event tracking
+
+H5BP.track = (function () {
+ $(function () {
+ H5BP.track.init();
+ });
+
+ function _init() {
+ var $rootEl = $('body');
+
+ $rootEl.on('click', '[data-ga-category]', function (e) {
+ var $target = $(e.currentTarget);
+ var category = $target.attr('data-ga-category') || undefined; // required
+ var action = $target.attr('data-ga-action') || undefined; // required
+ var label = $target.attr('data-ga-label') || undefined;
+ var value = parseInt($target.attr('data-ga-value'), 10) || undefined;
+
+ if (category && action) {
+ _event(category, action, label, value);
+ }
+ });
+ }
+
+ function _event(category, action, label, value) {
+ //console.log(category + " | " + action + " | " + label + " | " + value);
+ if (_gaq) {
+ _gaq.push(['_trackEvent', category, action, label, value]);
+ }
+ }
+
+ function _social(network, action, target) {
+ //console.log(network + " | " + action + " | " + target);
+ if (_gaq) {
+ _gaq.push(['_trackSocial', network, action, target]);
+ }
+ }
+
+ function _page(url) {
+ //console.log(url);
+ if (_gaq) {
+ _gaq.push('_trackPageview', url);
+ }
+ }
+
+ return {
+ init : _init,
+ event : _event,
+ social : _social,
+ page : _page
+ };
+}());
3  src/robots.txt
@@ -0,0 +1,3 @@
+# robotstxt.org/
+
+User-agent: *
26 tasks/clean.js
@@ -0,0 +1,26 @@
+/**
+ * Task: clean
+ * Description: Remove the 'dist' directory
+ * Dependencies: rimraf
+ */
+
+module.exports = function(grunt) {
+ 'use strict';
+
+ grunt.registerTask('clean', 'Clean "dist" directory', function() {
+ grunt.helper('clean', grunt.config('dir.dest'));
+ });
+
+ grunt.registerHelper('clean', function(path) {
+ grunt.log.write('Cleaning "' + path + '"...');
+
+ try {
+ require('rimraf').sync(path);
+ grunt.log.ok();
+ } catch (e) {
+ grunt.log.error();
+ grunt.verbose.error(e);
+ grunt.fail.warn('Clean operation failed.');
+ }
+ });
+};
22 tasks/copy.js
@@ -0,0 +1,22 @@
+/**
+ * Task: copy
+ * Description: Copy 'src' to 'dist'
+ */
+
+module.exports = function(grunt) {
+ 'use strict';
+
+ grunt.registerTask('copy', function() {
+ var fs = require('fs');
+ var path = require('path');
+ var srcDir = grunt.template.process(grunt.config('dir.src'));
+ var destDir = grunt.template.process(grunt.config('dir.dest'));
+
+ grunt.log.write('Copying file(s) from ' + srcDir + ' to ' + destDir + '...');
+ // Recursively copy the files in 'src' directory
+ grunt.file.recurse(srcDir, function(absDir, rootDir, subDir, filename) {
+ grunt.file.copy(absDir, path.join(destDir, subDir, filename));
+ });
+ grunt.log.ok();
+ });
+};
37 tasks/mincss.js
@@ -0,0 +1,37 @@
+/**
+ * Task: mincss
+ * Description: Minify CSS files
+ * Dependencies: clean-css
+ */
+
+module.exports = function(grunt) {
+ 'use strict';
+
+ grunt.registerMultiTask('mincss', 'Minify CSS files', function() {
+ var srcFiles = [];
+ var destFile = grunt.template.process(this.target);
+
+ this.data.forEach(function(file) {
+ file = grunt.template.process(file);
+ srcFiles.push(grunt.file.expandFiles(file));
+ });
+
+ var sourceCode = grunt.helper('concat', srcFiles);
+ var taskOutput = grunt.helper('mincss', sourceCode);
+
+ if (taskOutput.length > 0) {
+ grunt.file.write(destFile, taskOutput);
+ grunt.log.writeln('File "' + destFile + '" created.');
+ grunt.helper('min_max_info', taskOutput, sourceCode);
+ }
+ });
+
+ grunt.registerHelper('mincss', function(source) {
+ try {
+ return require('clean-css').process(source);
+ } catch (e) {
+ grunt.log.error(e);
+ grunt.fail.warn('CSS minification failed.');
+ }
+ });
+};
46 tasks/usemin.js
@@ -0,0 +1,46 @@
+/**
+ * Task: usemin
+ * Description: Reference the minified CSS/JS in the HTML
+ */
+
+module.exports = function(grunt) {
+ 'use strict';
+
+ var fs = require('fs');
+ var path = require('path');
+ var crypto = require('crypto');
+
+ grunt.registerTask('usemin', 'Version the minified CSS/JS and reference it in the HTML', function() {
+ var destDir = grunt.config('dir.dest');
+ var destHtml = path.join(destDir, 'index.html');
+ var destCss = path.join(destDir, 'css/main.min.css');
+ var destJs = path.join(destDir, 'js/main.min.js');
+
+ // Hash and rename the CSS
+ var hashCss = grunt.helper('md5', destCss);
+ var newCssName = 'css/main-' + hashCss + '.min.css';
+ fs.renameSync(destCss, path.join(destDir, newCssName));
+
+ // Hash and rename the JS
+ var hashJs = grunt.helper('md5', destJs);
+ var newJsName = 'js/main-' + hashJs + '.min.js';
+ fs.renameSync(destJs, path.join(destDir, newJsName));
+
+ // Convert the HTML to use the new file names
+ var content = grunt.file.read(destHtml);
+ content = content.replace('href="css/main.css"', 'href="' + newCssName + '"');
+ content = content.replace('src="js/main.js"', 'src="' + newJsName + '"');
+ grunt.file.write(destHtml, content);
+ grunt.log.writeln('File "' + destHtml + '" updated to use minified and versioned CSS/JS.');
+ });
+
+ /**
+ * The 'md5' helper is a basic wrapper around crypto.createHash
+ */
+ grunt.registerHelper('md5', function(filepath) {
+ var hash = crypto.createHash('md5');
+ hash.update(fs.readFileSync(filepath));
+ grunt.log.write('Hashing ' + filepath + '...').ok();
+ return hash.digest('hex');
+ });
+};
Please sign in to comment.
Something went wrong with that request. Please try again.