From 6a0b4cbb5895496ab8e204b5ef04732c4d9fdf1a Mon Sep 17 00:00:00 2001 From: Yan Zhu Date: Mon, 20 Feb 2017 10:26:45 +0800 Subject: ADD: New Documents experience --- docs/index.html | 197 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 197 insertions(+) create mode 100644 docs/index.html (limited to 'docs/index.html') diff --git a/docs/index.html b/docs/index.html new file mode 100644 index 0000000..8fc5194 --- /dev/null +++ b/docs/index.html @@ -0,0 +1,197 @@ + + + + + + + + + Spectre.css - The lightweight, responsive and modern CSS framework + + + + + +
+
+

Spectre.css

+

The lightweight, responsive and modern CSS framework

+
+ Documents + GitHub Repo +
+ +
+
+
+
+ Lightweight +
+
+ Lightweight (~10KB gzipped) starting point for your projects +
+
+
+
+
+
+ Responsive +
+
+ Flexbox-based, responsive and mobile-friendly layout +
+
+
+
+
+
+ Modern +
+
+ Carefully designed elements and components +
+
+
+
+
+
+ +
+
+
+ +
+
+
+

Introduction

+
+

Spectre.css is a lightweight and responsive and modern CSS framework for faster and extensible development.

+

Spectre provides basic styles for typography and elements, flexbox based responsive layout system, CSS components and utilities with best practice coding and consistent design language.

+
+
+ +
+

Installation

+
+

There are 3 ways to get started with Spectre CSS framework in your projects. You can either manually install or use NPM and Bower.

+

Install manually

+

Download the compiled and minified Spectre CSS file (~10KB min+gzip):

+

Download Spectre.css

+

Install with NPM

+ +
+$ npm install spectre.css --save
+
+

Install with Bower

+ +
+$ bower install spectre.css --save
+
+

And include it in your website or Web app <head>

+ +
+<link rel="stylesheet" href="dist/spectre.min.css" />
+
+ +
+
+ +
+

Custom version

+
+

Spectre uses Gulp for compiling CSS. You can customize your version of Spectre.css by editing LESS files in /src directory or removing unneeded components from spectre.less.

+

Then, you can build the CSS file from the command line:

+
    +
  1. Navigate to the root directory of Spectre where you can find package.json file.
    2. +
  2. Run npm install. NPM will install all dev dependencies as listed in package.json.
    3. +
  3. When completed, run gulp build to compile LESS to CSS and minify files.
    4. +
  4. You can find compiled CSS files in /dist directory.
    5. +
+

You can watch file changes and rebuild CSS files by using gulp watch.

+
+
+ +
+

Browser support

+
+

Spectre uses Autoprefixer to make most styles compatible with earlier browsers and Normalize.css for CSS resets. Spectre is designed for modern browsers. For best compatibility, these browsers are recommended:

+
    +
  • Chrome (last three)
    • +
  • Microsoft Edge (last three)
    • +
  • Firefox (last three)
    • +
  • Safari (last three)
    • +
  • Opera (last three)
    • +
  • Internet Explorer 10+
    • +
+
+
+ +
+

What's new

+
+

February 2017

+
    +
  • New Documents experience
    • +
+

March 2016

+
    +
  • Initial commit
    • +
+
+
+
+
+
+ + + + + -- cgit v1.3.1-23-gd82d