-
Notifications
You must be signed in to change notification settings - Fork 11
/
Copy pathicons.html
62 lines (54 loc) · 1.35 KB
/
icons.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
<!DOCTYPE html>
<html>
<head>
<title>MAGE Icons</title>
<script type="text/javascript" src="./icons.js"></script>
<style>
.header {
font-size: 2em;
padding: 20px;
}
.icon {
font-size: 1em;
background-color: #fff;
margin: 0 10px 10px;
box-shadow: 0 3px 7px rgba(0,0,0,.35);
padding: 20px;
}
</style>
</head>
<body>
<div class="header">Attributions for icons</div>
<div id="icons">
</div>
<script type="text/javascript">
var iconsDiv = document.getElementById('icons');
for (var i = 0; i < icons.length; i++) {
console.log('icons', icons[i]);
var icon = icons[i];
var iconDiv = document.createElement('div');
iconDiv.classList.add('icon');
var html ='<span class="icon-name">';
if (icon.url) {
html += '"<a href="'+icon.url+'">' + icon.iconName + '</a>"';
} else {
html += icon.iconName;
}
html += '</span>';
if (icon.creatorName) {
html += ' icon by <span class="icon-author">' + icon.creatorName + '</span>';
}
if (icon.source) {
html += ' from <span class="icon-source">';
if (icon.sourceUrl) {
html += '<a href="' + icon.sourceUrl + '">' + icon.source + '</a>'
} else {
html += icon.source;
}
html += '</span>';
}
iconDiv.innerHTML = html;
iconsDiv.appendChild(iconDiv);
}
</script>
</body>