foundation-icons/index.html

46 строки
1.5 KiB
HTML

<html>
<head>
<link rel="stylesheet" href="assets/foundation-icons.css" type="text/css">
<link rel="stylesheet" href="style.css" type="text/css">
<link href="https://fonts.googleapis.com/css?family=Fira+Sans:400,500,700" rel="stylesheet">
<script src="https://code.jquery.com/jquery-2.2.4.min.js" crossorigin="anonymous"></script>
<script src="js/icon-list.js"></script>
<script src="js/app.js"></script>
<link rel="shortcut icon" href="favicon.png?1">
<title>Mozilla Foundation Icon Font</title>
</head>
<body>
<div class="mozmaker-icon-fonts">
<h1 class="icon-heart">
Mozilla Foundation Icon Font
<a class="github-button icon-github" href="https://github.com/mozilla/foundation-icons">Github Repo</a>
</h1>
<p>To use the icon font, add this stylesheet to your project:</p>
<code>
&lt;link href="http://mozilla.github.io/foundation-icons/assets/foundation-icons.css" type="text/css" rel="stylesheet"&gt;
</code>
<p>
To use an icon, add the corresponding class name to an element on your page:
</p>
<div class="example-wrapper">
<code>&lt;span class="icon-lock"&gt;Privacy&lt;/span&gt;</code> will display as <span class='example icon-lock'>Privacy</span>
</div>
<div class="search-ui">
<input placeholder="Find an icon" type="text" class="icon-search" />
</div>
<div class="dynamic-icon-list"></div>
</div>
</body>
</html>