This guide details how to upgrade from PatternFly 1.x to our latest version, PatternFly 2.0.
PatternFly 2.0 is (almost) backwards compatible with v1.x.
There are three major changes that you should know about:
- We don’t support Internet Explorer 8 anymore.
- We’ve split the CSS into two files (
patternfly-additions.*css) to avoid a limitation of Internet Explorer 9, where only 4095 selectors are recognized in a single stylesheet.
- We’ve moved
Get PatternFly 2.0
The first step is to upgrade the PatternFly codebase. This process will be different depending on how your project manages its dependencies.
Upgrade using Bower:
$ bower install patternfly —save-dev
Upgrade using Npm:
$ npm install patternfly —save-dev
Upgrade using Git:
Add PatternFly as a remote repo, fetch it and rebase.
$ git remote add upstream firstname.lastname@example.org:patternfly/patternfly.git $ git fetch upstream
Get the ZIP
Or just download the zip file from github.
Changes on the HTML
Since we no longer support IE8, you can remove IE8 utilities (html5shiv and respond) from all your pages.
Link two CSS instead of one
We’ve split PatternFly styles into two style sheets. The links to the styles will look something like this:
<link href="PATH_TO_PATTERNFLY/dist/css/patternfly.*.css" rel="stylesheet" media="screen, print"> <link href="PATH_TO_PATTERNFLY/dist/css/patternfly-additions.*.css" rel="stylesheet" media="screen, print">
We’ve upgraded most of our dependencies. Check out the Release Notes to see a complete list. If you need a version other than what is checked into patternfly/components, you’ll have to pull it yourself.
Changes on LESS
If you are extending PatternFly styles using less, import
patternfly-additions.less as a base to your styles, and compile again. Remember to load both
patternfly*.css and your styles on the HTML.
For more information on upgrading to v2.0
Send an email to the mailing list or join the IRC channel #patternfly on Freenode.