-
Notifications
You must be signed in to change notification settings - Fork 2
/
Copy pathindex.html
1 lines (1 loc) · 11.4 KB
/
index.html
1
<!DOCTYPE html><title>Icon Library | Material Design Icons Sandbox</title><link href="json/manifest.json" rel="manifest"><link href="img/303f9f/16.png" rel="shortcut icon"><link rel="search" type="application/opensearchdescription+xml" title="Material Design Icons Sandbox" href="xml/opensearch.xml"><meta charset="utf-8"><meta content="initial-scale=1,maximum-scale=1,minimum-scale=1,user-scalable=0,width=device-width" name="viewport"><meta name="robots" content="noodp"><meta content="#303f9f" name="theme-color"><link href="css/library.css" rel="stylesheet"><header class="df pf" id="header"><h1 id="title">Material<span> Design</span> Icons</h1><nav class="pf" id="nav"><h2 class="cp oh pa wsnw" id="navicon"><svg class="dib pen" data-icons="menu"><title>Menu</title></svg></h2><div class="oa pf wsnw" id="menu"><p class="cp fwm oh" id="highlight" tabindex="-1"><svg class="dib pen vam" data-icons="checkbox-blank-outline,checkbox-marked"></svg>Highlight Community Icons</p><ol class="fwm" id="sections"><li class="cp oh" id="all" tabindex="-1"><svg class="dib pen vam" data-icons="apps,filter-remove"></svg>All Icons</ol><h3 class="cp fwm oh"><svg class="dib pen vam" data-icons="shape"></svg>Categories<svg class="dib pen" data-icons="menu-right"></svg></h3><ol class="fwm oh" id="categories"></ol><h3 class="cp fwm oh"><svg class="dib pen vam" data-icons="account-group"></svg>Contributors<svg class="dib pen" data-icons="menu-right"></svg></h3><ol class="fwm oh" id="contributors"></ol><ul id="extras"><li><a class="db fwm oh" href="https://petershaggynoble.github.io/MDI-Sandbox/light/" tabindex="-1"><svg class="dib pen vam" data-icons="lightbulb-outline"></svg>Material Design Icons Light</a><li><a class="db fwm oh" href="https://petershaggynoble.github.io/MDI-Sandbox/preview/" tabindex="-1"><svg class="dib pen vam" data-icons="grid"></svg>Preview Generator</a><li><a class="db fwm oh" href="https://petershaggynoble.github.io/MDI-Sandbox/google/" tabindex="-1"><svg class="dib pen vam" data-icons="google"></svg>Stock Icon Extras</a><li><a class="db fwm oh" href="https://petershaggynoble.github.io/MDI-Sandbox/variants/" tabindex="-1"><svg class="dib pen vam" data-icons="compare"></svg>Variants Tracker</a><li><a class="db fwm oh" href="https://petershaggynoble.github.io/MDI-Sandbox/simpleicons/" tabindex="-1"><svg class="dib pen vam" data-icons="simple-icons"></svg>Simple Icons Statuses</a><li><a class="db fwm oh" href="https://petershaggynoble.github.io/MDI-Sandbox/microsoft/" tabindex="-1"><svg class="dib pen vam" data-icons="microsoft"></svg>Microsoft Product Icons</a><li><a class="db fwm oh" href="https://petershaggynoble.github.io/MDI-Sandbox/issues/" tabindex="-1"><svg class="dib pen vam" data-icons="github"></svg>Icon Requests</a><li><a class="db fwm oh" href="https://petershaggynoble.github.io/MDI-Sandbox/editor/" tabindex="-1"><svg class="dib pen vam" data-icons="brush"></svg>Icon Editor</a></ul><aside id="links"><ul><li><a class="db fwm oh" href="https://materialdesignicons.com/" tabindex="-1"><svg class="dib pen vam" data-icons="vector-square"></svg>materialdesignicons.com</a><li><a class="db fwm oh" href="https://dev.materialdesignicons.com/" tabindex="-1"><svg class="dib pen vam" data-icons="vector-polyline-edit"></svg>dev.materialdesignicons.com</a><li><a class="db fwm oh" href="https://www.npmjs.com/org/mdi" tabindex="-1"><svg class="dib pen vam" data-icons="npm"></svg>@mdi</a><li><a class="db fwm oh" href="https://github.com/Templarian/MaterialDesign/" tabindex="-1"><svg class="dib pen vam" data-icons="github"></svg>GitHub Project</a><li><a class="db fwm oh" href="https://twitter.com/MaterialIcons/" tabindex="-1"><svg class="dib pen vam" data-icons="twitter"></svg>@MaterialIcons</a><li><a class="db fwm oh" href="https://chrome.google.com/webstore/detail/materialdesignicons-picke/edjaedpifkihpjkcgknfokmibkoafhme/" tabindex="-1"><svg class="dib vam" data-icons="google-chrome"></svg>Chrome Extension</a><li><a class="db fwm oh" href="https://addons.mozilla.org/en-US/firefox/addon/materialdesignicons-picker/" tabindex="-1"><svg class="dib pen vam" data-icons="firefox"></svg>Firefox Extension</a><li><a class="db fwm oh" href="https://material.io/resources/icons/" tabindex="-1"><svg class="dib pen vam" data-icons="google"></svg>Stock Icons</a><li><a class="db fwm oh" href="https://material.io/design/iconography/system-icons.html" tabindex="-1"><svg class="dib pen vam" data-icons="material-design"></svg>Design Guidelines</a></ul></aside></div></nav><aside class="wsnw" id="search"><input autocomplete="off" class="dib pr ttl vat" id="filter" placeholder="Icon search" spellcheck="false" tabindex="1" type="search" value=""><button class="cp dib oh pr vat" id="clear" tabindex="-1"><svg class="dib pen vat" data-icons="close"><title>Clear</title></svg></button></aside><p><a class="db" href="https://github.com/PeterShaggyNoble/MDI-Sandbox/issues/"><svg class="dib pen vam" data-icons="message-alert"><title>Feedback</title></svg></a></p><p><a class="db" href="https://github.com/PeterShaggyNoble/MDI-Sandbox/"><svg class="dib pen vam" data-icons="github"><title>GitHub Project</title></svg></a></p></header><main id="content"><section class="dg pr" id="icons"><header class="ps"><h2 class="oh toe wsnw">All Icons</h2><svg class="trigger cp pa" data-icons="dots-vertical" tabindex="-1"><title>Options</title></svg><ul class="options oh pa" tabindex="-1"><li class="cp fwm wsnw"><svg class="dib pen vam" data-icons="link"></svg>Copy Link<li class="cp fwm wsnw"><svg class="dib pen vam" data-icons="code-json"></svg>JSON Object<li class="cp fwm wsnw"><svg class="dib pen vam" data-icons="svg"></svg>SVG Sprite<li class="cp fwm wsnw"><svg class="dib pen vam" data-icons="angular"></svg>SVG for Angular<li class="cp fwm wsnw"><svg class="dib pen vam" data-icons="polymer"></svg>HTML for Polymer</ul></header><p class="dn fwm">No icons matched your query</section></main><aside class="oz pf" id="info"><header class="pr"><h2 class="oh pr toe wsnw" id="name"><svg class="cp" data-icons="close"></svg></h2><figure class="oh pr vat" id="preview"><svg class="pa" viewBox="-2 -2 28 28"><path></path></svg></figure></header><ul class="fwm oa pr" id="actions"><li class="fwn" data-label="Designer"></li><li class="fwn wsnw" data-label="Added"></li><li class="fwn wsnw" data-label="Updated"></li><li class="fwn wsnw" data-label="Renamed"></li><li class="fwn wsnw" data-label="Retired"></li><li class="cp oh toe wsnw" tabindex="-1"><svg class="dib pen vam" data-icons="plus-circle,minus-circle,close-circle"></svg>Add to Library<li class="cp oh toe wsnw" tabindex="-1"><svg class="dib pen vam" data-icons="brush"></svg>Edit Icon<li class="cp oh toe wsnw" data-type="svg" tabindex="-1"><svg class="dib pen vam" data-icons="svg"></svg>Download SVG<li class="cp oh toe wsnw" data-type="xml" tabindex="-1"><svg class="dib pen vam" data-icons="android"></svg>Download Vector Drawable<li class="cp oh toe wsnw" data-type="xaml" tabindex="-1"><svg class="dib pen vam" data-icons="microsoft-windows"></svg>Download XAML<li class="cp oh toe wsnw" data-confirm="Name" data-copy="name" tabindex="-1"><svg class="dib pen vam" data-icons="alphabetical-variant"></svg>Copy Icon Name<li class="cp oh toe wsnw" data-confirm="Markup" data-copy="svg" tabindex="-1"><svg class="dib pen vam" data-icons="xml"></svg>Copy SVG Markup<li class="cp oh toe wsnw" data-confirm="Path data" data-copy="" tabindex="-1"><svg class="dib pen vam" data-icons="vector-radius"></svg>Copy Path Data<li class="cp oh toe wsnw" data-confirm="URI" data-copy="data" tabindex="-1"><svg class="dib pen vam" data-icons="link-variant"></svg>Copy Data URI<li class="cp oh toe wsnw" data-confirm="Import" data-copy="npm" tabindex="-1"><svg class="dib pen vam" data-icons="import"></svg>Copy npm Import<li class="cp oh toe wsnw" data-confirm="Icon" data-copy="" tabindex="-1"><svg class="dib pen vam" data-icons="at"></svg>Copy Character<li class="cp oh toe wsnw" data-confirm="Code point" data-copy="" tabindex="-1"><svg class="dib pen vam" data-icons="numeric"></svg>Copy Code Point<li class="cp oh toe wsnw" data-confirm="Link" tabindex="-1"><svg class="dib pen vam" data-icons="link"></svg>Copy Direct Link<li class="cp oh toe wsnw" tabindex="-1"><svg class="dib pen vam" data-icons="launch"></svg>View on materialdesignicons.com</ul></aside><footer><p class="oz pen pf" id="message"><figure class="cw pf tac" id="load"><svg viewBox="0 0 56 56"><title>Loading ...</title><g><circle cx="28" cy="28" r="16"></circle></g></svg></figure></footer><dialog class="df oz pen pf" id="editor"><header class="pr"><h2>Edit PNG</h2><svg class="trigger cp pa" data-icons="dots-vertical" tabindex="1"><title>Options</title></svg><ul class="options oh pa" tabindex="-1"><li class="cp fwm pr wsnw"><svg class="dib pen vam" data-icons="link"></svg>Copy Link<li class="cp fwm pr wsnw"><svg class="dib pen vam" data-icons="file-import"></svg>Import Settings<li class="cp fwm pr wsnw"><svg class="dib pen vam" data-icons="file-export"></svg>Export Settings<li class="cp fwm pr wsnw"><svg class="dib pen vam" data-icons="refresh"></svg>Reset Editor</ul></header><figure class="pr"><svg class="pa pen" viewBox="0 0 24 24"><path></path></svg><canvas class="oz pr"></canvas></figure><section class="oa"><label class="cp dib fwm vam" for="png-size">Size: </label><input class="dib tar vam" id="png-size" max="256" min="12" required type="number" value="24"><label class="cp dib fwm vam" for="png-fill">Icon Colour: </label><input class="dib tar ttl vam" id="png-fill" pattern="^([A-Fa-f0-9]{3}){1,2}$" required type="text" value="000"><label class="cp dib fwm vam" for="png-opacity">Icon Opacity: </label><input class="dib tar vam" id="png-opacity" max="100" min="0" required type="number" value="100"><label class="cp dib fwm vam" for="png-padding">Padding: </label><input class="dib tar vam" id="png-padding" max="116" min="0" required type="number" value="0"><label class="cp dib fwm vam" for="png-colour">Background Colour: </label><input class="dib tar ttl vam" id="png-colour" pattern="^([A-Fa-f0-9]{3}){1,2}$" required type="text" value="fff"><label class="cp dib fwm vam" for="png-alpha">Background Opacity: </label><input class="dib tar vam" id="png-alpha" max="100" min="0" required type="number" value="0"><label class="cp dib fwm vam" for="png-radius">Round Corners: </label><input class="dib tar vam" id="png-radius" max="12" min="0" required type="number" value="0"><label class="cp dib fwm vam" for="png-format">Format: </label><select class="dib vam" id="png-format"><option selected value="png">PNG</option><option value="svg">SVG</option><option value="xaml">XAML</option><option value="xml">XML</option></select></section><button class="cp fwm tac ttu">Close</button><button autofocus class="cp fwm tac ttu">Save</button></dialog><dialog class="df oz pen pf" id="upload"><header class="pr"><h2>Add Icon to Library</h2></header><label class="cp dib pr vam" for="upload-name">Icon Name: </label><input class="dib ttl vam" id="upload-name" maxlength="50" minlength="3" pattern="^[A-Za-z][A-Za-z\-\d]+?[A-Za-z\d]$" required type="text" value=""><p>The icon name may consist of lowercase letters, numbers & hyphens only, must begin with a letter and must end with a letter or number.</p><label class="cp dib vam" for="upload-data">Path Data: </label><input class="dib vam" id="upload-data" minlength="4" pattern="^([mMzZlLhHvVcCsSqQtTaA][\d \.\-,]*)+[\dzZ]$" required type="text" value=""><p>Path data must fit within a 24*24 viewbox.</p><button class="cp fwm tac ttu">Close</button><button autofocus class="cp fwm tac ttu">Add Icon</button></dialog><script src="js/library.js"></script>