plain-design 1.0.0-beta.34 → 1.0.0-beta.35

Sign up to get free protection for your applications and to get access to all the features.
Files changed (168) hide show
  1. package/package.json +3 -2
  2. package/src/pages/data/address.json +0 -39317
  3. package/src/pages/data/data-1.json +0 -754
  4. package/src/pages/data/data-2.json +0 -3006
  5. package/src/pages/data/data-200.json +0 -5206
  6. package/src/pages/data/data-2000.json +0 -51954
  7. package/src/pages/data/data-50.json +0 -2075
  8. package/src/pages/data/data.json +0 -30002
  9. package/src/pages/data/demo.json +0 -1702
  10. package/src/pages/data/mock.database.js +0 -43
  11. package/src/pages/data/mock.js +0 -141
  12. package/src/pages/data/tree.data.json +0 -87
  13. package/src/pages/env/config/local.js +0 -3
  14. package/src/pages/env/config/prod.js +0 -3
  15. package/src/pages/env/config/undefined.js +0 -1
  16. package/src/pages/env/env.d.ts +0 -4
  17. package/src/pages/env/index.ts +0 -1
  18. package/src/pages/history/createHistory.ts +0 -94
  19. package/src/pages/history/history.utils.ts +0 -64
  20. package/src/pages/index/App.tsx +0 -17
  21. package/src/pages/index/Demo/DemoLine.tsx +0 -23
  22. package/src/pages/index/Demo/DemoRow.scss +0 -131
  23. package/src/pages/index/Demo/DemoRow.tsx +0 -71
  24. package/src/pages/index/Demo/DemoRow.utils.ts +0 -23
  25. package/src/pages/index/Demo/DemoRowController.tsx +0 -45
  26. package/src/pages/index/Demo/index.ts +0 -8
  27. package/src/pages/index/app.scss +0 -197
  28. package/src/pages/index/components/AutoTable/AutoHeightAutoRow.tsx +0 -56
  29. package/src/pages/index/components/AutoTable/AutoHeightFixedRow.tsx +0 -50
  30. package/src/pages/index/components/AutoTable/AutoTableBasicUsage.tsx +0 -75
  31. package/src/pages/index/components/AutoTable/AutoTableCascade.tsx +0 -99
  32. package/src/pages/index/components/AutoTable/AutoTableDefaultSearch.tsx +0 -73
  33. package/src/pages/index/components/AutoTable/AutoTableFiles.tsx +0 -26
  34. package/src/pages/index/components/AutoTable/AutoTableFill.tsx +0 -51
  35. package/src/pages/index/components/AutoTable/AutoTableGroupUsage.tsx +0 -71
  36. package/src/pages/index/components/AutoTable/AutoTableObjectPicker.tsx +0 -181
  37. package/src/pages/index/components/AutoTable/AutoTableOvList.tsx +0 -80
  38. package/src/pages/index/components/AutoTable/AutoTableProductList.tsx +0 -98
  39. package/src/pages/index/components/AutoTable/AutoTableRowFormatter.tsx +0 -58
  40. package/src/pages/index/components/AutoTable/FixedHeightAutoRow.tsx +0 -50
  41. package/src/pages/index/components/AutoTable/FixedHeightFixedRow.tsx +0 -49
  42. package/src/pages/index/components/bus/DemoAddress.tsx +0 -181
  43. package/src/pages/index/components/bus/DemoAddressCascade.tsx +0 -132
  44. package/src/pages/index/components/bus/DemoFilter.tsx +0 -184
  45. package/src/pages/index/components/columns/DemoPlcAddress.tsx +0 -161
  46. package/src/pages/index/components/columns/DemoPlcDate.tsx +0 -363
  47. package/src/pages/index/components/columns/DemoPlcSelect.tsx +0 -505
  48. package/src/pages/index/components/columns/DemoPlcTime.tsx +0 -293
  49. package/src/pages/index/components/columns/DemoTableColumns.tsx +0 -88
  50. package/src/pages/index/components/form/DemoFormBasic.tsx +0 -516
  51. package/src/pages/index/components/form/DemoFormBlur.tsx +0 -204
  52. package/src/pages/index/components/form/DemoFormDynamicFields.tsx +0 -54
  53. package/src/pages/index/components/form/DemoFormEditControl.tsx +0 -164
  54. package/src/pages/index/components/form/DemoFormElement.tsx +0 -207
  55. package/src/pages/index/components/form/DemoFormLayout.scss +0 -7
  56. package/src/pages/index/components/form/DemoFormLayout.tsx +0 -311
  57. package/src/pages/index/components/form/DemoFormSimplify.tsx +0 -587
  58. package/src/pages/index/components/form/DemoFormSize.tsx +0 -274
  59. package/src/pages/index/components/form/DemoFormVertical.tsx +0 -280
  60. package/src/pages/index/components/normal/DemoAlert.tsx +0 -66
  61. package/src/pages/index/components/normal/DemoBadge.tsx +0 -53
  62. package/src/pages/index/components/normal/DemoButton.tsx +0 -300
  63. package/src/pages/index/components/normal/DemoCard.tsx +0 -176
  64. package/src/pages/index/components/normal/DemoCarousel.tsx +0 -230
  65. package/src/pages/index/components/normal/DemoCascade.tsx +0 -880
  66. package/src/pages/index/components/normal/DemoCheckbox.scss +0 -24
  67. package/src/pages/index/components/normal/DemoCheckbox.tsx +0 -294
  68. package/src/pages/index/components/normal/DemoCollapse.tsx +0 -104
  69. package/src/pages/index/components/normal/DemoColor.scss +0 -20
  70. package/src/pages/index/components/normal/DemoColor.tsx +0 -82
  71. package/src/pages/index/components/normal/DemoColorPicker.tsx +0 -163
  72. package/src/pages/index/components/normal/DemoDate.tsx +0 -443
  73. package/src/pages/index/components/normal/DemoDialog.tsx +0 -507
  74. package/src/pages/index/components/normal/DemoDropdown.tsx +0 -464
  75. package/src/pages/index/components/normal/DemoGrid.scss +0 -26
  76. package/src/pages/index/components/normal/DemoGrid.tsx +0 -181
  77. package/src/pages/index/components/normal/DemoIcon.tsx +0 -39
  78. package/src/pages/index/components/normal/DemoImage.tsx +0 -122
  79. package/src/pages/index/components/normal/DemoInput.scss +0 -0
  80. package/src/pages/index/components/normal/DemoInput.tsx +0 -790
  81. package/src/pages/index/components/normal/DemoKeepAlive.tsx +0 -505
  82. package/src/pages/index/components/normal/DemoLayout.tsx +0 -144
  83. package/src/pages/index/components/normal/DemoList.scss +0 -15
  84. package/src/pages/index/components/normal/DemoList.tsx +0 -82
  85. package/src/pages/index/components/normal/DemoLoading.tsx +0 -86
  86. package/src/pages/index/components/normal/DemoNumber.tsx +0 -269
  87. package/src/pages/index/components/normal/DemoPagination.tsx +0 -164
  88. package/src/pages/index/components/normal/DemoPopup.tsx +0 -695
  89. package/src/pages/index/components/normal/DemoProgress.tsx +0 -133
  90. package/src/pages/index/components/normal/DemoRadio.scss +0 -16
  91. package/src/pages/index/components/normal/DemoRadio.tsx +0 -188
  92. package/src/pages/index/components/normal/DemoRate.tsx +0 -77
  93. package/src/pages/index/components/normal/DemoScroll.scss +0 -22
  94. package/src/pages/index/components/normal/DemoScroll.tsx +0 -300
  95. package/src/pages/index/components/normal/DemoSegment.tsx +0 -71
  96. package/src/pages/index/components/normal/DemoSelect.tsx +0 -819
  97. package/src/pages/index/components/normal/DemoSlider.tsx +0 -128
  98. package/src/pages/index/components/normal/DemoSortList.tsx +0 -70
  99. package/src/pages/index/components/normal/DemoStackCard.tsx +0 -356
  100. package/src/pages/index/components/normal/DemoStep.scss +0 -18
  101. package/src/pages/index/components/normal/DemoStep.tsx +0 -291
  102. package/src/pages/index/components/normal/DemoTab.tsx +0 -338
  103. package/src/pages/index/components/normal/DemoTag.tsx +0 -100
  104. package/src/pages/index/components/normal/DemoTime.tsx +0 -403
  105. package/src/pages/index/components/normal/DemoToggle.tsx +0 -56
  106. package/src/pages/index/components/normal/DemoTooltip.tsx +0 -120
  107. package/src/pages/index/components/normal/DemoTree.tsx +0 -1183
  108. package/src/pages/index/components/normal/DemoUpload.tsx +0 -484
  109. package/src/pages/index/components/normal/DemoVirtualList.tsx +0 -464
  110. package/src/pages/index/components/service/DemoDialogService.tsx +0 -249
  111. package/src/pages/index/components/service/DemoFileService.tsx +0 -110
  112. package/src/pages/index/components/service/DemoImagePreviewer.tsx +0 -185
  113. package/src/pages/index/components/service/DemoMessageService.tsx +0 -100
  114. package/src/pages/index/components/service/DemoNoticeService.tsx +0 -99
  115. package/src/pages/index/components/service/DemoPopupService.tsx +0 -325
  116. package/src/pages/index/components/table/DemoPlcOperation.tsx +0 -307
  117. package/src/pages/index/components/table/DemoTableBasic.tsx +0 -220
  118. package/src/pages/index/components/table/DemoTableCheck.tsx +0 -78
  119. package/src/pages/index/components/table/DemoTableClassAndStyle.scss +0 -18
  120. package/src/pages/index/components/table/DemoTableClassAndStyle.tsx +0 -112
  121. package/src/pages/index/components/table/DemoTableColDraggable.tsx +0 -80
  122. package/src/pages/index/components/table/DemoTableEdit.tsx +0 -136
  123. package/src/pages/index/components/table/DemoTableExpand.tsx +0 -203
  124. package/src/pages/index/components/table/DemoTableFixed.tsx +0 -131
  125. package/src/pages/index/components/table/DemoTableFormatter.tsx +0 -66
  126. package/src/pages/index/components/table/DemoTableOverflowTooltip.tsx +0 -67
  127. package/src/pages/index/components/table/DemoTableRowDraggable.tsx +0 -106
  128. package/src/pages/index/components/table/DemoTableSlots.tsx +0 -153
  129. package/src/pages/index/components/table/DemoTableSpan.tsx +0 -167
  130. package/src/pages/index/components/table/DemoTableTree.tsx +0 -976
  131. package/src/pages/index/components/table/DemoVirtualTable.tsx +0 -274
  132. package/src/pages/index/components/test/DemoI18n.tsx +0 -27
  133. package/src/pages/index/components/test/DemoI18n2.jsx +0 -11
  134. package/src/pages/index/home/AppContent.tsx +0 -69
  135. package/src/pages/index/home/AppHead.tsx +0 -18
  136. package/src/pages/index/home/AppHome.tsx +0 -31
  137. package/src/pages/index/home/AppMenu.tsx +0 -38
  138. package/src/pages/index/home/menus.tsx +0 -220
  139. package/src/pages/index/home/plain-design.png +0 -0
  140. package/src/pages/index/main.tsx +0 -23
  141. package/src/pages/index/nav/$nav.ts +0 -41
  142. package/src/pages/index/pages.d.ts +0 -6
  143. package/src/pages/libs/iconfont-fontcls/demo.css +0 -539
  144. package/src/pages/libs/iconfont-fontcls/demo_index.html +0 -303
  145. package/src/pages/libs/iconfont-fontcls/iconfont.css +0 -35
  146. package/src/pages/libs/iconfont-fontcls/iconfont.js +0 -1
  147. package/src/pages/libs/iconfont-fontcls/iconfont.json +0 -44
  148. package/src/pages/libs/iconfont-fontcls/iconfont.ttf +0 -0
  149. package/src/pages/libs/iconfont-fontcls/iconfont.woff +0 -0
  150. package/src/pages/libs/iconfont-fontcls/iconfont.woff2 +0 -0
  151. package/src/pages/libs/iconfont-symbol/demo.css +0 -539
  152. package/src/pages/libs/iconfont-symbol/demo_index.html +0 -303
  153. package/src/pages/libs/iconfont-symbol/iconfont.css +0 -35
  154. package/src/pages/libs/iconfont-symbol/iconfont.js +0 -1
  155. package/src/pages/libs/iconfont-symbol/iconfont.json +0 -44
  156. package/src/pages/libs/iconfont-symbol/iconfont.ttf +0 -0
  157. package/src/pages/libs/iconfont-symbol/iconfont.woff +0 -0
  158. package/src/pages/libs/iconfont-symbol/iconfont.woff2 +0 -0
  159. package/src/pages/libs/install.iconfont-fontcls.tsx +0 -11
  160. package/src/pages/libs/install.iconfont-symbol.scss +0 -7
  161. package/src/pages/libs/install.iconfont-symbol.tsx +0 -14
  162. package/src/pages/module/address.ts +0 -27
  163. package/src/pages/module/http.ts +0 -24
  164. package/src/pages/module/index.ts +0 -19
  165. package/src/pages/module/object.ts +0 -5
  166. package/src/pages/module/ov.tsx +0 -13
  167. package/src/pages/module/upload.ts +0 -9
  168. package/src/pages/module/useTableOption.ts +0 -28
@@ -1,303 +0,0 @@
1
- <!DOCTYPE html>
2
- <html>
3
- <head>
4
- <meta charset="utf-8"/>
5
- <title>iconfont Demo</title>
6
- <link rel="shortcut icon" href="//img.alicdn.com/imgextra/i2/O1CN01ZyAlrn1MwaMhqz36G_!!6000000001499-73-tps-64-64.ico" type="image/x-icon"/>
7
- <link rel="icon" type="image/svg+xml" href="//img.alicdn.com/imgextra/i4/O1CN01EYTRnJ297D6vehehJ_!!6000000008020-55-tps-64-64.svg"/>
8
- <link rel="stylesheet" href="https://g.alicdn.com/thx/cube/1.3.2/cube.min.css">
9
- <link rel="stylesheet" href="demo.css">
10
- <link rel="stylesheet" href="iconfont.css">
11
- <script src="iconfont.js"></script>
12
- <!-- jQuery -->
13
- <script src="https://a1.alicdn.com/oss/uploads/2018/12/26/7bfddb60-08e8-11e9-9b04-53e73bb6408b.js"></script>
14
- <!-- 代码高亮 -->
15
- <script src="https://a1.alicdn.com/oss/uploads/2018/12/26/a3f714d0-08e6-11e9-8a15-ebf944d7534c.js"></script>
16
- <style>
17
- .main .logo {
18
- margin-top: 0;
19
- height: auto;
20
- }
21
-
22
- .main .logo a {
23
- display: flex;
24
- align-items: center;
25
- }
26
-
27
- .main .logo .sub-title {
28
- margin-left: 0.5em;
29
- font-size: 22px;
30
- color: #fff;
31
- background: linear-gradient(-45deg, #3967FF, #B500FE);
32
- -webkit-background-clip: text;
33
- -webkit-text-fill-color: transparent;
34
- }
35
- </style>
36
- </head>
37
- <body>
38
- <div className="main">
39
- <h1 className="logo"><a href="https://www.iconfont.cn/" title="iconfont 首页" target="_blank">
40
- <img width="200" src="https://img.alicdn.com/imgextra/i3/O1CN01Mn65HV1FfSEzR6DKv_!!6000000000514-55-tps-228-59.svg">
41
-
42
- </a></h1>
43
- <div className="nav-tabs">
44
- <ul id="tabs" className="dib-box">
45
- <li className="dib active"><span>Unicode</span></li>
46
- <li className="dib"><span>Font class</span></li>
47
- <li className="dib"><span>Symbol</span></li>
48
- </ul>
49
-
50
- <a href="https://www.iconfont.cn/manage/index?manage_type=myprojects&projectId=1816939" target="_blank" className="nav-more">查看项目</a>
51
-
52
- </div>
53
- <div className="tab-container">
54
- <div className="content unicode" style="display: block;">
55
- <ul className="icon_lists dib-box">
56
-
57
- <li className="dib">
58
- <span className="icon pl-icon-font">&#xe759;</span>
59
- <div className="name">plus-large</div>
60
- <div className="code-name">&amp;#xe759;</div>
61
- </li>
62
-
63
- <li className="dib">
64
- <span className="icon pl-icon-font">&#xe6fb;</span>
65
- <div className="name">link</div>
66
- <div className="code-name">&amp;#xe6fb;</div>
67
- </li>
68
-
69
- <li className="dib">
70
- <span className="icon pl-icon-font">&#xe741;</span>
71
- <div className="name">code</div>
72
- <div className="code-name">&amp;#xe741;</div>
73
- </li>
74
-
75
- <li className="dib">
76
- <span className="icon pl-icon-font">&#xe64a;</span>
77
- <div className="name">github</div>
78
- <div className="code-name">&amp;#xe64a;</div>
79
- </li>
80
-
81
- <li className="dib">
82
- <span className="icon pl-icon-font">&#xe602;</span>
83
- <div className="name">gitee</div>
84
- <div className="code-name">&amp;#xe602;</div>
85
- </li>
86
-
87
- </ul>
88
- <div className="article markdown">
89
- <h2 id="unicode-">Unicode 引用</h2>
90
- <hr>
91
-
92
- <p>Unicode 是字体在网页端最原始的应用方式,特点是:</p>
93
- <ul>
94
- <li>支持按字体的方式去动态调整图标大小,颜色等等。</li>
95
- <li>默认情况下不支持多色,直接添加多色图标会自动去色。</li>
96
- </ul>
97
- <blockquote>
98
- <p>注意:新版 iconfont 支持两种方式引用多色图标:SVG symbol 引用方式和彩色字体图标模式。(使用彩色字体图标需要在「编辑项目」中开启「彩色」选项后并重新生成。)</p>
99
- </blockquote>
100
- <p>Unicode 使用步骤如下:</p>
101
- <h3 id="-font-face">第一步:拷贝项目下面生成的 <code>@font-face</code></h3>
102
- <pre><code className="language-css"
103
- >@font-face {
104
- font-family: 'pl-icon-font';
105
- src: url('iconfont.woff2?t=1652858535816') format('woff2'),
106
- url('iconfont.woff?t=1652858535816') format('woff'),
107
- url('iconfont.ttf?t=1652858535816') format('truetype');
108
- }
109
- </code></pre>
110
- <h3 id="-iconfont-">第二步:定义使用 iconfont 的样式</h3>
111
- <pre><code className="language-css"
112
- >.pl-icon-font {
113
- font-family: "pl-icon-font" !important;
114
- font-size: 16px;
115
- font-style: normal;
116
- -webkit-font-smoothing: antialiased;
117
- -moz-osx-font-smoothing: grayscale;
118
- }
119
- </code></pre>
120
- <h3 id="-">第三步:挑选相应图标并获取字体编码,应用于页面</h3>
121
- <pre>
122
- <code className="language-html"
123
- >&lt;span className="pl-icon-font"&gt;&amp;#x33;&lt;/span&gt;
124
- </code></pre>
125
- <blockquote>
126
- <p>"pl-icon-font" 是你项目下的 font-family。可以通过编辑项目查看,默认是 "iconfont"。</p>
127
- </blockquote>
128
- </div>
129
- </div>
130
- <div className="content font-class">
131
- <ul className="icon_lists dib-box">
132
-
133
- <li className="dib">
134
- <span className="icon pl-icon-font plicon-plus-lite"></span>
135
- <div className="name">
136
- plus-large
137
- </div>
138
- <div className="code-name">.plicon-plus-lite
139
- </div>
140
- </li>
141
-
142
- <li className="dib">
143
- <span className="icon pl-icon-font plicon-link"></span>
144
- <div className="name">
145
- link
146
- </div>
147
- <div className="code-name">.plicon-link
148
- </div>
149
- </li>
150
-
151
- <li className="dib">
152
- <span className="icon pl-icon-font plicon-code"></span>
153
- <div className="name">
154
- code
155
- </div>
156
- <div className="code-name">.plicon-code
157
- </div>
158
- </li>
159
-
160
- <li className="dib">
161
- <span className="icon pl-icon-font plicon-git"></span>
162
- <div className="name">
163
- github
164
- </div>
165
- <div className="code-name">.plicon-git
166
- </div>
167
- </li>
168
-
169
- <li className="dib">
170
- <span className="icon pl-icon-font plicon-gitee"></span>
171
- <div className="name">
172
- gitee
173
- </div>
174
- <div className="code-name">.plicon-gitee
175
- </div>
176
- </li>
177
-
178
- </ul>
179
- <div className="article markdown">
180
- <h2 id="font-class-">font-class 引用</h2>
181
- <hr>
182
-
183
- <p>font-class 是 Unicode 使用方式的一种变种,主要是解决 Unicode 书写不直观,语意不明确的问题。</p>
184
- <p>与 Unicode 使用方式相比,具有如下特点:</p>
185
- <ul>
186
- <li>相比于 Unicode 语意明确,书写更直观。可以很容易分辨这个 icon 是什么。</li>
187
- <li>因为使用 class 来定义图标,所以当要替换图标时,只需要修改 class 里面的 Unicode 引用。</li>
188
- </ul>
189
- <p>使用步骤如下:</p>
190
- <h3 id="-fontclass-">第一步:引入项目下面生成的 fontclass 代码:</h3>
191
- <pre><code className="language-html">&lt;link rel="stylesheet" href="./iconfont.css"&gt;
192
- </code></pre>
193
- <h3 id="-">第二步:挑选相应图标并获取类名,应用于页面:</h3>
194
- <pre><code className="language-html">&lt;span className="pl-icon-font plicon-xxx"&gt;&lt;/span&gt;
195
- </code></pre>
196
- <blockquote>
197
- <p>"
198
- pl-icon-font" 是你项目下的 font-family。可以通过编辑项目查看,默认是 "iconfont"。</p>
199
- </blockquote>
200
- </div>
201
- </div>
202
- <div className="content symbol">
203
- <ul className="icon_lists dib-box">
204
-
205
- <li className="dib">
206
- <svg className="icon svg-icon" aria-hidden="true">
207
- <use xlink:href="#plicon-plus-lite"></use>
208
- </svg>
209
- <div className="name">plus-large</div>
210
- <div className="code-name">#plicon-plus-lite</div>
211
- </li>
212
-
213
- <li className="dib">
214
- <svg className="icon svg-icon" aria-hidden="true">
215
- <use xlink:href="#plicon-link"></use>
216
- </svg>
217
- <div className="name">link</div>
218
- <div className="code-name">#plicon-link</div>
219
- </li>
220
-
221
- <li className="dib">
222
- <svg className="icon svg-icon" aria-hidden="true">
223
- <use xlink:href="#plicon-code"></use>
224
- </svg>
225
- <div className="name">code</div>
226
- <div className="code-name">#plicon-code</div>
227
- </li>
228
-
229
- <li className="dib">
230
- <svg className="icon svg-icon" aria-hidden="true">
231
- <use xlink:href="#plicon-git"></use>
232
- </svg>
233
- <div className="name">github</div>
234
- <div className="code-name">#plicon-git</div>
235
- </li>
236
-
237
- <li className="dib">
238
- <svg className="icon svg-icon" aria-hidden="true">
239
- <use xlink:href="#plicon-gitee"></use>
240
- </svg>
241
- <div className="name">gitee</div>
242
- <div className="code-name">#plicon-gitee</div>
243
- </li>
244
-
245
- </ul>
246
- <div className="article markdown">
247
- <h2 id="symbol-">Symbol 引用</h2>
248
- <hr>
249
-
250
- <p>这是一种全新的使用方式,应该说这才是未来的主流,也是平台目前推荐的用法。相关介绍可以参考这篇<a href="">文章</a>
251
- 这种用法其实是做了一个 SVG 的集合,与另外两种相比具有如下特点:</p>
252
- <ul>
253
- <li>支持多色图标了,不再受单色限制。</li>
254
- <li>通过一些技巧,支持像字体那样,通过 <code>font-size</code>, <code>color</code> 来调整样式。</li>
255
- <li>兼容性较差,支持 IE9+,及现代浏览器。</li>
256
- <li>浏览器渲染 SVG 的性能一般,还不如 png。</li>
257
- </ul>
258
- <p>使用步骤如下:</p>
259
- <h3 id="-symbol-">第一步:引入项目下面生成的 symbol 代码:</h3>
260
- <pre><code className="language-html">&lt;script src="./iconfont.js"&gt;&lt;/script&gt;
261
- </code></pre>
262
- <h3 id="-css-">第二步:加入通用 CSS 代码(引入一次就行):</h3>
263
- <pre><code className="language-html">&lt;style&gt;
264
- .icon {
265
- width: 1em;
266
- height: 1em;
267
- vertical-align: -0.15em;
268
- fill: currentColor;
269
- overflow: hidden;
270
- }
271
- &lt;/style&gt;
272
- </code></pre>
273
- <h3 id="-">第三步:挑选相应图标并获取类名,应用于页面:</h3>
274
- <pre><code className="language-html">&lt;svg className="icon" aria-hidden="true"&gt;
275
- &lt;use xlink:href="#icon-xxx"&gt;&lt;/use&gt;
276
- &lt;/svg&gt;
277
- </code></pre>
278
- </div>
279
- </div>
280
-
281
- </div>
282
- </div>
283
- <script>
284
- $(document).ready(function () {
285
- $('.tab-container .content:first').show()
286
-
287
- $('#tabs li').click(function (e) {
288
- var tabContent = $('.tab-container .content')
289
- var index = $(this).index()
290
-
291
- if ($(this).hasClass('active')) {
292
- return
293
- } else {
294
- $('#tabs li').removeClass('active')
295
- $(this).addClass('active')
296
-
297
- tabContent.hide().eq(index).fadeIn()
298
- }
299
- })
300
- })
301
- </script>
302
- </body>
303
- </html>
@@ -1,35 +0,0 @@
1
- @font-face {
2
- font-family: "pl-icon-font"; /* Project id 1816939 */
3
- src: url('iconfont.woff2?t=1652858535816') format('woff2'),
4
- url('iconfont.woff?t=1652858535816') format('woff'),
5
- url('iconfont.ttf?t=1652858535816') format('truetype');
6
- }
7
-
8
- .pl-icon-font {
9
- font-family: "pl-icon-font" !important;
10
- font-size: 16px;
11
- font-style: normal;
12
- -webkit-font-smoothing: antialiased;
13
- -moz-osx-font-smoothing: grayscale;
14
- }
15
-
16
- .plicon-plus-lite:before {
17
- content: "\e759";
18
- }
19
-
20
- .plicon-link:before {
21
- content: "\e6fb";
22
- }
23
-
24
- .plicon-code:before {
25
- content: "\e741";
26
- }
27
-
28
- .plicon-git:before {
29
- content: "\e64a";
30
- }
31
-
32
- .plicon-gitee:before {
33
- content: "\e602";
34
- }
35
-
@@ -1 +0,0 @@
1
- !function(t){var e,n,l,o,i,c='<svg><symbol id="plicon-plus-lite" viewBox="0 0 1024 1024"><path d="M490.667 85.333l42.667 0 0 853.333-42.667 0 0-853.333z" ></path><path d="M85.333 490.667l853.333 0 0 42.667-853.333 0 0-42.667z" ></path></symbol><symbol id="plicon-link" viewBox="0 0 1024 1024"><path d="M708.096 617.088l-46.016-44.992 91.008-91.008c37.312-39.36 58.176-82.304 62.528-129.024 4.288-46.656-8.832-86.656-39.552-120-33.28-30.656-73.28-43.776-120-39.488-46.656 4.352-89.6 25.152-128.96 62.528L436.096 346.112l-44.992-46.08 89.984-89.92c52.672-50.048 110.976-77.184 174.976-81.536 64-4.288 119.04 15.168 165.056 58.496 43.328 46.016 62.784 100.992 58.496 164.992-4.352 64-31.552 122.368-81.536 175.04l-89.984 89.984z m-91.008 91.008L527.104 798.08c-52.672 49.984-111.04 77.184-175.04 81.536-64 4.288-118.976-15.168-164.992-58.496-43.328-46.08-62.784-101.056-58.496-165.056 4.352-64 31.488-122.304 81.536-174.976l89.984-89.984 46.016 44.992-91.008 91.008c-37.376 39.296-58.24 82.304-62.528 128.96-4.288 46.72 8.832 86.72 39.488 120 33.344 30.72 73.344 43.84 120 39.552 46.72-4.352 89.664-25.216 129.024-62.528l91.008-91.008 44.992 46.016z m0-361.984l44.992 44.992-270.976 270.976-44.992-44.992 270.976-270.976z" ></path></symbol><symbol id="plicon-code" viewBox="0 0 1045 1024"><path d="M326.857143 799.428571l-28.571429 28.571429q-5.714286 5.714286-13.142857 5.714286t-13.142857-5.714286L5.714286 561.714286q-5.714286-5.714286-5.714286-13.142857t5.714286-13.142858l266.285714-266.285714q5.714286-5.714286 13.142857-5.714286t13.142857 5.714286l28.571429 28.571429q5.714286 5.714286 5.714286 13.142857t-5.714286 13.142857L102.285714 548.571429l224.571429 224.571428q5.714286 5.714286 5.714286 13.142857t-5.714286 13.142857z m337.714286-609.714285L451.428571 927.428571q-2.285714 7.428571-8.857142 11.142858T429.142857 940l-35.428571-9.714286q-7.428571-2.285714-11.142857-8.857143T381.142857 907.428571l213.142857-737.714285q2.285714-7.428571 8.857143-11.142857t13.428572-1.428572l35.428571 9.714286q7.428571 2.285714 11.142857 8.857143t1.428572 14z m375.428571 372l-266.285714 266.285714q-5.714286 5.714286-13.142857 5.714286t-13.142858-5.714286l-28.571428-28.571429q-5.714286-5.714286-5.714286-13.142857t5.714286-13.142857l224.571428-224.571428-224.571428-224.571429q-5.714286-5.714286-5.714286-13.142857t5.714286-13.142857l28.571428-28.571429q5.714286-5.714286 13.142858-5.714286t13.142857 5.714286l266.285714 266.285714q5.714286 5.714286 5.714286 13.142858t-5.714286 13.142857z" fill="" ></path></symbol><symbol id="plicon-git" viewBox="0 0 1024 1024"><path d="M0 520.886c0-69.368 13.51-135.697 40.498-199.02 26.987-63.323 63.322-117.826 109.006-163.51 45.65-45.65 100.154-81.985 163.51-109.006A502.289 502.289 0 0 1 512 8.92c69.335 0 135.663 13.477 198.986 40.497 63.356 26.988 117.86 63.323 163.51 109.007 45.684 45.65 82.02 100.154 109.006 163.51A502.289 502.289 0 0 1 1024 520.852c0 111.318-32.504 211.472-97.511 300.494-64.975 88.989-148.48 150.825-250.484 185.476-5.351 0-9.348-0.99-11.99-2.973-2.676-1.982-4.196-3.997-4.526-6.012a59.458 59.458 0 0 1-0.495-8.984 7.663 7.663 0 0 1-0.991-3.006v-128.99c0-40.63-14.336-75.314-43.008-103.986 76.667-13.345 134.011-41.819 171.999-85.487 37.987-43.669 57.013-96.52 57.013-158.522 0-58.005-18.663-108.346-56.022-150.99 13.345-42.678 11-87.668-6.97-135.003-18.697-1.322-39.011 1.85-61.01 9.513-22 7.663-38.318 14.831-49.02 21.47-10.637 6.673-20.316 13.016-28.97 19.027-38.68-10.669-81.854-16.02-129.486-16.02-47.7 0-90.509 5.351-128.529 16.02-7.333-5.35-15.855-11.164-25.5-17.507-9.68-6.342-26.493-14.005-50.507-22.99-23.982-9.018-45.65-12.85-65.008-11.495-18.663 47.996-20.645 93.646-5.979 136.984-36.665 42.678-54.998 92.986-54.998 150.99 0 62.002 18.663 114.689 55.99 157.994 37.326 43.339 94.67 72.01 171.998 86.016a142.303 142.303 0 0 0-39.969 70.029c-56.683 13.972-96.355 3.963-119.015-30.06-42.017-61.308-79.674-83.307-113.003-65.965-4.69 4.657-3.997 9.48 1.982 14.501 6.012 4.988 14.996 11.66 27.02 19.985 11.99 8.357 20.976 17.507 26.987 27.515 0.661 1.322 2.51 6.177 5.517 14.502a831.917 831.917 0 0 0 8.985 23.981c2.973 7.663 8.654 16.186 17.011 25.5 8.324 9.349 18.003 17.178 29.003 23.52 11 6.309 26.161 11 45.485 14.006 19.324 2.972 41.323 3.138 65.998 0.495v100.484c0 0.991-0.165 2.643-0.495 5.021-0.33 2.312-0.991 3.964-1.982 4.955-0.991 1.024-2.345 2.015-4.03 3.039a12.52 12.52 0 0 1-6.474 1.486c-2.676 0-6.012-0.33-10.009-0.99-101.343-35.345-183.825-97.182-247.51-185.51C31.842 731.037 0 631.577 0 520.92z" ></path></symbol><symbol id="plicon-gitee" viewBox="0 0 1024 1024"><path d="M512 1024C229.2224 1024 0 794.7776 0 512S229.2224 0 512 0s512 229.2224 512 512-229.2224 512-512 512z m259.1488-568.8832H480.4096a25.2928 25.2928 0 0 0-25.2928 25.2928l-0.0256 63.2064c0 13.952 11.3152 25.2928 25.2672 25.2928h177.024c13.9776 0 25.2928 11.3152 25.2928 25.2672v12.6464a75.8528 75.8528 0 0 1-75.8528 75.8528H366.592a25.2928 25.2928 0 0 1-25.2672-25.2928v-240.1792a75.8528 75.8528 0 0 1 75.8272-75.8528h353.9456a25.2928 25.2928 0 0 0 25.2672-25.2928l0.0768-63.2064a25.2928 25.2928 0 0 0-25.2672-25.2928H417.152a189.6192 189.6192 0 0 0-189.6192 189.6448v353.9456c0 13.9776 11.3152 25.2928 25.2928 25.2928h372.9408a170.6496 170.6496 0 0 0 170.6496-170.6496v-145.408a25.2928 25.2928 0 0 0-25.2928-25.2672z" ></path></symbol></svg>',a=(a=document.getElementsByTagName("script"))[a.length-1].getAttribute("data-injectcss"),d=function(t,e){e.parentNode.insertBefore(t,e)};if(a&&!t.__iconfont__svg__cssinject__){t.__iconfont__svg__cssinject__=!0;try{document.write("<style>.svgfont {display: inline-block;width: 1em;height: 1em;fill: currentColor;vertical-align: -0.1em;font-size:16px;}</style>")}catch(t){console&&console.log(t)}}function s(){i||(i=!0,l())}function m(){try{o.documentElement.doScroll("left")}catch(t){return void setTimeout(m,50)}s()}e=function(){var t,e=document.createElement("div");e.innerHTML=c,c=null,(e=e.getElementsByTagName("svg")[0])&&(e.setAttribute("aria-hidden","true"),e.style.position="absolute",e.style.width=0,e.style.height=0,e.style.overflow="hidden",e=e,(t=document.body).firstChild?d(e,t.firstChild):t.appendChild(e))},document.addEventListener?~["complete","loaded","interactive"].indexOf(document.readyState)?setTimeout(e,0):(n=function(){document.removeEventListener("DOMContentLoaded",n,!1),e()},document.addEventListener("DOMContentLoaded",n,!1)):document.attachEvent&&(l=e,o=t.document,i=!1,m(),o.onreadystatechange=function(){"complete"==o.readyState&&(o.onreadystatechange=null,s())})}(window);
@@ -1,44 +0,0 @@
1
- {
2
- "id": "1816939",
3
- "name": "plain",
4
- "font_family": "pl-icon-font",
5
- "css_prefix_text": "plicon-",
6
- "description": "",
7
- "glyphs": [
8
- {
9
- "icon_id": "722169",
10
- "name": "plus-large",
11
- "font_class": "plus-lite",
12
- "unicode": "e759",
13
- "unicode_decimal": 59225
14
- },
15
- {
16
- "icon_id": "11613900",
17
- "name": "link",
18
- "font_class": "link",
19
- "unicode": "e6fb",
20
- "unicode_decimal": 59131
21
- },
22
- {
23
- "icon_id": "1663145",
24
- "name": "code",
25
- "font_class": "code",
26
- "unicode": "e741",
27
- "unicode_decimal": 59201
28
- },
29
- {
30
- "icon_id": "7334992",
31
- "name": "github",
32
- "font_class": "git",
33
- "unicode": "e64a",
34
- "unicode_decimal": 58954
35
- },
36
- {
37
- "icon_id": "10636151",
38
- "name": "gitee",
39
- "font_class": "gitee",
40
- "unicode": "e602",
41
- "unicode_decimal": 58882
42
- }
43
- ]
44
- }