From 2a7a1ac1126f2b7277d70c1fd71bd5e956202a2a Mon Sep 17 00:00:00 2001 From: Metaa Date: Thu, 30 Aug 2018 09:25:05 +0200 Subject: [PATCH 1/6] Add devRant (#954) * Add devRant * Add "icon" to the SVG title (squash) * Fixed the color of the devRant logo (squash) --- _data/simple-icons.json | 5 +++++ icons/devrant.svg | 1 + 2 files changed, 6 insertions(+) create mode 100644 icons/devrant.svg diff --git a/_data/simple-icons.json b/_data/simple-icons.json index 24dda25b..b2abee44 100644 --- a/_data/simple-icons.json +++ b/_data/simple-icons.json @@ -400,6 +400,11 @@ "hex": "05CC47", "source": "http://help.deviantart.com/21" }, + { + "title": "devRant", + "hex": "F99A66", + "source": "https://devrant.com" + }, { "title": "dev.to", "hex": "0A0A0A", diff --git a/icons/devrant.svg b/icons/devrant.svg new file mode 100644 index 00000000..0300f01e --- /dev/null +++ b/icons/devrant.svg @@ -0,0 +1 @@ +devRant icon From dd97f13ff47798169435ec6593f993fa3a67afa1 Mon Sep 17 00:00:00 2001 From: Metaa Date: Fri, 31 Aug 2018 10:20:46 +0200 Subject: [PATCH 2/6] Add a missing dash to the svgo precision option in the contributing guide (#962) --- CONTRIBUTING.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md index 925d8ed9..09ea6038 100644 --- a/CONTRIBUTING.md +++ b/CONTRIBUTING.md @@ -77,7 +77,7 @@ All icons in Simple Icons have been optimized with the [SVGO tool](https://githu * Install SVGO * With npm: `npm install -g svgo` * With Homebrew: `brew install svgo` - * Run the following command `svgo -precision=3 icon.svg icon.min.svg` + * Run the following command `svgo --precision=3 icon.svg icon.min.svg` * Check if there is a loss of quality in the output, if so increase the precision. * The [SVGOMG Online Tool](https://jakearchibald.github.io/svgomg/) * Click "Open SVG" and select an SVG file. From 27d076b88c08c3a60e8999e018d9e3a26f0e046f Mon Sep 17 00:00:00 2001 From: Metaa Date: Fri, 31 Aug 2018 10:23:11 +0200 Subject: [PATCH 3/6] Add rollup.js (#961) * Add Rollup * Actually SVGO the SVG * Changed the source URL --- _data/simple-icons.json | 5 +++++ icons/rollup-dot-js.svg | 1 + 2 files changed, 6 insertions(+) create mode 100644 icons/rollup-dot-js.svg diff --git a/_data/simple-icons.json b/_data/simple-icons.json index b2abee44..e9af6142 100644 --- a/_data/simple-icons.json +++ b/_data/simple-icons.json @@ -1550,6 +1550,11 @@ "hex": "5E9EE3", "source": "https://riseup.net/en/about-us/images" }, + { + "title": "rollup.js", + "hex": "EC4A3F", + "source": "https://rollupjs.org/" + }, { "title": "Roots", "hex": "525DDC", diff --git a/icons/rollup-dot-js.svg b/icons/rollup-dot-js.svg new file mode 100644 index 00000000..a79c3d64 --- /dev/null +++ b/icons/rollup-dot-js.svg @@ -0,0 +1 @@ +rollup.js icon From 32a057cbf0d313608aa06ca2da71785aa54303a3 Mon Sep 17 00:00:00 2001 From: Metaa Date: Fri, 31 Aug 2018 10:26:30 +0200 Subject: [PATCH 4/6] Add Mixer (#960) * Add Mixer * Changed the source URL --- _data/simple-icons.json | 5 +++++ icons/mixer.svg | 1 + 2 files changed, 6 insertions(+) create mode 100644 icons/mixer.svg diff --git a/_data/simple-icons.json b/_data/simple-icons.json index e9af6142..fd22aac3 100644 --- a/_data/simple-icons.json +++ b/_data/simple-icons.json @@ -1185,6 +1185,11 @@ "hex": "314359", "source": "https://www.mixcloud.com/branding" }, + { + "title": "Mixer", + "hex": "002050", + "source": "https://github.com/mixer/branding-kit/" + }, { "title": "Monero", "hex": "FF6600", diff --git a/icons/mixer.svg b/icons/mixer.svg new file mode 100644 index 00000000..3bf0cebd --- /dev/null +++ b/icons/mixer.svg @@ -0,0 +1 @@ +Mixer icon From 07470292057611e15188c15884d8425d307d186c Mon Sep 17 00:00:00 2001 From: Eric Cornelissen Date: Sat, 1 Sep 2018 12:20:04 +0300 Subject: [PATCH 5/6] Website/sort and search (#949) * Disable sort buttons when there is a search query * Restore sorting order when search query is removed * Update comment * Add button to sort by relevance (non-functional) As discussed in #949. Relatedly also removed the functionality that disabled the "sort by color" and "sort alphabetically" buttons (and related styling). * Update sorting behaviour Refactored to sorting algorithms into a single function and updated relevant code. The "sort by relenvance" button is now functional, and is automatically actived when the user starts searching, but not when updating their search query. * Restore sorting ordre when search query is removed * Only sort when needed * Refactor activing a sorting button/selecting a soring order * Renaming variables and functions * Add colors to "order by relevance" button on hover --- index.html | 1 + site_script.js | 84 +++++++++++++++++++++++++++++++++++--------------- stylesheet.css | 4 +++ 3 files changed, 64 insertions(+), 25 deletions(-) diff --git a/index.html b/index.html index 8e9b4c6a..0099d379 100644 --- a/index.html +++ b/index.html @@ -207,6 +207,7 @@ Sort by color Sort alphabetically + Sort by relevance
  • diff --git a/site_script.js b/site_script.js index 852df751..6c8742fa 100644 --- a/site_script.js +++ b/site_script.js @@ -1,12 +1,16 @@ (function(document) { + var $grid = document.querySelector('.grid'), + $icons = $grid.querySelectorAll('.grid-item:not(.grid-item--ad)'), + $search = document.querySelector('.search'), + $searchClose = $search.querySelector('.search__close'), + $searchInput = $search.querySelector('input'), + $sortColor = document.getElementById('sort-color'), + $sortAlphabetically = document.getElementById('sort-alphabetically'), + $sortRelevance = document.getElementById('sort-relevance'); + var queryParameter = 'q', - $grid = document.querySelector('.grid'), - $icons = $grid.querySelectorAll('.grid-item:not(.grid-item--ad)'), - $search = document.querySelector('.search'), - $searchClose = $search.querySelector('.search__close'), - $searchInput = $search.querySelector('input'), - $sortColor = document.getElementById('sort-color'), - $sortAlpha = document.getElementById('sort-alphabetically'); + previousQuery = null, + previousOrder = $sortColor; // Remove the "disabled" attribute from the search input $searchInput.setAttribute('title', 'Search Simple Icons'); @@ -96,18 +100,51 @@ }).sort(function(a, b) { return a.score - b.score; }).forEach(function(item, index) { - item.element.classList.remove('hidden'); - - if (query !== '') { - // Order according to relevance (i.e. score) if there is a query - item.element.style.order = index; - } else { - // Use color-based order if there is no query - item.element.style.removeProperty('order'); - } + var element = item.element; + element.setAttribute('data-relevance', index); + element.classList.remove('hidden'); }); $grid.classList.toggle('search__empty', hiddenCounter == icons.length); + if (query === '') { + if ($sortRelevance.classList.contains('active')) { + selectSortingOrder(previousOrder); + } + + $sortRelevance.setAttribute('display', 'none'); + previousQuery = null; + } else { + if (previousQuery === null) { + selectSortingOrder($sortRelevance); + } + + previousQuery = query; + } + } + function sort() { + if ($sortColor.classList.contains('active')) { + $icons.forEach(icon => { icon.style.order = null; }); + } else if ($sortAlphabetically.classList.contains('active')) { + $icons.forEach(icon => { icon.style.order = icon.getAttribute('order'); }); + } else if ($sortRelevance.classList.contains('active')) { + $icons.forEach(icon => { icon.style.order = icon.getAttribute('data-relevance'); }); + } + } + function selectSortingOrder(selected) { + selected.classList.add('active'); + + var options = [$sortColor, $sortAlphabetically, $sortRelevance]; + for (var option of options.filter(option => option !== selected)) { + option.classList.remove('active'); + } + + if (selected !== $sortRelevance) { + previousOrder = selected; + } else { + $sortRelevance.removeAttribute('display'); + } + + sort(); } document.addEventListener('DOMContentLoaded', function() { @@ -142,15 +179,12 @@ }, false); $sortColor.addEventListener('click', function() { - $icons.forEach(icon => { icon.style.order = null; }); - - $sortColor.classList.add('active'); - $sortAlpha.classList.remove('active'); + selectSortingOrder($sortColor); }); - $sortAlpha.addEventListener('click', function() { - $icons.forEach(icon => { icon.style.order = icon.getAttribute('order'); }); - - $sortAlpha.classList.add('active'); - $sortColor.classList.remove('active'); + $sortAlphabetically.addEventListener('click', function() { + selectSortingOrder($sortAlphabetically); + }); + $sortRelevance.addEventListener('click', function() { + selectSortingOrder($sortRelevance); }); })( document ); diff --git a/stylesheet.css b/stylesheet.css index d97e8971..522420b1 100644 --- a/stylesheet.css +++ b/stylesheet.css @@ -202,6 +202,10 @@ a.share-button { opacity: 1; } +#sort-relevance:hover path:not(:nth-of-type(1)) { + fill: #fbc02d; +} + .grid { display: flex; flex-wrap: wrap; From 26b79531d8c4373c3bc85d6bf2b8dab2930c3153 Mon Sep 17 00:00:00 2001 From: Johan Fagerberg Date: Sat, 1 Sep 2018 11:21:10 +0200 Subject: [PATCH 6/6] Version bump --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 3dff4bb1..9990e53e 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "simple-icons", - "version": "1.8.6", + "version": "1.8.7", "description": "SVG icons for popular brands https://simpleicons.org", "homepage": "https://www.simpleicons.org", "keywords": [