From 82e0eef89b185eddbdee9b43beab76d3effa7501 Mon Sep 17 00:00:00 2001 From: Yan Zhu Date: Wed, 16 Aug 2017 18:33:44 +0800 Subject: Rename display utilities and add custom prefix --- docs/getting-started.html | 34 ++++++++++++++++++++++++++++++---- 1 file changed, 30 insertions(+), 4 deletions(-) (limited to 'docs/getting-started.html') diff --git a/docs/getting-started.html b/docs/getting-started.html index 5a1afc1..124890d 100644 --- a/docs/getting-started.html +++ b/docs/getting-started.html @@ -364,9 +364,9 @@

Variables

-

Spectre.css is designed with consistent design language. You can modify variables.less to create your new or match existing design. +

Spectre.css is designed with consistent design language. You can modify variables.less to create your new or match existing design.

-
Colors
+
Colors
@@ -448,8 +448,34 @@
Sizes

The default REM (root em) size in Spectre.css is 20px.

-

Please note in Chinese/Japanese/Korean Chrome, Chrome uses 12px as default minimum font size. That is why Spectre sets rem default html font size to 20px, which is relatively easy to calculate.

-

Spectre also use 4px as the unit size. Sizes of components are based on the unit size.

+

Please note in the Chinese/Japanese/Korean version, Chrome uses 12px as default minimum font size. That is why Spectre sets rem default html font size to 20px, which is relatively easy to calculate.

+

Spectre uses 4px as the unit size. Sizes of components are based on the unit size.

+
+
Custom prefix
+
+

There is also a way to add custom prefix to all CSS classes. You can use gulp-css-prefix plugin and add a new Gulp task to enable it.

+
+ + +
$ npm install gulp-css-prefix
+
+ +
+

To add spectre- to all classes, you can add the Gulp task to gulpfile.js file.

+
+ + +
var cssPrefix = require('gulp-css-prefix');
+  
+gulp.task('prefix', function() {
+  gulp.src('./dist/*.css')
+      .pipe(cssPrefix('spectre-'))
+      .pipe(gulp.dest('./dist'))
+});
+
+ +
+

After you compile your version of Spectre in the /dist, run gulp prefix in the directory of Spectre.

-- cgit v1.3.1-23-gd82d