├── src ├── data │ └── README ├── styl │ ├── thing.styl │ ├── qz │ │ ├── buttons.styl │ │ ├── share.styl │ │ ├── colors.styl │ │ ├── dropdowns.styl │ │ ├── icons.styl │ │ ├── chart-elements.styl │ │ └── type.styl │ ├── main.styl │ ├── layout.styl │ ├── responsive.styl │ └── normalize.styl ├── jade │ ├── thing.jade │ ├── includes │ │ └── share.jade │ ├── comments.html │ └── index.jade ├── fonts │ ├── qz-icons.eot │ ├── qz-icons.ttf │ ├── qz-icons.woff │ ├── Calibre-Medium.otf │ ├── PTSerif │ │ ├── PTF55F.ttf │ │ ├── PTF56F.ttf │ │ ├── PTF55F-webfont.eot │ │ ├── PTF55F-webfont.ttf │ │ ├── PTF55F-webfont.woff │ │ ├── Paratype PT Sans Free Font License.txt │ │ └── PTF55F-webfont.svg │ ├── PT_Serif-Web-Bold.ttf │ ├── AdelleSansWeb │ │ ├── AdelleSans_Light.otf │ │ ├── AdelleSansBasic_Bold.eot │ │ ├── AdelleSansBasic_Bold.ttf │ │ ├── AdelleSansBasic_Bold.woff │ │ ├── AdelleSansBasic_Light.eot │ │ ├── AdelleSansBasic_Light.ttf │ │ ├── AdelleSansBasic_Light.woff │ │ ├── AdelleSansBasic_Regular.eot │ │ ├── AdelleSansBasic_Regular.ttf │ │ └── AdelleSansBasic_Regular.woff │ ├── qz-icons.svg │ └── qz-icons.json ├── assets │ └── selecticon.gif ├── README.md └── js │ ├── thing.js │ ├── main.js │ ├── throttle.js │ ├── detectFeatures.js │ ├── fm.js │ ├── share.js │ └── libs │ └── frameMessager.min.js ├── .gitignore ├── gulp ├── cli.js ├── utils.js └── config.js ├── content.json ├── package.json ├── __build.sh └── gulpfile.js /src/data/README: -------------------------------------------------------------------------------- 1 | Put your data in this directory 2 | -------------------------------------------------------------------------------- /src/styl/thing.styl: -------------------------------------------------------------------------------- 1 | // Interactive-specific css here 2 | 3 | -------------------------------------------------------------------------------- /src/jade/thing.jade: -------------------------------------------------------------------------------- 1 | h2= hed 2 | h2= dek 3 | 4 | for item in items 5 | p!= item.copy -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | node_modules/* 2 | build 3 | !node_modules/stylus-normalize 4 | .DS_Store 5 | .tmp -------------------------------------------------------------------------------- /src/fonts/qz-icons.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/quartz/midwest-comments/master/src/fonts/qz-icons.eot -------------------------------------------------------------------------------- /src/fonts/qz-icons.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/quartz/midwest-comments/master/src/fonts/qz-icons.ttf -------------------------------------------------------------------------------- /src/fonts/qz-icons.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/quartz/midwest-comments/master/src/fonts/qz-icons.woff -------------------------------------------------------------------------------- /src/assets/selecticon.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/quartz/midwest-comments/master/src/assets/selecticon.gif -------------------------------------------------------------------------------- /src/fonts/Calibre-Medium.otf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/quartz/midwest-comments/master/src/fonts/Calibre-Medium.otf -------------------------------------------------------------------------------- /src/fonts/PTSerif/PTF55F.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/quartz/midwest-comments/master/src/fonts/PTSerif/PTF55F.ttf -------------------------------------------------------------------------------- /src/fonts/PTSerif/PTF56F.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/quartz/midwest-comments/master/src/fonts/PTSerif/PTF56F.ttf -------------------------------------------------------------------------------- /src/fonts/PT_Serif-Web-Bold.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/quartz/midwest-comments/master/src/fonts/PT_Serif-Web-Bold.ttf -------------------------------------------------------------------------------- /src/fonts/PTSerif/PTF55F-webfont.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/quartz/midwest-comments/master/src/fonts/PTSerif/PTF55F-webfont.eot -------------------------------------------------------------------------------- /src/fonts/PTSerif/PTF55F-webfont.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/quartz/midwest-comments/master/src/fonts/PTSerif/PTF55F-webfont.ttf -------------------------------------------------------------------------------- /src/fonts/PTSerif/PTF55F-webfont.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/quartz/midwest-comments/master/src/fonts/PTSerif/PTF55F-webfont.woff -------------------------------------------------------------------------------- /src/fonts/AdelleSansWeb/AdelleSans_Light.otf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/quartz/midwest-comments/master/src/fonts/AdelleSansWeb/AdelleSans_Light.otf -------------------------------------------------------------------------------- /src/README.md: -------------------------------------------------------------------------------- 1 | Static assets (images, data files, etc) can be placed in here and will be 2 | automatically moved to the build directory on `gulp build`. 3 | -------------------------------------------------------------------------------- /src/fonts/AdelleSansWeb/AdelleSansBasic_Bold.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/quartz/midwest-comments/master/src/fonts/AdelleSansWeb/AdelleSansBasic_Bold.eot -------------------------------------------------------------------------------- /src/fonts/AdelleSansWeb/AdelleSansBasic_Bold.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/quartz/midwest-comments/master/src/fonts/AdelleSansWeb/AdelleSansBasic_Bold.ttf -------------------------------------------------------------------------------- /src/fonts/AdelleSansWeb/AdelleSansBasic_Bold.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/quartz/midwest-comments/master/src/fonts/AdelleSansWeb/AdelleSansBasic_Bold.woff -------------------------------------------------------------------------------- /src/fonts/AdelleSansWeb/AdelleSansBasic_Light.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/quartz/midwest-comments/master/src/fonts/AdelleSansWeb/AdelleSansBasic_Light.eot -------------------------------------------------------------------------------- /src/fonts/AdelleSansWeb/AdelleSansBasic_Light.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/quartz/midwest-comments/master/src/fonts/AdelleSansWeb/AdelleSansBasic_Light.ttf -------------------------------------------------------------------------------- /src/fonts/AdelleSansWeb/AdelleSansBasic_Light.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/quartz/midwest-comments/master/src/fonts/AdelleSansWeb/AdelleSansBasic_Light.woff -------------------------------------------------------------------------------- /src/fonts/AdelleSansWeb/AdelleSansBasic_Regular.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/quartz/midwest-comments/master/src/fonts/AdelleSansWeb/AdelleSansBasic_Regular.eot -------------------------------------------------------------------------------- /src/fonts/AdelleSansWeb/AdelleSansBasic_Regular.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/quartz/midwest-comments/master/src/fonts/AdelleSansWeb/AdelleSansBasic_Regular.ttf -------------------------------------------------------------------------------- /src/fonts/AdelleSansWeb/AdelleSansBasic_Regular.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/quartz/midwest-comments/master/src/fonts/AdelleSansWeb/AdelleSansBasic_Regular.woff -------------------------------------------------------------------------------- /src/js/thing.js: -------------------------------------------------------------------------------- 1 | var fm = require('./fm'); 2 | var throttle = require('./throttle'); 3 | 4 | function resize() { 5 | fm.resize(); 6 | } 7 | 8 | var throttleResize = throttle(resize, 1000); 9 | 10 | $(document).ready(function () { 11 | resize() 12 | $(window).resize(throttleResize); 13 | window.setInterval(throttleResize, 1000); 14 | }); 15 | -------------------------------------------------------------------------------- /src/js/main.js: -------------------------------------------------------------------------------- 1 | // @if GULP_ENV='dev' 2 | // Load here modules that will be used for local development 3 | // but are included in 16 | 17 | -------------------------------------------------------------------------------- /src/js/detectFeatures.js: -------------------------------------------------------------------------------- 1 | module.exports = function () { 2 | var features = {}; 3 | 4 | features.hasDeviceMotion = 'ondevicemotion' in window; 5 | features.isAndroid = (/android/gi).test(navigator.appVersion); 6 | features.isIDevice = (/iphone|ipad/gi).test(navigator.appVersion); 7 | features.isTouchPad = (/hp-tablet/gi).test(navigator.appVersion); 8 | features.isKindle = (/silk/gi).test(navigator.appVersion); 9 | features.hasTouchEvents = ( 10 | features.isAndroid || 11 | features.isIDevice || 12 | features.isTouchPad || 13 | features.isKindle 14 | ); 15 | 16 | return features; 17 | }; 18 | -------------------------------------------------------------------------------- /gulp/utils.js: -------------------------------------------------------------------------------- 1 | var shellCmd; 2 | 3 | function generateShellCmd (buildArg, qzdataPath, thingName) { 4 | var baseCmd = './__build.sh ' + qzdataPath + ' ' + thingName + ' '; // then commit? push? 5 | switch (buildArg) { 6 | case 'move': 7 | shellCmd = baseCmd + 'false false'; 8 | break; 9 | case 'commit': 10 | shellCmd = baseCmd + 'true false'; 11 | break; 12 | case 'push': 13 | shellCmd = baseCmd + 'true true'; 14 | break; 15 | default: 16 | shellCmd = 'echo ""'; 17 | } 18 | 19 | return shellCmd; 20 | } 21 | 22 | module.exports = { 23 | generateShellCmd: generateShellCmd 24 | }; 25 | -------------------------------------------------------------------------------- /src/styl/main.styl: -------------------------------------------------------------------------------- 1 | // Normalize -- https://github.com/bymathias/normalize.styl 2 | @import 'normalize' 3 | 4 | // nib -- http://visionmedia.github.io/nib/ 5 | @import 'nib' 6 | 7 | // Qz modules. Comment out the things you don't need. 8 | @import 'qz/type' 9 | @import 'qz/colors' 10 | 11 | // Optional components. Uncomment if you need them. See wiki for usage info 12 | // note: `share` depends on `icons` 13 | //@import 'qz/icons' 14 | //@import 'qz/share' 15 | //@import 'qz/dropdowns' 16 | //@import 'qz/buttons' 17 | //@import 'qz/chart-elements' 18 | 19 | 20 | // Thing-specific css 21 | @import 'responsive' 22 | @import 'layout' 23 | @import 'thing' 24 | -------------------------------------------------------------------------------- /src/styl/qz/share.styl: -------------------------------------------------------------------------------- 1 | // Icon-related colors 2 | $color-twitter = #00aced 3 | $color-facebook = #3b5998 4 | $color-linkedin = #007bb6 5 | $color-email = #0096b6 6 | $color-icon-hover = #c3c5c0 7 | 8 | ul.share-buttons 9 | list-style-type none 10 | margin 0 11 | padding 0 12 | 13 | li.share-icon 14 | display inline-block 15 | font-size 1.2em 16 | a 17 | text-decoration none 18 | cursor pointer 19 | 20 | .icon-email 21 | color $color-email 22 | &:hover 23 | color $color-icon-hover 24 | 25 | .icon-facebook 26 | color $color-facebook 27 | &:hover 28 | color $color-icon-hover 29 | 30 | .icon-linkedin 31 | color $color-linkedin 32 | &:hover 33 | color $color-icon-hover 34 | 35 | .icon-twitter 36 | color $color-twitter 37 | &:hover 38 | color $color-icon-hover 39 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "midwest-comments", 3 | "version": "0.0.1", 4 | "description": "", 5 | "main": "index.js", 6 | "scripts": { 7 | "test": "echo \"Error: no test specified\" && exit 1" 8 | }, 9 | "author": "Nikhil Sonnad", 10 | "license": "ISC", 11 | "dependencies": {}, 12 | "devDependencies": { 13 | "archieml": "^0.3.1", 14 | "browser-sync": "^2.9.11", 15 | "browserify": "^12.0.1", 16 | "del": "^2.0.2", 17 | "gulp": "^3.6.2", 18 | "gulp-changed": "^1.3.0", 19 | "gulp-jade": "^1.1.0", 20 | "gulp-preprocess": "^1.2.0", 21 | "gulp-shell": "^0.2.5", 22 | "gulp-stylus": "^2.1.0", 23 | "nib": "^1.0.2", 24 | "nomnom": "^1.8.0", 25 | "request": "^2.65.0", 26 | "uglifyify": "^3.0.1", 27 | "vinyl-source-stream": "^1.1.0" 28 | } 29 | } 30 | -------------------------------------------------------------------------------- /src/styl/layout.styl: -------------------------------------------------------------------------------- 1 | // Page layout setup 2 | 3 | html, body 4 | min-width 270px 5 | font-family $qz-font-body 6 | color $qz-body-black 7 | background-color $qz-background-gray 8 | 9 | // @if GULP_ENV='dev' 10 | border $color-debug 11 | overflow scroll 12 | // @endif 13 | 14 | // @if GULP_ENV='prod' 15 | overflow hidden // dont scroll iframe 16 | // @endif 17 | 18 | h1, h2, h4, h5 19 | font-family $qz-sans-bold 20 | color $qz-header-black 21 | 22 | h1 23 | line-height 50px 24 | margin-bottom 10px 25 | 26 | h2 27 | font-size 24px 28 | line-height 24px 29 | font-style bold 30 | margin 40px 0px 31 | 32 | h3 33 | font-size 20px 34 | font-family $qz-serif 35 | color: $qz-header-black 36 | font-weight: bold; 37 | 38 | p 39 | position relative 40 | margin 0 0 0 0 41 | padding 16px 0 16px 0 42 | line-height 1.6 43 | color #4c4c4c 44 | 45 | .item-body 46 | margin 0 auto 47 | //max-width 940px 48 | 49 | #interactive-content 50 | width 100% 51 | margin-left auto 52 | margin-right auto 53 | -------------------------------------------------------------------------------- /__build.sh: -------------------------------------------------------------------------------- 1 | #!/bin/bash 2 | CURR_COMMIT=$(git log --oneline -n 1) 3 | 4 | printf '%s\n' "Copying built files to master repo" 5 | printf '%s\n' ------------------------- 6 | rsync -rtvu --delete ./build/* $1 7 | 8 | cd $1 9 | QZDATA_BRANCH=$(git rev-parse --abbrev-ref HEAD) 10 | 11 | if [[ "$3" = true ]]; then 12 | printf '%s\n' "Committing ${CURR_COMMIT} to origin:${QZDATA_BRANCH}" 13 | printf '%s\n' ------------------------- 14 | git add . 15 | git commit -m "built: ${2} | ${CURR_COMMIT}" 16 | fi 17 | 18 | if [[ "$4" = true ]]; then 19 | printf '%s\n' "Executing dry run of git push to origin:${QZDATA_BRANCH}" 20 | printf '%s\n' ------------------------- 21 | echo `git push --dry-run origin ${QZDATA_BRANCH}` 22 | printf '%s\n' "That was a dry run to origin:${QZDATA_BRANCH}. Actually push? (y/n)" 23 | 24 | read cont 11 | script(src='js/libs/frameMessager.min.js') 12 | 13 | 14 | body 15 | div.item-body 16 | div#interactive-content 17 | include comments.html 18 | 19 | // Include build-specific dependencies within the comment here, eg 20 | // script(src="../../js/lib/d3/qz.d3.v3.min.js") 21 | 22 | script(src='//ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js') 23 | script window.jQuery || document.write('