Skip to content

Latest commit

 

History

History
92 lines (68 loc) · 2.62 KB

README.md

File metadata and controls

92 lines (68 loc) · 2.62 KB
Raw

NPM Version License: MIT

Ignite

ViUR Ignite is a sizzling PostCSS boilerplate

Our goal is to create a boilerplate that is sturdy and scalable yet lightweight and adaptable to our different customer projects. Our approach to CSS is influenced by many modern CSS principles: object oriented, functional and structured. It uses the power of PostCSS.

For a detailed introduction and examples have a look at ignite.viur.dev.

What is this framework for?

  • Ignite is a development toolkit for sturdy HTML and CSS
  • It is a lightweight collection of helpful CSS
  • It is responsive and adaptable
  • It is built with PostCSS
  • It is a solid foundation for Shoelace and VUEJS

Foundation

  • basic.css – styling of all application basics (body, fonts, headlines, lists etc.).
  • color.css – is a collection of color tables.
  • config.css – stores all default variables and constants.
  • mediaqueries.css – is a really simple solution for media queries.
  • reset.css – resets all browsers to the same base state.

Themes

  • dark.css - is a starting point for a dark theme
  • light.css - is a starting point for a light theme

Utilities

  • shoelace.css – the ignite shoelace adapter (ISA)
  • utilities.css – useful helpers

Usage

NPM

Use NPM to install Ignite:

npm install @viur/ignite

Please use postcss-import with your PostCSS pipeline. This way you are able to get rid of ugly ../node_modules/@viur/ignite/ignite.css imports:

@import url('@viur/ignite/ignite.css');

Submodule

You can add Ignite as submodule to your project as well:

git submodule add [email protected]:viur-framework/ignite.git

or

git submodule add https://github.com/viur-framework/ignite.git

Now you can import Ignite in your projects style.css

@import url('ignite/ignite.css');

Builds

Preprocessed versions of Ignite can be found in dist folder:

Bundled:

@import url('@viur/ignite/dist/ignite.css');

Minified:

@import url('@viur/ignite/dist/ignite.min.css');

Contribution guidelines

  • Available for use under the MIT license

Who do I talk to?