Skip to content

This collection of charts, built in collboration with the Graphics Editor, compares the demographics of all the finalist bids for Amazon's new headquarters. The charting is driven with sass and python. The only javascript used is for the toggle menu. This was a quick turnaround project with my editor, who collected the information but left it to…

Notifications You must be signed in to change notification settings

ryanbmarx/amazon-hq2-finalists

Repository files navigation

Amazon HQ2 locations handicapped

A Tarbell project that publishes to a P2P HTML Story.

Assumptions

Custom configuration

You should define the following keys in either the values worksheet of the Tarbell spreadsheet or the DEFAULT_CONTEXT setting in your tarbell_config.py:

  • p2p_slug
  • headline
  • seotitle
  • seodescription
  • keywords
  • byline

Note that these will clobber any values set in P2P each time the project is republished.

Building front-end assets

This blueprint creates configuration to use Grunt to build front-end assets.

When you create a new Tarbell project using this blueprint with tarbell newproject, you will be prompted about whether you want to use Sass to generate CSS and whether you want to use Browserify to bundle JavaScript from multiple files. Based on your input, the blueprint will generate a package.json and Gruntfile.js with the appropriate configuration.

After creating the project, run:

npm install

to install the build dependencies for our front-end assets.

When you run:

grunt

Grunt will compile sass/styles.scss into css/styles.css and bundle/minify js/src/app.js into js/app.min.js.

If you want to recompile as you develop, run:

grunt && grunt watch

This blueprint simply sets up the the build tools to generate styles.css and js/app.min.js, you'll have to explicitly update your templates to point to these generated files. The reason for this is to make you think about whether you're actually going to use an external CSS or JavaScript file and avoid a request for an empty file if you don't end up putting anything in your custom stylesheet or JavaScript file.

To add app.min.js to your template file:

<script src="js/app.min.js"></script>

About

This collection of charts, built in collboration with the Graphics Editor, compares the demographics of all the finalist bids for Amazon's new headquarters. The charting is driven with sass and python. The only javascript used is for the toggle menu. This was a quick turnaround project with my editor, who collected the information but left it to…

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published