Efficient, semantic, CSS-only form elements
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
source
.gitignore
Gemfile
Gemfile.lock
README.md
Rakefile
config.rb

README.md

FormFactor.io

An experiment to generate CSS-only form elements that meet the following criteria:

  • Are user-friendly
  • Use only input and label elements (no divs or spans)
  • Are HTML5-compliant
  • Use minimal CSS
  • Are accessible

Demo

FormFactor.io

Middleman

This repo is for the site itself. It uses Middleman as its static site generator, and MVCSS for CSS architecture.

Most of the code that generates the form elements is within _form.sass. But again, this repo is for the entire site; the demo itself is meant to be the easiest place to pull code from.

Notes

  • On the default checkboxes vs the switches: I used the classes .form-checkbox and .form-switch rather than [type=checkbox] to avoid collisions in the case that a user copies + pastes both.