So you've built an app for The City.
Awesome.
We're happy about that. We have provided a few tools for you. We hope these tools will make it easier for you to make your app fit nicely within The City.
We've put together and hosted a stylesheet for you to include in your app. This will provide you with the basic styles that we use in The City. To place it in your app, paste the following in the head of your document:
The City Default Styles
<link rel="stylesheet" href="http://dcascn3rg03ga.cloudfront.net/appkit/v1.3/appkit.css" />
Javascript for HTML5 support for pre-IE 9 browsers
This code makes new HTML5 elements block-level so that earlier versions of IE treat them correctly. Credit goes to @jon_neal and afarkas for this. Full original, uncompressed source available at https://github.com/aFarkas/html5shiv
<script type="text/javascript" src="http://dcascn3rg03ga.cloudfront.net/appkit/v1.3/appkit-ie.js"></script>
Hosting City Utilities
If you'd rather host the City Utilities yourself, you can download this project as a .zip file or download as a tar.gz file. View this project on GitHub.
What's included in The City Utilities?
Typography
Here are The City's defaults for headings, paragraphs, list and all other typographic styles. There are also a few utility classes that you may need.
Forms
In The City, we've leveraged the 12-column form grid from the smart folks at Formee. We show you how to structure your forms so that everything lines up just right.
Tables
You can put borders around your table cells, or you can zebra-stripe them. Or both.
Grid
8 columns. Fluid. It's based off of 960.gs. We adapted it to fit the content area in The City. The City's content area is not fluid, but this will be future friendly.
Buttons
We have 4 buttons colors with the basic style. We'll explain how to use the various classnames and make your buttons look like they belong in The City.
Center Stage
Every page in The City has Center Stage. It's where the page header lives. You can add tabs for page nav as well.
News Feed Items
The News Feed Item is the container in which the majority of all content is delivered in The City.