comparison fonts/fontello/demo.html @ 77:7bc307f36741

fonts (icons): added "download" and "trash-empty" icons
author Goffi <goffi@goffi.org>
date Fri, 19 Jun 2020 16:50:27 +0200
parents 0af8e53c638e
children 54e1f518d7ad
comparison
equal deleted inserted replaced
76:0af8e53c638e 77:7bc307f36741
227 .i-code { 227 .i-code {
228 display: none; 228 display: none;
229 } 229 }
230 @font-face { 230 @font-face {
231 font-family: 'fontello'; 231 font-family: 'fontello';
232 src: url('./font/fontello.eot?79662878'); 232 src: url('./font/fontello.eot?34382570');
233 src: url('./font/fontello.eot?79662878#iefix') format('embedded-opentype'), 233 src: url('./font/fontello.eot?34382570#iefix') format('embedded-opentype'),
234 url('./font/fontello.woff?79662878') format('woff'), 234 url('./font/fontello.woff?34382570') format('woff'),
235 url('./font/fontello.ttf?79662878') format('truetype'), 235 url('./font/fontello.ttf?34382570') format('truetype'),
236 url('./font/fontello.svg?79662878#fontello') format('svg'); 236 url('./font/fontello.svg?34382570#fontello') format('svg');
237 font-weight: normal; 237 font-weight: normal;
238 font-style: normal; 238 font-style: normal;
239 } 239 }
240 240
241 241
242 .demo-icon 242 .demo-icon
243 { 243 {
244 font-family: "fontello"; 244 font-family: "fontello";
245 font-style: normal; 245 font-style: normal;
246 font-weight: normal; 246 font-weight: normal;
247 speak: none; 247 speak: never;
248 248
249 display: inline-block; 249 display: inline-block;
250 text-decoration: inherit; 250 text-decoration: inherit;
251 width: 1em; 251 width: 1em;
252 margin-right: .2em; 252 margin-right: .2em;
363 <div class="the-icons span3" title="Code: 0xe82a"><i class="demo-icon icon-person">&#xe82a;</i> <span class="i-name">icon-person</span><span class="i-code">0xe82a</span></div> 363 <div class="the-icons span3" title="Code: 0xe82a"><i class="demo-icon icon-person">&#xe82a;</i> <span class="i-name">icon-person</span><span class="i-code">0xe82a</span></div>
364 <div class="the-icons span3" title="Code: 0xe82b"><i class="demo-icon icon-key">&#xe82b;</i> <span class="i-name">icon-key</span><span class="i-code">0xe82b</span></div> 364 <div class="the-icons span3" title="Code: 0xe82b"><i class="demo-icon icon-key">&#xe82b;</i> <span class="i-name">icon-key</span><span class="i-code">0xe82b</span></div>
365 </div> 365 </div>
366 <div class="row"> 366 <div class="row">
367 <div class="the-icons span3" title="Code: 0xe82c"><i class="demo-icon icon-mail">&#xe82c;</i> <span class="i-name">icon-mail</span><span class="i-code">0xe82c</span></div> 367 <div class="the-icons span3" title="Code: 0xe82c"><i class="demo-icon icon-mail">&#xe82c;</i> <span class="i-name">icon-mail</span><span class="i-code">0xe82c</span></div>
368 <div class="the-icons span3" title="Code: 0xe82d"><i class="demo-icon icon-download">&#xe82d;</i> <span class="i-name">icon-download</span><span class="i-code">0xe82d</span></div>
369 <div class="the-icons span3" title="Code: 0xe82e"><i class="demo-icon icon-trash-empty">&#xe82e;</i> <span class="i-name">icon-trash-empty</span><span class="i-code">0xe82e</span></div>
368 <div class="the-icons span3" title="Code: 0xf0e0"><i class="demo-icon icon-mail-filled">&#xf0e0;</i> <span class="i-name">icon-mail-filled</span><span class="i-code">0xf0e0</span></div> 370 <div class="the-icons span3" title="Code: 0xf0e0"><i class="demo-icon icon-mail-filled">&#xf0e0;</i> <span class="i-name">icon-mail-filled</span><span class="i-code">0xf0e0</span></div>
371 </div>
372 <div class="row">
369 <div class="the-icons span3" title="Code: 0xf0e5"><i class="demo-icon icon-comment-empty">&#xf0e5;</i> <span class="i-name">icon-comment-empty</span><span class="i-code">0xf0e5</span></div> 373 <div class="the-icons span3" title="Code: 0xf0e5"><i class="demo-icon icon-comment-empty">&#xf0e5;</i> <span class="i-name">icon-comment-empty</span><span class="i-code">0xf0e5</span></div>
370 <div class="the-icons span3" title="Code: 0xf100"><i class="demo-icon icon-angle-double-left">&#xf100;</i> <span class="i-name">icon-angle-double-left</span><span class="i-code">0xf100</span></div> 374 <div class="the-icons span3" title="Code: 0xf100"><i class="demo-icon icon-angle-double-left">&#xf100;</i> <span class="i-name">icon-angle-double-left</span><span class="i-code">0xf100</span></div>
371 </div>
372 <div class="row">
373 <div class="the-icons span3" title="Code: 0xf101"><i class="demo-icon icon-angle-double-right">&#xf101;</i> <span class="i-name">icon-angle-double-right</span><span class="i-code">0xf101</span></div> 375 <div class="the-icons span3" title="Code: 0xf101"><i class="demo-icon icon-angle-double-right">&#xf101;</i> <span class="i-name">icon-angle-double-right</span><span class="i-code">0xf101</span></div>
374 <div class="the-icons span3" title="Code: 0xf115"><i class="demo-icon icon-folder-open-empty">&#xf115;</i> <span class="i-name">icon-folder-open-empty</span><span class="i-code">0xf115</span></div> 376 <div class="the-icons span3" title="Code: 0xf115"><i class="demo-icon icon-folder-open-empty">&#xf115;</i> <span class="i-name">icon-folder-open-empty</span><span class="i-code">0xf115</span></div>
377 </div>
378 <div class="row">
375 <div class="the-icons span3" title="Code: 0xf127"><i class="demo-icon icon-unlink">&#xf127;</i> <span class="i-name">icon-unlink</span><span class="i-code">0xf127</span></div> 379 <div class="the-icons span3" title="Code: 0xf127"><i class="demo-icon icon-unlink">&#xf127;</i> <span class="i-name">icon-unlink</span><span class="i-code">0xf127</span></div>
376 <div class="the-icons span3" title="Code: 0xf132"><i class="demo-icon icon-shield">&#xf132;</i> <span class="i-name">icon-shield</span><span class="i-code">0xf132</span></div> 380 <div class="the-icons span3" title="Code: 0xf132"><i class="demo-icon icon-shield">&#xf132;</i> <span class="i-name">icon-shield</span><span class="i-code">0xf132</span></div>
377 </div>
378 <div class="row">
379 <div class="the-icons span3" title="Code: 0xf142"><i class="demo-icon icon-dot-3-vert">&#xf142;</i> <span class="i-name">icon-dot-3-vert</span><span class="i-code">0xf142</span></div> 381 <div class="the-icons span3" title="Code: 0xf142"><i class="demo-icon icon-dot-3-vert">&#xf142;</i> <span class="i-name">icon-dot-3-vert</span><span class="i-code">0xf142</span></div>
380 <div class="the-icons span3" title="Code: 0xf148"><i class="demo-icon icon-level-up">&#xf148;</i> <span class="i-name">icon-level-up</span><span class="i-code">0xf148</span></div> 382 <div class="the-icons span3" title="Code: 0xf148"><i class="demo-icon icon-level-up">&#xf148;</i> <span class="i-name">icon-level-up</span><span class="i-code">0xf148</span></div>
383 </div>
384 <div class="row">
381 <div class="the-icons span3" title="Code: 0xf1c5"><i class="demo-icon icon-file-image">&#xf1c5;</i> <span class="i-name">icon-file-image</span><span class="i-code">0xf1c5</span></div> 385 <div class="the-icons span3" title="Code: 0xf1c5"><i class="demo-icon icon-file-image">&#xf1c5;</i> <span class="i-name">icon-file-image</span><span class="i-code">0xf1c5</span></div>
382 <div class="the-icons span3" title="Code: 0xf1c7"><i class="demo-icon icon-file-audio">&#xf1c7;</i> <span class="i-name">icon-file-audio</span><span class="i-code">0xf1c7</span></div> 386 <div class="the-icons span3" title="Code: 0xf1c7"><i class="demo-icon icon-file-audio">&#xf1c7;</i> <span class="i-name">icon-file-audio</span><span class="i-code">0xf1c7</span></div>
383 </div>
384 <div class="row">
385 <div class="the-icons span3" title="Code: 0xf1c8"><i class="demo-icon icon-file-video">&#xf1c8;</i> <span class="i-name">icon-file-video</span><span class="i-code">0xf1c8</span></div> 387 <div class="the-icons span3" title="Code: 0xf1c8"><i class="demo-icon icon-file-video">&#xf1c8;</i> <span class="i-name">icon-file-video</span><span class="i-code">0xf1c8</span></div>
386 <div class="the-icons span3" title="Code: 0xf1e0"><i class="demo-icon icon-share">&#xf1e0;</i> <span class="i-name">icon-share</span><span class="i-code">0xf1e0</span></div> 388 <div class="the-icons span3" title="Code: 0xf1e0"><i class="demo-icon icon-share">&#xf1e0;</i> <span class="i-name">icon-share</span><span class="i-code">0xf1e0</span></div>
389 </div>
390 <div class="row">
387 <div class="the-icons span3" title="Code: 0xf1e6"><i class="demo-icon icon-plug">&#xf1e6;</i> <span class="i-name">icon-plug</span><span class="i-code">0xf1e6</span></div> 391 <div class="the-icons span3" title="Code: 0xf1e6"><i class="demo-icon icon-plug">&#xf1e6;</i> <span class="i-name">icon-plug</span><span class="i-code">0xf1e6</span></div>
388 <div class="the-icons span3" title="Code: 0xf1fc"><i class="demo-icon icon-brush">&#xf1fc;</i> <span class="i-name">icon-brush</span><span class="i-code">0xf1fc</span></div> 392 <div class="the-icons span3" title="Code: 0xf1fc"><i class="demo-icon icon-brush">&#xf1fc;</i> <span class="i-name">icon-brush</span><span class="i-code">0xf1fc</span></div>
389 </div>
390 <div class="row">
391 <div class="the-icons span3" title="Code: 0xf233"><i class="demo-icon icon-server">&#xf233;</i> <span class="i-name">icon-server</span><span class="i-code">0xf233</span></div> 393 <div class="the-icons span3" title="Code: 0xf233"><i class="demo-icon icon-server">&#xf233;</i> <span class="i-name">icon-server</span><span class="i-code">0xf233</span></div>
392 </div> 394 </div>
393 </div> 395 </div>
394 <div class="container footer">Generated by <a href="http://fontello.com">fontello.com</a></div> 396 <div class="container footer">Generated by <a href="http://fontello.com">fontello.com</a></div>
395 </body> 397 </body>