From 29bc78857c54212b0c276ab0c24dca306d3ca489 Mon Sep 17 00:00:00 2001 From: edent Date: Mon, 27 Nov 2017 17:33:39 +0000 Subject: [PATCH] Updated Radius Tool --- javascript.js | 45 ----------------- radius.html | 136 +++++++++++++++++++++++++++++++++----------------- 2 files changed, 91 insertions(+), 90 deletions(-) delete mode 100644 javascript.js diff --git a/javascript.js b/javascript.js deleted file mode 100644 index fcdcdf97..00000000 --- a/javascript.js +++ /dev/null @@ -1,45 +0,0 @@ -var items = [ - 'amazon', 'github', 'html5', 'mastodon', 'reddit', 'soundcloud', - 'tox', 'wechat', 'youtube', 'dropbox', 'gitlab', 'instagram', - 'paypal', 'rss', 'spotify', 'tumblr', 'whatsapp', 'email', - 'google_plus','linkedin', 'pdf', 'skype', 'stackoverflow','twitter', - 'wikipedia', 'facebook', 'google', 'lock', 'phone', 'slideshare', - 'steam', 'vimeo', 'wire', 'flickr', 'hackernews', 'mail', - 'pinterest', 'snapchat', 'telegram', 'vk', 'wordpress', 'meetup', - 'line', 'lastpass', 'windows', 'digidentity','ubuntu', 'bitbucket', - 'apple', 'npm', 'docker', 'symantec', 'yubico', 'keybase', - 'ebay', 'evernote', 'kickstarter','yahoo', 'bitcoin', 'bluetooth', - 'ibm', 'yammer', 'android', 'authy', 'blogger', 'cloudflare', - 'codepen', 'digitalocean','discord', 'medium', 'airbnb', 'wifi', - 'delicious', 'disqus', 'ghost', 'opensource', 'patreon', 'trello', - 'intel', 'badoo' -]; - -var container = document.querySelector('.icons'); -var range = document.querySelector('input[type="range"]'); -var number = document.querySelector('input.rangeout'); -range.addEventListener('input', function(e){ - number.value = parseInt(e.target.value); - render(e.target.value); -}); - -number.addEventListener('input', function(e){ - range.value = parseInt(e.target.value); - render(e.target.value); -}); - -var urls = items.map(item => 'tiny/' + item + '.svg'); -var icons; -Promise.all(urls.map(url => fetch(url).then(res => res.text()))).then(all => { - icons = all; - render(range.value); -}); - -var render = function(radius = 15){ - console.log('Rendering!', icons); - - icons = icons.map(icon => { - return icon.replace(/rx\=\"\d{0,2}\%/, 'rx="' + radius + '%"'); - }); - container.innerHTML = '
' + icons.join('
') + '
'; -} diff --git a/radius.html b/radius.html index 277d5239..1301ec81 100644 --- a/radius.html +++ b/radius.html @@ -1,50 +1,96 @@ - - - Super Tiny Social Icons - Radius Tool - - - - - -

Super Tiny Social Icons

- Download the SuperTinySocialIcons on GitHub -
-

Radius %

- - -
+ + + Super Tiny Icons - SVG Radius Tool + + + + + +

Super Tiny Icons

+ Download the SuperTinyIcons SVGs on GitHub +
+

Radius %

+ + +
-
+
- - + +