From bc2ebdd15b0d729f45553e7d877eb3308b02e153 Mon Sep 17 00:00:00 2001
From: Yan Zhu <picturepan2@hotmail.com>
Date: Mon, 27 Mar 2017 19:08:02 +0800
Subject: Add more CSS icons: refresh, search, edit, share, download, upload,
 people and link

---
 docs/elements.html | 56 ++++++++++++++++++++++++++++++++++++++++++++++++++----
 1 file changed, 52 insertions(+), 4 deletions(-)

(limited to 'docs/elements.html')

diff --git a/docs/elements.html b/docs/elements.html
index fcba870..12b0dd2 100644
--- a/docs/elements.html
+++ b/docs/elements.html
@@ -411,9 +411,9 @@
               <button class="btn btn-primary btn-sm">small</button>
             </div>
             <div class="column col-3 col-xs-12">
-              <button class="btn btn-action btn-primary btn-lg"><i class="icon icon-cross"></i></button>
-              <button class="btn btn-action btn-primary"><i class="icon icon-cross"></i></button>
-              <button class="btn btn-action btn-primary btn-sm"><i class="icon icon-cross"></i></button>
+              <button class="btn btn-action btn-primary btn-lg"><i class="icon icon-menu"></i></button>
+              <button class="btn btn-action btn-primary"><i class="icon icon-menu"></i></button>
+              <button class="btn btn-action btn-primary btn-sm"><i class="icon icon-menu"></i></button>
             </div>
             <div class="column col-3 col-xs-12">
               <button class="btn btn-action btn-primary btn-lg circle"><i class="icon icon-arrow-up"></i></button>
@@ -1014,7 +1014,7 @@
         <section id="icons" class="container">
           <header class="text-center"><h3>Icons <small class="label">experimental</small></h3></header>
           <section class="notes">
-            <p><strong>Icons</strong> are pure CSS icons.</p>
+            <p><strong>Icons</strong> are pure CSS icons. You can include <code>spectre-icons.css</code> in the <code>dist</code> folder to your web &lt;head&gt; to have these CSS icons.</p>
           </section>
           <div class="columns">
             <div class="column col-3 col-md-6">
@@ -1113,12 +1113,60 @@
               </button>
               <p>icon-check</p>
             </div>
+            <div class="column col-3 col-md-6">
+              <button class="btn btn-primary btn-action btn-lg">
+                <i class="icon icon-refresh"></i>
+              </button>
+              <p>icon-refresh</p>
+            </div>
+            <div class="column col-3 col-md-6">
+              <button class="btn btn-primary btn-action btn-lg">
+                <i class="icon icon-search"></i>
+              </button>
+              <p>icon-search</p>
+            </div>
+            <div class="column col-3 col-md-6">
+              <button class="btn btn-primary btn-action btn-lg">
+                <i class="icon icon-edit"></i>
+              </button>
+              <p>icon-edit</p>
+            </div>
+            <div class="column col-3 col-md-6">
+              <button class="btn btn-primary btn-action btn-lg">
+                <i class="icon icon-share"></i>
+              </button>
+              <p>icon-share</p>
+            </div>
+            <div class="column col-3 col-md-6">
+              <button class="btn btn-primary btn-action btn-lg">
+                <i class="icon icon-download"></i>
+              </button>
+              <p>icon-download</p>
+            </div>
+            <div class="column col-3 col-md-6">
+              <button class="btn btn-primary btn-action btn-lg">
+                <i class="icon icon-upload"></i>
+              </button>
+              <p>icon-upload</p>
+            </div>
             <div class="column col-3 col-md-6">
               <button class="btn btn-primary btn-action btn-lg">
                 <i class="icon icon-mail"></i>
               </button>
               <p>icon-mail</p>
             </div>
+            <div class="column col-3 col-md-6">
+              <button class="btn btn-primary btn-action btn-lg">
+                <i class="icon icon-people"></i>
+              </button>
+              <p>icon-people</p>
+            </div>
+            <div class="column col-3 col-md-6">
+              <button class="btn btn-primary btn-action btn-lg">
+                <i class="icon icon-link"></i>
+              </button>
+              <p>icon-link</p>
+            </div>
           </div>
 
 <!-- icons example -->
-- 
cgit v1.3.1-23-gd82d