From 437bf2aaf7e405cb9af2db32bb0f5067d2a8efbf Mon Sep 17 00:00:00 2001 From: Yan Zhu Date: Tue, 28 Feb 2017 19:43:32 +0800 Subject: ADD: Yarn installation docs --- README.md | 8 +++- docs/index.html | 7 +++- src/fileicons.less | 113 ----------------------------------------------------- 3 files changed, 13 insertions(+), 115 deletions(-) delete mode 100644 src/fileicons.less diff --git a/README.md b/README.md index 3ae7bd4..cc88f08 100644 --- a/README.md +++ b/README.md @@ -11,11 +11,17 @@ Read [the documentation](http://picturepan2.github.io/spectre/) to learn more. ### Getting started -There are 3 ways to get started with Spectre CSS framework in your projects. You can either manually install or use NPM and Bower. +There are 4 ways to get started with Spectre CSS framework in your projects. You can either manually install or use NPM, Yarn and Bower. + ##### Install manually Download the compiled and minified [Spectre CSS file](https://github.com/picturepan2/spectre/tree/master/dist). + ##### Install with NPM `$ npm install spectre.css --save` + +##### Install with Yarn +`$ yarn add spectre.css` + ##### Install with Bower `$ bower install spectre.css --save` diff --git a/docs/index.html b/docs/index.html index c0b2f07..51c5e2b 100644 --- a/docs/index.html +++ b/docs/index.html @@ -125,7 +125,7 @@

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.

+

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

Install manually
@@ -135,6 +135,11 @@
 $ npm install spectre.css --save
+
+
Install with Yarn
+ +
+$ yarn add spectre.css
 
Install with Bower
diff --git a/src/fileicons.less b/src/fileicons.less deleted file mode 100644 index 0e2c7eb..0000000 --- a/src/fileicons.less +++ /dev/null @@ -1,113 +0,0 @@ -// File icons -.file-icon { - background: transparent; - border-color: @control-color; - border-radius: .2rem; - border-style: solid; - border-width: 0 0 2.2rem 1.4rem; - display: inline-block; - height: 3.2rem; - position: relative; - text-align: left; - width: 2.4rem; - zoom: 1; - - &::before, - &::after { - background: transparent; - border: .5rem solid @control-color; - border-right-color: transparent; - border-top-color: transparent; - content: ""; - height: 1rem; - position: absolute; - right: 0; - top: 0; - width: 1rem; - z-index: 2; - } - &::after { - border-bottom-left-radius: .2rem; - border-color: rgba(255, 255, 255, .5); - color: @core-light-color; - content: attr(data-type); - font-size: 1rem; - line-height: 3.6rem; - text-indent: -1.6rem; - z-index: 3; - } - - &.file-icon-xs { - border-width: 0 0 1.2rem .8rem; - height: 1.6rem; - width: 1.2rem; - - &::before, - &::after { - border-width: .2rem; - height: .4rem; - width: .4rem; - } - &::after { - border-radius: .1rem; - content: "--"; - font-size: .8rem; - line-height: 1.6rem; - text-indent: -.8rem; - } - } - &.file-icon-sm { - border-width: 0 0 1.6rem 1rem; - height: 2.4rem; - width: 1.8rem; - - &::before, - &::after { - border-width: .4rem; - height: .8rem; - width: .8rem; - } - &::after { - font-size: .8rem; - line-height: 2.6rem; - text-indent: -1.2rem; - } - } - &.file-icon-lg { - border-width: 0 0 3.4rem 2.2rem; - height: 4.8rem; - width: 3.6rem; - - &::before, - &::after { - border-width: .7rem; - height: 1.4rem; - width: 1.4rem; - } - &::after { - font-size: 1.2rem; - line-height: 6.2rem; - text-indent: -2.6rem; - } - } - &.file-icon-xl { - border-radius: .3rem; - border-width: 0 0 4.6rem 3rem; - height: 6.4rem; - width: 4.8rem; - - &::before, - &::after { - border-width: .9rem; - height: 1.8rem; - width: 1.8rem; - } - &::after { - font-size: 1.4rem; - line-height: 8.8rem; - text-indent: -3.4rem; - } - } -} - -// TODO: File types -- cgit v1.3.1-23-gd82d