/vanilla-framework

From community websites to web applications, this CSS framework will help you achieve a consistent look and feel.

Primary LanguageCSSGNU Lesser General Public License v3.0LGPL-3.0

Vanilla Framework

Build Status npm version Downloads devDependency Status Chat in #canonical-webteam on Freenode

A simple extensible CSS framework, written in Sass.

Vanilla Framework contains a basic CSS grid and pattern classes, and is designed to be extended either directly or by creating extension themes.

Project homepage | Documentation

Hotlinking

On the project homepage, find the link to the latest build to add directly into your markup:

<link rel="stylesheet" href="https://assets.ubuntu.com/v1/vanilla-framework-version-x.x.x.min.css" />

Local usage

Install the Node package into your project:

npm install vanilla-framework  # Installs at ./node_modules/vanilla-framework

Then reference it from your own Sass files, with optional settings:

// Optionally override some settings
$brand-color: #ffffff;

// Import the framework
@import "../node_modules/vanilla-framework/vanilla";
// Run the framework
@include vanilla;

You can override any of the settings in _global-settings.scss.

If you don't want the whole framework, you can just @include specific modules - e.g. @include vf-forms.

Themes

Community

Keep upto date with all new developments and upcoming changes with Vanilla.

  • Follow us on Twitter @Ubuntudesigners
  • Read our latest blog posts at Canonical Blog
  • Talk to the team in IRC on irc.freenode.com and join channel #canonical-webteam

Code licensed LGPLv3 by Canonical Ltd..