icomoonは多くのクラスで1つのシンボルを作成します

Question

自分自身でアイコンフォントを作成したいと思います。私は、SVGで、次の記号を持っている：symbol コードは次のようになります。

<svg 
    xmlns:dc="http://purl.org/dc/elements/1.1/" 
    xmlns:cc="http://creativecommons.org/ns#" 
    xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" 
    xmlns:svg="http://www.w3.org/2000/svg" 
    xmlns="http://www.w3.org/2000/svg" 
    xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" 
    xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" 
    version="1.1" 
    id="svg4986" 
    x="0px" 
    y="0px" 
    viewBox="179 -180.3 84.900001 48.335998" 
    xml:space="preserve" 
    inkscape:version="0.91 r13725" 
    sodipodi:docname="flieger.svg" 
    width="84.900002" 
    height="48.335999"><metadata 
    id="metadata4153"><rdf:RDF><cc:Work 
     rdf:about=""><dc:format>image/svg+xml</dc:format><dc:type 
      rdf:resource="http://purl.org/dc/dcmitype/StillImage" /><dc:title></dc:title></cc:Work></rdf:RDF></metadata><defs 
    id="defs4151" /><sodipodi:namedview 
    pagecolor="#ffffff" 
    bordercolor="#666666" 
    borderopacity="1" 
    objecttolerance="10" 
    gridtolerance="10" 
    guidetolerance="10" 
    inkscape:pageopacity="0" 
    inkscape:pageshadow="2" 
    inkscape:window-width="1920" 
    inkscape:window-height="1018" 
    id="namedview4149" 
    showgrid="false" 
    fit-margin-top="0" 
    fit-margin-left="0" 
    fit-margin-right="0" 
    fit-margin-bottom="0" 
    inkscape:zoom="1.702" 
    inkscape:cx="229.2" 
    inkscape:cy="47.000013" 
    inkscape:window-x="-8" 
    inkscape:window-y="-8" 
    inkscape:window-maximized="1" 
    inkscape:current-layer="g4144" /><style 
    type="text/css" 
    id="style4137"> 
    .st0{fill:#FFFFFF;} 
</style><g 
    id="g4144" 
    transform="translate(-20.8,-248.664)"><path 
     id="path3545_1_" 
     class="st0" 
     d="m 201.7,79.5 c 9.8,11 19.1,22.2 28.8,33 1.5,1.7 4.6,3.2 6.6,2.7 13.9,-4.4 27.6,-9.5 43.5,-15.1 -20,-9.5 -38.3,-17.6 -55.9,-27.1 -9,-4.9 -14.9,-3.9 -20.5,3.7 -0.8,0.8 -1.5,1.5 -2.5,2.8 z" 
     inkscape:connector-curvature="0" 
     style="fill:#ffffff" /><path 
     d="m 236.3,116.7 c -2.5,0 -5.5,-1.6 -6.9,-3.3 -5.5,-6.1 -11,-12.4 -16.3,-18.6 -4.1,-4.7 -8.3,-9.6 -12.5,-14.4 l -0.8,-0.9 0.8,-1 c 0.5,-0.6 0.9,-1.1 1.3,-1.5 0.4,-0.5 0.8,-0.9 1.2,-1.4 6,-8.1 12.7,-9.3 22.4,-4.1 12.8,6.9 26,13.1 40,19.6 5.2,2.4 10.5,4.9 15.9,7.5 l 3.3,1.6 -3.4,1.2 c -4.3,1.5 -8.4,3 -12.3,4.4 -10.8,3.9 -21,7.5 -31.2,10.8 -0.6,0.1 -1,0.1 -1.5,0.1 z M 203.7,79.4 c 4,4.5 7.9,9 11.7,13.5 5.3,6.1 10.7,12.5 16.2,18.5 1.2,1.4 3.8,2.6 5.1,2.2 10.1,-3.2 20.2,-6.8 31,-10.7 2.9,-1 5.9,-2.1 8.9,-3.2 -4.3,-2 -8.5,-4 -12.6,-5.9 -14,-6.5 -27.3,-12.7 -40.1,-19.7 -8.4,-4.6 -13.5,-3.7 -18.6,3.2 -0.4,0.6 -0.9,1.1 -1.3,1.6 0,0.2 -0.2,0.4 -0.3,0.5 z" 
     id="path4147" 
     inkscape:connector-curvature="0" /></g></svg> 

icomoon.io上のフォントを作成するとき、私は、次の2つのクラスとのstyle.cssを得る：

.icon-symbol .path1:before { 
    content: "\e900"; 
    color: rgb(255, 255, 255); 
} 
.icon-symbol .path2:before { 
    content: "\e901"; 
    margin-left: -1.7568359375em; 
    color: rgb(0, 0, 0); 
} 

したがって、icomoonはこの1つのシンボルに対して2つのクラスを作成しました。しかし、私はシンボルのすべての要素を含む1つのクラスにしたいだけです。どうすればこれを達成できますか？

Answer 1

SVGには2つの異なる要素があり、白い塗りと黒い筆跡があるので、Icomoonはこれを参考にして複製しています。私はここであなたは、単にsvg拡張子を持つテキストファイルに保存し、Icomoonにアップロードすることができ、クリーンアップSVGだ、あなたは白の塗りつぶしを必要としないとします

<svg 
    xmlns="http://www.w3.org/2000/svg" 
    version="1.1" 
    viewBox="179 -180.3 84.900001 48.335998"> 

    <g transform="translate(-20.8,-248.664)"> 
    <path d="m 236.3,116.7 c -2.5,0 -5.5,-1.6 -6.9,-3.3 -5.5,-6.1 -11,-12.4 -16.3,-18.6 -4.1,-4.7 -8.3,-9.6 -12.5,-14.4 l -0.8,-0.9 0.8,-1 c 0.5,-0.6 0.9,-1.1 1.3,-1.5 0.4,-0.5 0.8,-0.9 1.2,-1.4 6,-8.1 12.7,-9.3 22.4,-4.1 12.8,6.9 26,13.1 40,19.6 5.2,2.4 10.5,4.9 15.9,7.5 l 3.3,1.6 -3.4,1.2 c -4.3,1.5 -8.4,3 -12.3,4.4 -10.8,3.9 -21,7.5 -31.2,10.8 -0.6,0.1 -1,0.1 -1.5,0.1 z M 203.7,79.4 c 4,4.5 7.9,9 11.7,13.5 5.3,6.1 10.7,12.5 16.2,18.5 1.2,1.4 3.8,2.6 5.1,2.2 10.1,-3.2 20.2,-6.8 31,-10.7 2.9,-1 5.9,-2.1 8.9,-3.2 -4.3,-2 -8.5,-4 -12.6,-5.9 -14,-6.5 -27.3,-12.7 -40.1,-19.7 -8.4,-4.6 -13.5,-3.7 -18.6,3.2 -0.4,0.6 -0.9,1.1 -1.3,1.6 0,0.2 -0.2,0.4 -0.3,0.5 z"/> 
    </g> 
</svg>