Technical Documentation

#Index page

Source

index.html sources the landing page of the site, pulling in chapters.html from the _includes folder.

#Chapter pages

##Source

The chapter markdown files are included in _posts following the post.html template in _layouts. _layouts/post.html extends _layouts/default.html. _layouts/default.html includes liquid templating cues for the posts pages; this is done in order to work on a higher level with the grid system.

In _layouts/default.html, the posts pages are assigned a side menu (from _includes/sidemenu.html, and _includes/browsechapters.html is drawn into the posts pages.

Menu of Chapter Headings

This menu is created with the YAML front-matter item "nav", which occurs on all of the post markdown files in the _posts/ folder. When a new heading in the menu is desired, the heading must be added to the "nav" front-matter list in following the format of the other headings. Jekyll automatically creates ID's on <h2> elements, which consist of the exact heading text separated by hyphens. Thus ##Content Summary becomes <h2 id="content-summary">Content Summary<h2>.

#Slides page The slides page includes all of the slide presentations that accompany the Responsible Data Handbook. The source file is in pages/slides.html. It draws in _includes/slides.md, _includes/slidegrid.html. slides.html extends default.html, which, like post.html includes a templating rule that catches the slides page and inserts the side menu, _includes/sideslides.html.

#SASS structure ##sass/_bootstrap.scss The bootstrap grid is at work on the site. The bootstrap library has been pulled in selectively; see the _boostrap.scss file.

##sass/_base.scss This file contains font assignment and styling of most basic, general elements.

##assets/css/main.csss This file contains primarily media query sizing assignment. It imports all of the _sass/*.scss files.

##sass/_layout.scss This file contains all custom styling for the site, broken down by section and including media queries.

##sass/_syntaxhighlighting.scss This file highlights various markdown rules. It's inherited by the original jekyll theme, and though it's not at use anywhere on the site, it's retained in case it's functionality is desired in the future.

#Javascript The site should function according to progressive enhancement, with little-to-no feature loss when the site is run with no javascript. However, the mobile chapter menu and the mobile menu are lost without javascript; this is because they are built to emulate the menu on the existing responsibledata.io website. Both menus are triggered on click; but again, this is only an issue on mobile.

All javascript in assets/js/application.js is pretty straightforward. It (1) deals with mobile menu functionality (2) creates a static side menu on scroll on chapter pages and (3) Places the stylistic ** on either side of bold text throughout the chapter pages, per the design.