Dark Rainbow¶

The default Engineer theme, Dark Rainbow has also been called ‘Voldemort’s Skittles,’ ‘Unicorn Vomit,’ and other names not fit to repeat here. Needless to say, the parade of colors isn’t for everyone. That said, Dark Rainbow showcases several of the key features Engineer provides, including customizable navigation with contextual highlighting, LESS support, TypeKit and JQuery integration, and Foundation CSS-based layouts.

Dark Rainbow was created by Tyler Butler and is available under a Creative Commons Attribution-ShareAlike 3.0 Unported License.

Note

By default Dark Rainbow uses several fonts available at TypeKit. These fonts are available as part of TypeKit’s trial plan.

Settings¶

Dark Rainbow supports the following settings which can be configured using the THEME_SETTINGS setting.

comments (string)

Set this setting to either disqus or intensedebate to enable comments on your site. Comments are off by default. Disqus or Instense Debate are supported comment systems. Be sure to also set the comments_account setting properly as well.

comments_account (string)

Both Disqus and Intense Debate require an account ID in order to associate comments properly with your site. Set this setting to the account ID for your respective comment account.

simple_search (bool)

A boolean indicating whether simple search should be enabled for the site. Defaults to True.

Note that if you have customized your sidebar, you must include the _search.html snippet in your sidebar file or the search box will not be visible. See Snippets for more information.

New in version 0.4.0.

sharing

A group of settings that control whether Facebook/Twitter share buttons are displayed on posts. enabled (bool)

Turns the sharing buttons on or off completely. Defaults to False.

facebook

enabled (bool): Turns the Facebook sharing button on or off. Defaults to False.
app_id (string): In order to share on Facebook, you must have a developer app ID specified here.

twitter

enabled (bool): Turns the Twitter sharing button on or off. Defaults to False.
username (string): If supplied, the Twitter share dialog will prepopulate your username in the tweet suggestion.

New in version 0.6.0.

typekit_id (string)

The ID of the TypeKit kit that should be used. Dark Rainbow uses specific fonts that should be included in the kit.

twitter_id (string)

The username of the Twitter user whose feed should be shown in the sidebar. Defaults to tylerbutler if not provided.

Deprecated since version 0.5.0: This setting is obsolete and ignored. The Tweet library has been removed from Engineer. See the Release Notes for more information.

tweet_count (int)

The number of tweets to include in the Twitter sidebar. Defaults to 4 if not provided.

Deprecated since version 0.5.0: This setting is obsolete and ignored. The Tweet library has been removed from Engineer. See the Release Notes for more information.

Fonts¶

Dark Rainbow requires the following fonts:

Changed in version 0.4.0: The Anonymous monospace font has been replaced by Ubuntu Mono by default. If you are using TypeKit you’ll need to update your kit to include the Ubuntu Mono font. If you wish to continue using Anonymous you’ll need to add your own CSS stylesheet.

Templates¶

Required Templates and Fragments¶

No templates are strictly required for this theme beyond the base Template Fragments that all Engineer sites will likely want to provide. In particular, users of the Dark Rainbow theme will probably want to create _sidebar.html and _primary_nav.html templates.

Inheritable Templates¶

Dark Rainbow includes several base templates that sites can inherit from to create Template Pages.

template_page_simple.html: A simple template page layout that includes the default site sidebar.
template_page_no_sidebar.html: A simple template page layout that removes the default site sidebar, devoting the entire page to the template page content.

Template Fragments¶

Dark Rainbow does not support any additional Template Fragments beyond those available for all Engineer sites.

Snippets¶

Dark Rainbow provides some small snippets that can be included in the sidebar of your site. These snippets are designed to be used in the sidebar, so using them is as simple as including them in your site’s _sidebar.html template fragment. In order to maintain maximum compatibility with themes that might not provide these same widgets, you should specify ignore missing on the include directive.

For example, the Engineer sample site includes these widgets like so:

<section>
    <p>Welcome to the Engineer sample site.</p>
    <hr/>
    <nav>
        <ul>
            <li><a href="{{ urlname('about') }}">about</a></li>
            <li><a href="{{ urlname('themes') }}">themes</a></li>
        </ul>
    </nav>
</section>

{% include 'snippets/_search.html' ignore missing %}
{% include 'snippets/_feed_links.html' ignore missing %}

The following snippets are available:

snippets/_feed_links.html: Adds a link to your RSS feed.
snippets/_search.html: Adds a search box to your site sidebar.

Manifest¶

name: 'Dark Rainbow'
id: 'dark_rainbow'
description: 'A dark theme with just a hint of color.'
author: 'Tyler Butler <tyler@tylerbutler.com>'
website: 'http://tylerbutler.com'
license: 'Creative Commons BY-SA 3.0'
use_precompiled_styles: no

template_dirs:
  - '../_shared/templates/'

copy_content:
  - ['../_shared/images/rss/37.png', 'images/rss.png']

settings:
  typekit_id: ~
  comments: ~
  comments_account: ~
  simple_search: yes
  bigfoot:
    enabled: yes
  sharing:
    enabled: no
    facebook:
      enabled: no
      app_id: ~
    twitter:
      enabled: no
      username: ~