Standards is built on Foundation 6, a robust front-end framework. If you are going to use Standards in your project, it is important to remember not to use any other front-end frameworks. This includes Bootstrap.
You can choose to download the Standards files directly. The latest version and release notes are available on our GitHub repository.
Include the phila-standards folder wherever you store your third-party project assets.
Note: The next release will include minified files.
phila-standards/ ├── css/ │ ├── phila-standards.css │ └── phila-standards.css.map ├── js/ │ ├── phila-standards.js ├── fonts/ └── img/
Add the CSS link to the
<head> of your HTML pages.
<link rel="stylesheet" href="/path/to/your/assets/css/phila-standards.css">
</body> of your HTML pages.
jQuery 3.2.1 is included in the phila-standards.js minified file.
<script src="/path/to/your/assets/js/phila-standards.js"></script> <script>$(document).foundation();</script>
If you are familiar with Node Package Manager (npm) you can include the latest version of the City’s standards in your project.
We recommend you use Yarn to manage dependencies. All packages available on npm are also available via Yarn.
To install use
yarn add phila-standards or
npm install phila-standards.
node_modules/phila-standards/ ├── dist/ │ ├── css/ │ ├── fonts/ │ ├── img/ │ ├── js/ └── src/ ├── img/ ├── js/ └── sass/
The main Sass (SCSS) source file is located in:
The compressed CSS is located in: