web/simple-icons
1
0
Fork 0
mirror of https://github.com/simple-icons/simple-icons.git synced 2024-11-16 00:59:07 +02:00
Code Releases Activity
92402cd5df
simple-icons/index.html

272 lines
19 KiB
HTML
Raw Normal View History

Adds basic template with navbar
2017-04-23 18:31:56 +02:00
---
---
Removes relative includes from page template
2017-04-26 19:43:58 +02:00
{% assign iconsUnsortedString = "" %}
{% assign greyscaleIconsUnsortedString = "" %}
{% for icon in site.data.simple-icons.icons %}
{% assign title = icon.title %}
Update filemapping, ampersand (#977) * Replace ampersand to avoid problems with filenames Together with some examples as test * Revert filename changes for testing purposes
2018-09-10 17:53:59 +02:00
Remove potentional extra dashes from title->filename mapping Removes dashes at start/end of filename that would appear as result of mapping This is *very* hacky, but such is Jekyll
2018-07-21 13:22:33 +02:00
{% assign filename = icon.title %}
Update filemapping, ampersand (#977) * Replace ampersand to avoid problems with filenames Together with some examples as test * Revert filename changes for testing purposes
2018-09-10 17:53:59 +02:00
{% comment %} Replace a period by 'dot' {% endcomment %}
Remove potentional extra dashes from title->filename mapping Removes dashes at start/end of filename that would appear as result of mapping This is *very* hacky, but such is Jekyll
2018-07-21 13:22:33 +02:00
{% assign _splitFilename = filename | split: "" %}
{% if _splitFilename.first == "." %}
{% assign filename = filename | replace_first: ".", "dot-" %}
{% endif %}
{% if _splitFilename.last == "." %}
{% assign _filenameLenMin1 = filename | size | minus: 1 %}
{% assign filename = filename | slice: 0, _filenameLenMin1 | append: "-dot" %}
{% endif %}
Update filemapping, ampersand (#977) * Replace ampersand to avoid problems with filenames Together with some examples as test * Revert filename changes for testing purposes
2018-09-10 17:53:59 +02:00
{% comment %} Replace an ampersand by 'and' {% endcomment %}
{% if _splitFilename.first == "&" %}
{% assign filename = filename | replace_first: "&", "and-" %}
{% endif %}
{% if _splitFilename.last == "&" %}
{% assign _filenameLenMin1 = filename | size | minus: 1 %}
{% assign filename = filename | slice: 0, _filenameLenMin1 | append: "-and" %}
{% endif %}
Handle accented brand names in Jekyll (#1463) * Handle accented brand names in Jekyll
2019-06-09 16:12:38 +02:00
{% assign filename = filename | downcase %}
{% assign filename = filename | replace: "+", "plus" %}
{% assign filename = filename | replace: ".", "-dot-" %}
{% assign filename = filename | replace: "&", "-and-" %}
{% assign filename = filename | replace: " ", "" | replace: "!", "" | replace: "’", "" %}
{% assign filename = filename | replace: "à", "a" | replace: "á", "a" | replace: "â", "a" | replace: "ã", "a" | replace: "ä", "a" %}
{% assign filename = filename | replace: "ç", "c" %}
{% assign filename = filename | replace: "è", "e" | replace: "é", "e" | replace: "ê", "e" | replace: "ë", "e" %}
{% assign filename = filename | replace: "ì", "i" | replace: "í", "i" | replace: "î", "i" | replace: "ï", "i" %}
{% assign filename = filename | replace: "ñ", "n" %}
{% assign filename = filename | replace: "ò", "o" | replace: "ó", "o" | replace: "ô", "o" | replace: "õ", "o" | replace: "ö", "o" %}
{% assign filename = filename | replace: "ù", "u" | replace: "ú", "u" | replace: "û", "u" | replace: "ü", "u" %}
{% assign filename = filename | replace: "ý", "y" | replace: "ÿ", "y" %}
Update filemapping, ampersand (#977) * Replace ampersand to avoid problems with filenames Together with some examples as test * Revert filename changes for testing purposes
2018-09-10 17:53:59 +02:00
Removes relative includes from page template
2017-04-26 19:43:58 +02:00
{% assign hex = icon.hex %}
{% assign hex = icon.hex %}
{% assign hexCharacter1 = hex | slice: 0, 1 %}
{% assign hexCharacter2 = hex | slice: 1, 1 %}
{% assign hexCharacter3 = hex | slice: 2, 1 %}
{% assign hexCharacter4 = hex | slice: 3, 1 %}
{% assign hexCharacter5 = hex | slice: 4, 1 %}
{% assign hexCharacter6 = hex | slice: 5, 1 %}
{% capture hexCharacterString %}{{ hexCharacter1 }},{{ hexCharacter2 }},{{ hexCharacter3 }},{{ hexCharacter4 }},{{ hexCharacter5 }},{{ hexCharacter6 }}{% endcapture %}
{% assign hexCharacterArray = hexCharacterString | split: "," %}
{% assign rgbString = "" %}
{% for hexCharacter in hexCharacterArray %}
{% case hexCharacter %}
{% when "A" %}
{% assign rgbString = rgbString | append: "10" %}
{% when "B" %}
{% assign rgbString = rgbString | append: "11" %}
{% when "C" %}
{% assign rgbString = rgbString | append: "12" %}
{% when "D" %}
{% assign rgbString = rgbString | append: "13" %}
{% when "E" %}
{% assign rgbString = rgbString | append: "14" %}
{% when "F" %}
{% assign rgbString = rgbString | append: "15" %}
{% else %}
{% assign rgbString = rgbString | append: hexCharacter %}
{% endcase %}
{% unless forloop.last %}{% assign rgbString = rgbString | append: "," %}{% endunless %}
{% endfor %}
Order icons alphabetically
2017-12-21 23:32:01 +02:00
Removes relative includes from page template
2017-04-26 19:43:58 +02:00
{% assign rgbArray = rgbString | split: "," %}
{% assign rgbRed = rgbArray[0] | times: 16 | plus: rgbArray[1] | divided_by: 255.0 | round: 2 %}
{% assign rgbGreen = rgbArray[2] | times: 16 | plus: rgbArray[3] | divided_by: 255.0 | round: 2 %}
{% assign rgbBlue = rgbArray[4] | times: 16 | plus: rgbArray[5] | divided_by: 255.0 | round: 2 %}
{% assign rgbMax = 0.0 %}
Order icons alphabetically
2017-12-21 23:32:01 +02:00
Removes relative includes from page template
2017-04-26 19:43:58 +02:00
{% if rgbRed > rgbMax %}
{% assign rgbMax = rgbRed %}
{% endif %}
{% if rgbGreen > rgbMax %}
{% assign rgbMax = rgbGreen %}
{% endif %}
{% if rgbBlue > rgbMax %}
{% assign rgbMax = rgbBlue %}
{% endif %}
{% assign rgbMin = 1.0 %}
{% if rgbRed < rgbMin %}
{% assign rgbMin = rgbRed %}
{% endif %}
{% if rgbGreen < rgbMin %}
{% assign rgbMin = rgbGreen %}
{% endif %}
{% if rgbBlue < rgbMin %}
{% assign rgbMin = rgbBlue %}
{% endif %}
Contrast ratio proof of concept Initial implementation of making icons/text dark on a light background, as suggested in issue #480. This implementation is based on the suggestion by @pushrax, using the formula provided on http://chilliant.blogspot.nl/2012/08/srgb-approximations-for-hlsl.html Note that this implementation is not yet as desired, as it still darkens some icons we might not want darkened and the dark color is currently full black. I also used this link in the process of making this: http://springmeier.org/www/contrastcalculator/index.php
2017-08-02 15:43:02 +02:00
{% if rgbRed <= 0.03928 %}
{% assign lRed = rgbRed | divided_by: 12.92 | times: 0.2126 %}
{% else %}
{% assign lRed = rgbRed | times: 0.3053 | plus: 0.6822 | times: rgbRed | plus: 0.0125 | times: rgbRed | times: 0.2126 %}
{% endif %}
{% if rgbGreen <= 0.03928 %}
{% assign lGreen = rgbGreen | divided_by: 12.92 | times: 0.7152 %}
{% else %}
{% assign lGreen = rgbGreen | times: 0.3053 | plus: 0.6822 | times: rgbGreen | plus: 0.0125 | times: rgbGreen | times: 0.7152 %}
{% endif %}
{% if rgbBlue <= 0.03928 %}
{% assign lBlue = rgbBlue | divided_by: 12.92 | times: 0.0722 %}
{% else %}
{% assign lBlue = rgbBlue | times: 0.3053 | plus: 0.6822 | times: rgbBlue | plus: 0.0125 | times: rgbBlue | times: 0.0722 %}
{% endif %}
Tweak Luminance thresold for darkened icon
2017-08-02 15:48:58 +02:00
{% assign luminance = lRed | plus: lGreen | plus: lBlue %}
{% if luminance >= 0.83 %}
Use BEM naming and inherit colors
2017-08-03 13:13:31 +02:00
{% assign class = "grid-item--dark" %}
Contrast ratio proof of concept Initial implementation of making icons/text dark on a light background, as suggested in issue #480. This implementation is based on the suggestion by @pushrax, using the formula provided on http://chilliant.blogspot.nl/2012/08/srgb-approximations-for-hlsl.html Note that this implementation is not yet as desired, as it still darkens some icons we might not want darkened and the dark color is currently full black. I also used this link in the process of making this: http://springmeier.org/www/contrastcalculator/index.php
2017-08-02 15:43:02 +02:00
{% else %}
Use BEM naming and inherit colors
2017-08-03 13:13:31 +02:00
{% assign class = "grid-item--light" %}
Contrast ratio proof of concept Initial implementation of making icons/text dark on a light background, as suggested in issue #480. This implementation is based on the suggestion by @pushrax, using the formula provided on http://chilliant.blogspot.nl/2012/08/srgb-approximations-for-hlsl.html Note that this implementation is not yet as desired, as it still darkens some icons we might not want darkened and the dark color is currently full black. I also used this link in the process of making this: http://springmeier.org/www/contrastcalculator/index.php
2017-08-02 15:43:02 +02:00
{% endif %}
Removes relative includes from page template
2017-04-26 19:43:58 +02:00
{% assign hslLuminance = rgbMax | plus: rgbMin | times: 50.0 %}
{% assign rgbDelta = rgbMax | minus: rgbMin %}
{% if rgbDelta == 0 %}
{% assign hslHue = 0 %}
{% assign hslSaturation = 0 %}
{% else %}
{% if hslLuminance < 0.5 %}
{% assign rgbMaxPlusMin = rgbMax | plus: rgbMin %}
{% assign hslSaturation = 100 | times: rgbDelta | divided_by: rgbMaxPlusMin %}
{% else %}
{% assign rgbTwoMinusMaxMinusMin = 2 | minus: rgbMax | minus: rgbMin %}
{% assign hslSaturation = 100 | times: rgbDelta | divided_by: rgbTwoMinusMaxMinusMin %}
{% endif %}
{% if rgbMax == rgbRed %}
{% assign hslHue = rgbGreen | minus: rgbBlue | divided_by: rgbDelta | times: 60.0 | modulo: 360.0 %}
{% elsif rgbMax == rgbGreen %}
{% assign hslHue = rgbBlue | minus: rgbRed | divided_by: rgbDelta | plus: 2.0 | times: 60.0 | modulo: 360.0 %}
{% else %}
{% assign hslHue = rgbRed | minus: rgbGreen | divided_by: rgbDelta | plus: 4.0 | times: 60.0 | modulo: 360.0 %}
{% endif %}
{% assign hslHue = hslHue | plus: 90.0 | modulo: 360.0 %}
{% endif %}
Order icons alphabetically
2017-12-21 23:32:01 +02:00
Removes relative includes from page template
2017-04-26 19:43:58 +02:00
{% if hslSaturation < 10 %}
{% assign hslLuminance = hslLuminance | round: 0 | prepend: "000" | slice: -3, 3 %}
Order icons alphabetically
2017-12-21 23:32:01 +02:00
{% capture greyscaleIconsUnsortedString %}{{ greyscaleIconsUnsortedString }}{{ hslLuminance }},{{ filename }},{{ hslHue }},{{ hslSaturation }},{{ hex }},{{ title }},{{ class }},{{ forloop.index }}{% unless forloop.last %};{% endunless %}{% endcapture %}
Removes relative includes from page template
2017-04-26 19:43:58 +02:00
{% else %}
{% assign hslHue = hslHue | round: 0 | prepend: "000" | slice: -3, 3 %}
Order icons alphabetically
2017-12-21 23:32:01 +02:00
{% capture iconsUnsortedString %}{{ iconsUnsortedString }}{{ hslHue }},{{ hslSaturation }},{{ hslLuminance }},{{ filename }},{{ hex }},{{ title }},{{ class }},{{ forloop.index }}{% unless forloop.last %};{% endunless %}{% endcapture %}
Removes relative includes from page template
2017-04-26 19:43:58 +02:00
{% endif %}
{% endfor %}
Extract CSS and JavaScript from HTML Put all of the CSS and most of the JavaScript into their own file. The JavaScript that is left in HTML depends on some Liquid logic present in the HTML.
2018-01-03 19:33:25 +02:00
Order icons alphabetically
2017-12-21 23:32:01 +02:00
{% assign iconsArray = iconsUnsortedString | split: ";" | sort %}
{% assign greyscaleIconsArray = greyscaleIconsUnsortedString | split: ";" | sort | reverse %}
Removes relative includes from page template
2017-04-26 19:43:58 +02:00
Extract CSS and JavaScript from HTML Put all of the CSS and most of the JavaScript into their own file. The JavaScript that is left in HTML depends on some Liquid logic present in the HTML.
2018-01-03 19:33:25 +02:00
{% assign allIconNames = "" %}
{% for icon in iconsArray %}
{% assign iconArray = icon | split: "," %}
Fix inconcistent search results due to search term normalization (#983) Closes #981
2018-09-23 22:19:32 +02:00
{% capture allIconNames %}{{ allIconNames }}"{{ iconArray[5] }}",{% endcapture %}
Extract CSS and JavaScript from HTML Put all of the CSS and most of the JavaScript into their own file. The JavaScript that is left in HTML depends on some Liquid logic present in the HTML.
2018-01-03 19:33:25 +02:00
{% endfor %}
{% for icon in greyscaleIconsArray %}
{% assign iconArray = icon | split: "," %}
Fix inconcistent search results due to search term normalization (#983) Closes #981
2018-09-23 22:19:32 +02:00
{% capture allIconNames %}{{ allIconNames }}"{{ iconArray[5] }}"{% unless forloop.last %},{% endunless %}{% endcapture %}
Extract CSS and JavaScript from HTML Put all of the CSS and most of the JavaScript into their own file. The JavaScript that is left in HTML depends on some Liquid logic present in the HTML.
2018-01-03 19:33:25 +02:00
{% endfor %}
Removes relative includes from page template
2017-04-26 19:43:58 +02:00
<!doctype html>
<html lang="en-gb">
<head>
<meta charset="utf-8">
<meta content="initial-scale=1, shrink-to-fit=no, width=device-width" name="viewport">
<link rel="preconnect" href="//www.google-analytics.com">
<link rel="preconnect" href="//cdn.carbonads.com">
<link rel="preconnect" href="//github.com">
<title>Simple Icons</title>
Adds tweet button, changes microcopy, fixes indentation
2017-05-03 15:22:18 +02:00
<meta name="description" content="Free SVG icons for popular brands.">
Removes relative includes from page template
2017-04-26 19:43:58 +02:00
<meta property="og:type" content="website">
<meta property="og:title" content="Simple Icons">
Adds tweet button, changes microcopy, fixes indentation
2017-05-03 15:22:18 +02:00
<meta property="og:description" content="Free SVG icons for popular brands.">
Removes relative includes from page template
2017-04-26 19:43:58 +02:00
<meta property="og:url" content="https://simpleicons.org">
<meta property="og:site_name" content="Simple Icons">
<meta property="og:image" content="https://simpleicons.org/images/og.png">
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:title" content="Simple Icons">
Adds tweet button, changes microcopy, fixes indentation
2017-05-03 15:22:18 +02:00
<meta name="twitter:description" content="Free SVG icons for popular brands.">
Removes relative includes from page template
2017-04-26 19:43:58 +02:00
<meta name="twitter:site" content="@bathtype">
<meta name="twitter:domain" content="Simple Icons">
<meta name="twitter:image:src" content="https://simpleicons.org/images/og.png">
<link rel="icon" type="image/x-icon" href="https://simpleicons.org/images/favicon.ico">
<link rel="icon" type="image/png" href="https://simpleicons.org/images/favicon.png">
<link rel="apple-touch-icon" href="https://simpleicons.org/images/apple-touch-icon.png">
<link rel="mask-icon" href="https://simpleicons.org/images/logo.svg" color="#111111">
Extract CSS and JavaScript from HTML Put all of the CSS and most of the JavaScript into their own file. The JavaScript that is left in HTML depends on some Liquid logic present in the HTML.
2018-01-03 19:33:25 +02:00
<link rel="stylesheet" href="stylesheet.css" type="text/css">
Move GA tracking snippet to the top as suggested by the GA documentation to improve the tracking process: https://developers.google.com/analytics/devguides/collection/analyticsjs/#the_javascript_tracking_snippet
2017-05-25 21:32:36 +02:00
<script>
Update Google Analytics With the inactivity of @danleech, this changes the GA tracking to one controlled by me (interested contributors can be added to GA upon request)
2017-09-11 21:23:20 +02:00
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-100751516-2', 'auto');
ga('send', 'pageview');
Move GA tracking snippet to the top as suggested by the GA documentation to improve the tracking process: https://developers.google.com/analytics/devguides/collection/analyticsjs/#the_javascript_tracking_snippet
2017-05-25 21:32:36 +02:00
</script>
Extract CSS and JavaScript from HTML Put all of the CSS and most of the JavaScript into their own file. The JavaScript that is left in HTML depends on some Liquid logic present in the HTML.
2018-01-03 19:33:25 +02:00
<script>
function normalizeSearchTerm(value) {
Fix inconcistent search results due to search term normalization (#983) Closes #981
2018-09-23 22:19:32 +02:00
return value.toLowerCase();
Extract CSS and JavaScript from HTML Put all of the CSS and most of the JavaScript into their own file. The JavaScript that is left in HTML depends on some Liquid logic present in the HTML.
2018-01-03 19:33:25 +02:00
}
var icons = [{{ allIconNames }}].map(normalizeSearchTerm);
</script>
Removes relative includes from page template
2017-04-26 19:43:58 +02:00
</head>
<body>
<header class="navbar" role="banner">
<ul class="navbar__nav" role="navigation">
<li class="navbar__nav-item navbar__nav-item--home"><a href="/">Simple&nbsp;Icons</a></li>
Update links in index.html Updates links in index.html to refer to simple-icons/simple-icons instead of danleech/simple-icons
2017-09-11 21:25:34 +02:00
<li class="navbar__nav-item"><a href="https://github.com/simple-icons/simple-icons/blob/develop/README.md">About</a></li>
<li class="navbar__nav-item"><a href="https://github.com/simple-icons/simple-icons">GitHub</a></li>
Add link for the NPM package to index.html
2017-09-20 10:24:28 +02:00
<li class="navbar__nav-item"><a href="https://www.npmjs.com/package/simple-icons">NPM</a></li>
Removes relative includes from page template
2017-04-26 19:43:58 +02:00
</ul>
</header>
<main role="main">
Adds tweet button, changes microcopy, fixes indentation
2017-05-03 15:22:18 +02:00
<p class="hero">Free <abbr title="Scalable Vector Graphic">SVG</abbr> icons for popular&nbsp;brands</p>
Add a search box to the page
2017-05-26 01:04:23 +02:00
<div class="search">
<div class="search__wrapper">
<div class="search__close"><span>&times;</span></div>
Small usability improvement for users with JavaScript disabled
2017-10-17 21:15:07 +02:00
<input type="text" placeholder="Search by brand …" title="Search not available when JavaScript is disabled" disabled />
Add a search box to the page
2017-05-26 01:04:23 +02:00
</div>
Add buttons to sort either on color or alphabet As suggested by @rosslh, add buttons to choose how you want to sort the icons.
2017-12-21 23:54:11 +02:00
Remove aria-labelledby and ids from SVGs (#1062) * Remove `id` and `aria-labelledby` from all SVGs * Update SVGLint configuration * Remove `aria-labelledby` from documentation * Remove `aria-labelledby` from website because why not
2018-11-06 18:10:17 +02:00
<svg id="sort-color" class="sort-btn active" role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>Sort by color</title><path d="M9.219 18.857H6.648V.429A.414.414 0 0 0 6.219 0H3.648a.418.418 0 0 0-.308.121.418.418 0 0 0-.121.308v18.428H.648a.4.4 0 0 0-.402.268c-.071.17-.04.326.094.469l4.286 4.287c.098.08.2.119.308.119a.447.447 0 0 0 .308-.119l4.272-4.273a.506.506 0 0 0 .134-.32.417.417 0 0 0-.429-.431z"/><path d="M12.219 3.429h3.429A.412.412 0 0 0 16.076 3V.429A.416.416 0 0 0 15.648 0h-3.429a.414.414 0 0 0-.429.429V3a.414.414 0 0 0 .429.429z"/><path d="M12.219 10.286h6a.42.42 0 0 0 .309-.12.42.42 0 0 0 .121-.308V7.286a.418.418 0 0 0-.121-.308.417.417 0 0 0-.309-.121h-6a.414.414 0 0 0-.308.121.417.417 0 0 0-.12.308v2.572c0 .125.04.228.12.308a.42.42 0 0 0 .308.12z"/><path d="M12.219 17.143h8.572c.125 0 .229-.039.309-.119s.119-.184.119-.309v-2.572c0-.125-.039-.227-.119-.307s-.184-.121-.309-.121h-8.572a.418.418 0 0 0-.308.121.415.415 0 0 0-.12.307v2.572c0 .125.04.229.12.309.081.08.183.119.308.119z"/><path d="M23.67 20.693a.408.408 0 0 0-.307-.121H12.219a.416.416 0 0 0-.429.428v2.572c0 .125.04.227.121.309a.42.42 0 0 0 .308.119h11.144a.414.414 0 0 0 .307-.119.424.424 0 0 0 .121-.309V21a.416.416 0 0 0-.121-.307z"/></svg>
<svg id="sort-alphabetically" class="sort-btn" role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>Sort alphabetically</title><path d="M10.096 18.857H7.525V.429A.414.414 0 0 0 7.096 0H4.525a.414.414 0 0 0-.429.429v18.429H1.525c-.196 0-.331.089-.402.268-.072.17-.04.326.094.469l4.286 4.286c.098.079.2.119.308.119.116 0 .219-.04.308-.12l4.272-4.272a.506.506 0 0 0 .134-.321.414.414 0 0 0-.429-.43z"/><path d="M20.102 22.474H16.78c-.188 0-.322.009-.402.026l-.188.026V22.5l.148-.147c.133-.16.227-.276.281-.348l4.941-7.099v-1.191h-7.594v3.066h1.607v-1.54h3.107c.16 0 .295-.014.4-.04a.856.856 0 0 0 .102-.007c.039-.004.068-.007.086-.007v.04l-.146.121c-.08.08-.176.2-.281.361L13.9 22.795V24h7.82v-3.12h-1.619v1.594h.001z"/><path d="M21.977 8.866L18.895 0h-2.168l-3.082 8.866h-.936v1.419h3.842V8.866h-1.004l.631-1.929h3.254l.629 1.929h-1.004v1.419h3.857V8.866h-.937zm-5.358-3.402l.977-2.92c.037-.107.07-.236.102-.388s.047-.232.047-.241l.039-.268h.055c0 .036.008.125.025.268l.162.629.963 2.92h-2.37z"/></svg>
Improve search performance (#1170) * Improve performance of search on website By reducing the number of times a search query loops over all icons or all icons that match the search query (from 3 to 1 and 2 to 0 respectively) the search on simpleicons.org should now be noticeably faster (if it was slow before). Especially in conjunction with #1169. This was achieved by utilizing CSS (which operates faster then plain JavaScript) to do most of the heavy lifting. A class on <body> now dictates the order of the icons rather then a JavaScript for-loop (found in the removed function `orderIcons`). It was also achieved by more cleverly utilizing the fuzzy search logic and recognizing that the CSS `order` property also works if number are not consecutive. Less relevant numbers will have a higher value assigned by fuzzy search, which is what the `order`-value of the icon will become, removing the need for sorting and an additional loop. Some resources that helped me: - https://css-tricks.com/css-attr-function-got-nothin-custom-properties/ - https://developer.mozilla.org/en-US/docs/Web/CSS/Using_CSS_variables Specifically the "Values in JavaScript" section * * * One unrelated change in stylesheet.css where 2 separate rulesets for .grid-item__link have been merged. * Simplify script with regard to button states * Reduce complexity of `previousQuery` variables
2019-02-03 23:31:22 +02:00
<svg id="sort-relevance" class="sort-btn" role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>Sort by relevance</title><path d="M9.219,18.857H6.648V0.429C6.656,0.201,6.478,0.008,6.25,0H3.648C3.533-0.004,3.421,0.04,3.34,0.121C3.259,0.203,3.215,0.314,3.219,0.429v18.428H0.648c-0.179-0.012-0.344,0.098-0.402,0.268c-0.071,0.17-0.04,0.326,0.094,0.469l4.286,4.287C4.724,23.961,4.826,24,4.934,24c0.114,0.001,0.224-0.041,0.308-0.119l4.272-4.273c0.081-0.086,0.128-0.199,0.134-0.318c0.008-0.23-0.172-0.423-0.402-0.432C9.237,18.857,9.228,18.857,9.219,18.857z"/><path d="M22.971,4.984c0.226-0.22,0.304-0.543,0.207-0.843c-0.099-0.3-0.352-0.515-0.666-0.561l-2.777-0.403c-0.119-0.018-0.221-0.092-0.274-0.199l-1.241-2.519C18.079,0.174,17.797,0,17.479,0c-0.316,0-0.598,0.176-0.737,0.458l-1.243,2.519c-0.054,0.108-0.156,0.183-0.273,0.199L12.445,3.58c-0.311,0.043-0.569,0.261-0.665,0.56c-0.098,0.3-0.019,0.624,0.207,0.843l2.012,1.96c0.086,0.084,0.125,0.207,0.104,0.322l-0.475,2.769c-0.041,0.245,0.021,0.481,0.18,0.667c0.244,0.292,0.674,0.381,1.016,0.201l2.486-1.307c0.104-0.056,0.232-0.054,0.339,0l2.485,1.307C20.256,10.967,20.387,11,20.518,11c0.245,0,0.477-0.109,0.633-0.298c0.156-0.185,0.223-0.429,0.18-0.667l-0.475-2.768c-0.021-0.117,0.02-0.24,0.104-0.322L22.971,4.984z"/><path d="M22.966,17.984c0.227-0.219,0.307-0.543,0.209-0.844c-0.099-0.299-0.354-0.516-0.666-0.561l-2.777-0.404c-0.119-0.018-0.221-0.092-0.274-0.199l-1.241-2.518c-0.141-0.283-0.422-0.46-0.738-0.46s-0.6,0.177-0.738,0.46l-1.242,2.518c-0.054,0.107-0.156,0.184-0.275,0.199l-2.775,0.404c-0.314,0.045-0.568,0.259-0.666,0.561c-0.098,0.301-0.018,0.623,0.207,0.844l2.011,1.961c0.087,0.082,0.124,0.205,0.104,0.322l-0.475,2.769c-0.055,0.312,0.07,0.618,0.328,0.806c0.254,0.186,0.586,0.207,0.865,0.063l2.484-1.307c0.107-0.056,0.234-0.056,0.341,0l2.485,1.307C20.253,23.968,20.384,24,20.515,24c0.172,0,0.34-0.055,0.482-0.158c0.256-0.188,0.383-0.494,0.329-0.806l-0.478-2.769c-0.02-0.117,0.021-0.24,0.104-0.322L22.966,17.984z M20.874,23.115c0.021,0.14-0.029,0.273-0.145,0.354c-0.115,0.086-0.258,0.094-0.385,0.029l-2.487-1.309c-0.118-0.063-0.251-0.096-0.382-0.096s-0.264,0.032-0.385,0.098l-2.485,1.307c-0.124,0.064-0.269,0.057-0.382-0.029c-0.116-0.08-0.168-0.215-0.146-0.354l0.479-2.77c0.045-0.267-0.043-0.539-0.236-0.729l-2.014-1.96c-0.104-0.099-0.135-0.237-0.092-0.371c0.045-0.136,0.154-0.228,0.295-0.249l2.778-0.403c0.269-0.038,0.5-0.207,0.618-0.448l1.242-2.521c0.064-0.127,0.184-0.202,0.326-0.202c0.144,0,0.265,0.075,0.328,0.202l1.242,2.521c0.117,0.241,0.35,0.41,0.617,0.448l2.78,0.403c0.14,0.021,0.249,0.113,0.292,0.249c0.044,0.134,0.011,0.272-0.092,0.371l-2.01,1.96c-0.192,0.189-0.281,0.461-0.235,0.729L20.874,23.115z"/></svg>
Add a search box to the page
2017-05-26 01:04:23 +02:00
</div>
Removes relative includes from page template
2017-04-26 19:43:58 +02:00
<ul class="grid">
Update no search results message (#1036) * Restore "No matching icons found." message * Update message when no icons are found with a message that links to a new issue
2018-10-29 19:21:34 +02:00
<li class="grid-item--if-empty">
Icon missing? Request it <a href="https://github.com/simple-icons/simple-icons/issues/new?template=icon_request.md">here</a>.
</li>
Removes relative includes from page template
2017-04-26 19:43:58 +02:00
<li class="grid-item grid-item--ad">
Update ad link Carbon Ads have changed their link structure.
2018-05-22 22:32:23 +02:00
<script async type="text/javascript" src="//cdn.carbonads.com/carbon.js?serve=CKYIPK7M&placement=simpleiconsorg" id="_carbonads_js"></script>
Removes relative includes from page template
2017-04-26 19:43:58 +02:00
</li>
{% for icon in iconsArray %}
{% assign iconArray = icon | split: "," %}
Improve search performance (#1170) * Improve performance of search on website By reducing the number of times a search query loops over all icons or all icons that match the search query (from 3 to 1 and 2 to 0 respectively) the search on simpleicons.org should now be noticeably faster (if it was slow before). Especially in conjunction with #1169. This was achieved by utilizing CSS (which operates faster then plain JavaScript) to do most of the heavy lifting. A class on <body> now dictates the order of the icons rather then a JavaScript for-loop (found in the removed function `orderIcons`). It was also achieved by more cleverly utilizing the fuzzy search logic and recognizing that the CSS `order` property also works if number are not consecutive. Less relevant numbers will have a higher value assigned by fuzzy search, which is what the `order`-value of the icon will become, removing the need for sorting and an additional loop. Some resources that helped me: - https://css-tricks.com/css-attr-function-got-nothin-custom-properties/ - https://developer.mozilla.org/en-US/docs/Web/CSS/Using_CSS_variables Specifically the "Values in JavaScript" section * * * One unrelated change in stylesheet.css where 2 separate rulesets for .grid-item__link have been merged. * Simplify script with regard to button states * Reduce complexity of `previousQuery` variables
2019-02-03 23:31:22 +02:00
<li class="grid-item {{ iconArray[6] }}" style="background-color: #{{ iconArray[4] }}; --order-alpha: {{ iconArray[7] }}">
Makes icons links download by default
2017-04-28 00:12:22 +02:00
<a class="grid-item__link" href="/icons/{{ iconArray[3] }}.svg" download>
Restores includes until I can figure out the symlink issue
2017-04-26 21:09:03 +02:00
{% assign filePath = iconArray[3] | prepend: "icons/" | append: ".svg" %}
{% include_relative {{ filePath }} %}
Removes relative includes from page template
2017-04-26 19:43:58 +02:00
<h2 class="grid-item__title">{{ iconArray[5] }}</h2>
</a>
Add buttons to sort either on color or alphabet As suggested by @rosslh, add buttons to choose how you want to sort the icons.
2017-12-21 23:54:11 +02:00
<p class="grid-item__subtitle">#{{ iconArray[4] }}</p>
Removes relative includes from page template
2017-04-26 19:43:58 +02:00
</li>
{% endfor %}
{% for icon in greyscaleIconsArray %}
{% assign iconArray = icon | split: "," %}
Improve search performance (#1170) * Improve performance of search on website By reducing the number of times a search query loops over all icons or all icons that match the search query (from 3 to 1 and 2 to 0 respectively) the search on simpleicons.org should now be noticeably faster (if it was slow before). Especially in conjunction with #1169. This was achieved by utilizing CSS (which operates faster then plain JavaScript) to do most of the heavy lifting. A class on <body> now dictates the order of the icons rather then a JavaScript for-loop (found in the removed function `orderIcons`). It was also achieved by more cleverly utilizing the fuzzy search logic and recognizing that the CSS `order` property also works if number are not consecutive. Less relevant numbers will have a higher value assigned by fuzzy search, which is what the `order`-value of the icon will become, removing the need for sorting and an additional loop. Some resources that helped me: - https://css-tricks.com/css-attr-function-got-nothin-custom-properties/ - https://developer.mozilla.org/en-US/docs/Web/CSS/Using_CSS_variables Specifically the "Values in JavaScript" section * * * One unrelated change in stylesheet.css where 2 separate rulesets for .grid-item__link have been merged. * Simplify script with regard to button states * Reduce complexity of `previousQuery` variables
2019-02-03 23:31:22 +02:00
<li class="grid-item {{ iconArray[6] }}" style="background-color: #{{ iconArray[4] }}; --order-alpha: {{ iconArray[7] }}">
Makes icons links download by default
2017-04-28 00:12:22 +02:00
<a class="grid-item__link" href="/icons/{{ iconArray[1] }}.svg" download>
Restores includes until I can figure out the symlink issue
2017-04-26 21:09:03 +02:00
{% assign filePath = iconArray[1] | prepend: "icons/" | append: ".svg" %}
{% include_relative {{ filePath }} %}
Removes relative includes from page template
2017-04-26 19:43:58 +02:00
<h2 class="grid-item__title">{{ iconArray[5] }}</h2>
</a>
Add buttons to sort either on color or alphabet As suggested by @rosslh, add buttons to choose how you want to sort the icons.
2017-12-21 23:54:11 +02:00
<p class="grid-item__subtitle">#{{ iconArray[4] }}</p>
Removes relative includes from page template
2017-04-26 19:43:58 +02:00
</li>
{% endfor %}
</ul>
</main>
<footer class="footer" role="contentinfo">
Update links in index.html Updates links in index.html to refer to simple-icons/simple-icons instead of danleech/simple-icons
2017-09-11 21:25:34 +02:00
<p>A <a href="https://github.com/simple-icons/simple-icons/blob/develop/LICENSE.md">CC0</a> project maintained by the <a href="https://github.com/simple-icons/simple-icons/graphs/contributors">Simple&nbsp;Icons&nbsp;Contributors</a>.<br>
Use <a href="https://github.com/simple-icons/simple-icons">GitHub</a> for requests, corrections and contributions.</p>
Adds tweet button, changes microcopy, fixes indentation
2017-05-03 15:22:18 +02:00
<a class="share-button" href="https://twitter.com/share?url=https%3A%2F%2Fsimpleicons.org&via=bathtype&text=Simple%20Icons%3A%20free%20SVG%20icons%20for%20popular%20brands.">Share this on Twitter!</a>
Removes relative includes from page template
2017-04-26 19:43:58 +02:00
</footer>
Extract CSS and JavaScript from HTML Put all of the CSS and most of the JavaScript into their own file. The JavaScript that is left in HTML depends on some Liquid logic present in the HTML.
2018-01-03 19:33:25 +02:00
<script type="text/javascript" src="site_script.js"></script>
Removes relative includes from page template
2017-04-26 19:43:58 +02:00
</body>
Lint file formatting (primarily whitespace) (#1349) * Add editorconfig-checker and .editorconfig * Fix wslint errors
2019-04-17 11:59:44 +02:00
</html>
Copy Permalink