long-beach-styleguide's Introduction

patterns

Phila.gov Pattern Library

Using Phila.gov Patterns

The patterns CSS includes a customized 24-column grid version of Foundation 6.1.2. Just add a few lines to <head>.

The bare minimum

<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">
<link rel="stylesheet" href="//codeforamerica.github.io/patterns/dist/1.0.0/css/patterns.css">
<script type="text/javascript" src="//codeforamerica.github.io/patterns/dist/1.0.0/js/patterns.min.js"></script>

Local Setup

Phila.gov Patterns uses Jekyll to generate pattern files.

Install Jekyll $ gem install jekyll
Clone this repository
cd into the patterns directory
$ jekyll serve
Navigate to http://localhost:4000/long-beach-styleguide
Run $ grunt watch

Versioning

Phila.gov Patterns will be maintained under the Semantic Versioning guidelines as much as possible. Releases will be numbered with the following format:

{major}.{minor}.{patch}

Guidelines

Breaking backward compatibility bumps the major (and resets the minor and patch)
New patterns (without breaking backward compatibility) bumps the minor (and resets the patch)
Bug fixes and misc changes bumps the patch

For more information on SemVer, please visit http://semver.org.

New in 1.0

Foundation 6!
Added grunt-postcss to dev process.

Upgrading to 1.0

There have been a number of markup changes in foundation 6, which developers will need to be aware of when updating to Patterns 1.0. Here is the list of elements to watch out for:

Sites using the Phila.gov Pattern Portfolio

Site	Version
alpha.phila.gov	1.2.1
analytics.phila.gov	1.1.2
Bullet Voting	0.12.1
Crashboard: Service Monitor Status	1.4.0
Community Health Explorer	0.12.5
Make a Payment	0.1.1
Metadata Catalog	0.12.6
Open Budget	0.1.1
Open Contract Data	0.2.0
Phila.gov Patterns	1.2.0
Property	1.2.1
ROWS
Street Closures
Trashday	0.12.5

Recommend Projects