diff options
| author | codecalm <codecalm@gmail.com> | 2020-03-03 23:45:23 +0100 |
|---|---|---|
| committer | codecalm <codecalm@gmail.com> | 2020-03-04 15:45:23 +0100 |
| commit | 0690fb8c4d1dc1e14e6920e2b7983dfb57751ffe (patch) | |
| tree | 6fc5e70332005474821595150584bb824d94cdf7 /list.html | |
| parent | cloud icons (diff) | |
| download | tabler-icons-0690fb8c4d1dc1e14e6920e2b7983dfb57751ffe.tar.xz | |
next part of icons
Diffstat (limited to 'list.html')
| -rw-r--r-- | list.html | 70 |
1 files changed, 70 insertions, 0 deletions
diff --git a/list.html b/list.html new file mode 100644 index 00000000..af5d0cab --- /dev/null +++ b/list.html @@ -0,0 +1,70 @@ +--- +--- +<!doctype html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <meta name="viewport" + content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"> + <meta http-equiv="X-UA-Compatible" content="ie=edge"> + + <link rel="stylesheet" href="{{ site.baseurl }}/style.css"> + <title>Tabler Icons</title> + + <style> + body { + display: none; + } + </style> +</head> +<body> +<div class="container"> + <div class="box"> + + <div class="mb"> + <div class="icons-list"> + {% for icon in site.icons %} + {% assign name = icon.slug %} + <a href="#" class="icons-list-icon js-icon" title="{{ icon.slug }}" data-icon="{{ name }}"> + {% include icon.html name=name %} + </a> + {% endfor %} + </div> + </div> + </div> +</div> + +<script src="{{ site.baseurl }}/jquery-3.4.1.slim.min.js"></script> +<script> + + $(document).ready(function () { + $('body') + .on('click', '.js-icon', function (e) { + var icon = $(this).attr('data-icon'); + + $('.js-icon-name').html(icon); + localStorage.setItem('icon', icon); + + $('.js-icon-manager svg').replaceWith($(this).find('>svg:eq(0)').clone()); + + e.preventDefault(); + return false; + }) + .on('input', '.js-input-range', function(e){ + $('.js-icon svg').css('stroke-width', $(this).val()); + + e.preventDefault(); + return false; + }); + + + var icon = localStorage.getItem('icon'); + if (icon) { + $('.js-icon[data-icon="' + icon + '"]').eq(0).click(); + } + + document.body.style.display = "block" + }); +</script> +</body> +</html> |