概要 †公式で SVGのアイコンが提供されているが、一覧を見ながら使うものを選びたいので簡単なシェルを作成した。 目次 †
アイコンデータ取得 †公式で提供されているアイコンデータ(SVG)をダウンロードする。 一覧HTML作成 †list_svg.sh #!/bin/bash
find . -name *.svg | sort | awk -F, '
BEGIN{
no = 0;
preGroup="";
print "<!doctype html>";
print "<html>";
print "<style>";
print ".title { font-size: 16px; }";
print ".body { margin: 10px; }"
print ".img { width: 50px; height: 50px; margin: 10px; display: inline-block; }";
print ".img img { width: 100%;}";
print "table { border-collapse: collapse; }"
print "th,td { border: 1px solid #333; }"
print "</style>";
print "<div>";
info = "<table>";
}
{
no = no + 1;
group=substr($1,3,100);
gsub("/.+", "", group);
if (group != preGroup) {
preGroup = group;
print "</div>";
print "<div class=\"title\">"group"</div>";
print "<div class=\"body\">";
}
info = info"<tr><th>"no"</th><td>"$1"</td></tr>"
print "<div class=\"img\"><div>"no"</div><img src=\""$1"\" title=\""$1"\"></div>";
}
END {
info = info"</table>"
print "</div>";
print "<div>"info"</div>";
print "</html>"
}'
実行 bash list_svg.sh > index.html |