[desing] add icons to style guide

zombieFox · zombieFox · commit 02ecd77ac9d3 · 2020-04-30T10:30:40.000+01:00
diff --git a/src/style-guide.html b/src/style-guide.html
@@ -37,6 +37,13 @@
 <link rel="stylesheet" href="css/auto-suggest.css">
 <link rel="stylesheet" href="css/fontawesome.css">
 <!-- end-css-block -->
+ <style>
+ .style-guide-icon{
+ padding: 1em;
+ font-size: 1.5em;
+ display: inline-block;
+ }
+ </style>
 </head>
 
 <body>
@@ -63,6 +70,36 @@
 <input id="radius" class="style-guide-control radius" type="range" min="0" max="600" value="0" step="1" tabindex="1">
 </div>
 <hr>
+ <span class="style-guide-icon icon-add"></span>
+ <span class="style-guide-icon icon-arrow-back"></span>
+ <span class="style-guide-icon icon-arrow-downward"></span>
+ <span class="style-guide-icon icon-arrow-forward"></span>
+ <span class="style-guide-icon icon-arrow-upward"></span>
+ <span class="style-guide-icon icon-check"></span>
+ <span class="style-guide-icon icon-check-box-checked"></span>
+ <span class="style-guide-icon icon-check-box-unchecked"></span>
+ <span class="style-guide-icon icon-check-box-indeterminate"></span>
+ <span class="style-guide-icon icon-close"></span>
+ <span class="style-guide-icon icon-edit"></span>
+ <span class="style-guide-icon icon-done"></span>
+ <span class="style-guide-icon icon-arrow-down"></span>
+ <span class="style-guide-icon icon-arrow-left"></span>
+ <span class="style-guide-icon icon-arrow-right"></span>
+ <span class="style-guide-icon icon-arrow-up"></span>
+ <span class="style-guide-icon icon-more-horiz"></span>
+ <span class="style-guide-icon icon-more-vert"></span>
+ <span class="style-guide-icon icon-radio-unchecked"></span>
+ <span class="style-guide-icon icon-radio-checked"></span>
+ <span class="style-guide-icon icon-remove"></span>
+ <span class="style-guide-icon icon-settings"></span>
+ <span class="style-guide-icon icon-unfold-less"></span>
+ <span class="style-guide-icon icon-unfold-more"></span>
+ <span class="style-guide-icon icon-refresh"></span>
+ <span class="style-guide-icon icon-reorder"></span>
+ <span class="style-guide-icon icon-undo"></span>
+ <span class="style-guide-icon icon-redo"></span>
+ <span class="style-guide-icon icon-replay"></span>
+ <hr>
 <div class="form-wrap">
 <div class="form-inline">
 <button class="button" tabindex="1">Button</button>

-Original file line number
+Diff line change
 <linkrel="stylesheet" href="css/auto-suggest.css">
 <linkrel="stylesheet" href="css/fontawesome.css">
 <!-- end-css-block -->
 +<style>
 + .style-guide-icon{
 +padding:1em;
 +font-size:1.5em;
 +display: inline-block;
 + }
 +</style>
 </head>
 <body>
 <inputid="radius" class="style-guide-control radius" type="range" min="0" max="600" value="0" step="1" tabindex="1">
 </div>
 <hr>
 +<spanclass="style-guide-icon icon-add"></span>
 +<spanclass="style-guide-icon icon-arrow-back"></span>
 +<spanclass="style-guide-icon icon-arrow-downward"></span>
 +<spanclass="style-guide-icon icon-arrow-forward"></span>
 +<spanclass="style-guide-icon icon-arrow-upward"></span>
 +<spanclass="style-guide-icon icon-check"></span>
 +<spanclass="style-guide-icon icon-check-box-checked"></span>
 +<spanclass="style-guide-icon icon-check-box-unchecked"></span>
 +<spanclass="style-guide-icon icon-check-box-indeterminate"></span>
 +<spanclass="style-guide-icon icon-close"></span>
 +<spanclass="style-guide-icon icon-edit"></span>
 +<spanclass="style-guide-icon icon-done"></span>
 +<spanclass="style-guide-icon icon-arrow-down"></span>
 +<spanclass="style-guide-icon icon-arrow-left"></span>
 +<spanclass="style-guide-icon icon-arrow-right"></span>
 +<spanclass="style-guide-icon icon-arrow-up"></span>
 +<spanclass="style-guide-icon icon-more-horiz"></span>
 +<spanclass="style-guide-icon icon-more-vert"></span>
 +<spanclass="style-guide-icon icon-radio-unchecked"></span>
 +<spanclass="style-guide-icon icon-radio-checked"></span>
 +<spanclass="style-guide-icon icon-remove"></span>
 +<spanclass="style-guide-icon icon-settings"></span>
 +<spanclass="style-guide-icon icon-unfold-less"></span>
 +<spanclass="style-guide-icon icon-unfold-more"></span>
 +<spanclass="style-guide-icon icon-refresh"></span>
 +<spanclass="style-guide-icon icon-reorder"></span>
 +<spanclass="style-guide-icon icon-undo"></span>
 +<spanclass="style-guide-icon icon-redo"></span>
 +<spanclass="style-guide-icon icon-replay"></span>
 +<hr>
 <divclass="form-wrap">
 <divclass="form-inline">
 <buttonclass="button" tabindex="1">Button</button>