- 追加された行はこの色です。
- 削除された行はこの色です。
#author("2020-07-29T22:54:13+00:00","","")
#author("2020-07-30T01:14:55+00:00","","")
#mynavi(Azureメモ)
#setlinebreak();
* 概要 [#j36ce3c4]
#html(<div class="pl10">)
公式で SVGのアイコンが提供されている一覧を見ながら使うものを選びたいので簡単なシェルを作成した。
公式で SVGのアイコンが提供されているが、一覧を見ながら使うものを選びたいので簡単なシェルを作成した。
#html(</div>)
* 目次 [#y0b0bc58]
#contents
- 関連
-- [[Azureメモ]]
* アイコンデータ取得 [#r49c1f7c]
#html(<div class="pl10">)
公式で提供されているアイコンデータ(SVG)をダウンロードする。
https://www.microsoft.com/en-us/download/details.aspx?id=41937
https://docs.microsoft.com/en-us/azure/architecture/icons/
#html(</div>)
* 一覧HTML作成 [#k850c9bd]
#html(<div class="pl10">)
list_svg.sh
#mycode2{{
svg2html.sh
#!/bin/bash
find . -name *.svg | awk -F, '
find . -name *.svg | sort | awk -F, '
BEGIN{
preGroup="";
print "<!doctype html>";
print "<html>";
print "<style>";
print ".title { font-size: 16px; }";
print ".body { margin: 10px; }"
print "img { width: 50px; margin: 10px;}";
print ".img { width: 50px; height: 50px; margin: 10px; display: inline-block; }";
print ".img img { width: 100%;}";
print "</style>";
print "<div>";
}
{
group=substr($1,3,100);
gsub("/.+", "", group);
if (group != preGroup) {
preGroup = group;
print "</div>";
print "<div class=\"title\">"group"</div>";
print "<div class=\"body\">";
}
print "<img src=\""$1"\" title=\""$1"\">";
print "<div class=\"img\"><img src=\""$1"\" title=\""$1"\"></div>";
}
END {
print "</div>";
print "</html>"
}'
}}
実行
#myterm2(){{
bash list_svg.sh > index.html
}}
#html(</div>)
![[PukiWiki]](image/pukiwiki.png "[PukiWiki]")
