A prototyping framework for Middleman in active development. Currently using Bootstrap 3 and jQuery, but this will likely change.
- Basic homepage template and navigation system
- Contact Us form template with thank you page
- Environment-based project configuration
- SassDoc support
- Prototype transactional emails with
send_email()helper and mailcatcher
validateto your form and adding the class
requiredto each required field. Support for
type=emailis built-in thanks to the jQuery Validation Plugin
This is a middleman template that can be installed in your middleman project templates directory. First install middleman as a Ruby gem.
gem install middleman
Then clone the repository into your templates folder.
git clone firstname.lastname@example.org:timknight/middleman-ethos.git ~/.middleman/middleman-ethos
Create a new project using Ethos
middleman init [PROJECTNAME] -T middleman-ethos
Project information is found in /data/config.yml. The YAML file supports multi-environment configuration by adding the values within keys for "development" and "build". A custom site helper is available called
project_setting which takes the YAML key value as either a string or a symbol:
Each page takes advantage of some basic frontmatter that's built into Middleman. Pages support the following frontmatter:
--- title: nav: subnav: description: ---
title: is prepended into the page title
nav: used to determine the current page's primary navigation state
subnav: used to determine the current page's secondary navigation state
description: used to create a description meta tag for that page
Mailcatcher Support and Email Prototyping
Support for Mailcatcher is built in for the development mode only. This allows for prototyping transactional emails. To get started, make sure to install the mailcatcher gem and that it is running.
gem install mailcatcher
/contact/thankyou.html.erbfor an example of using the
send_email([template], [subject: Subject Line (optional)], [to: email@example.com (optional)]
- Host configuration, from, and to addresses are configured in the
- Mailer templates should be located in
/mailers/and do not support ERB.
Pesticide has been built into the CSS. To turn on Pesticide debugging edit
/utilities/_variables.css and change
$pesticide-debug to true.
Generate documentation with SassDoc using
sassdoc source/assets/stylesheets/ docs/. Precompiled documentation can be found within the
docs folder. Alternatively you can generate using
Currently I'm using Bootstrap here, but my plan is to move further away from Bootstrap while creating more of a OOCSS model and using Neat or Susy for the grid system. Stay tuned for continued updates.