i have exported set of icons sketch svgs , processed them through fontello use on website. fine desktop (including mobile views) inner paths seem "disappear" on mobile devices specifically.
i've tested on ios , android, default safari browser, android web browser, , google chrome mobile , had same result.
in sketch, using combined shape union have attempted adobe illustrator well, had same result.
how shows on desktop: icons on desktop
how shows on mobile devices icons on mobile devices
here example of svg sketch has exported.
<?xml version="1.0" encoding="utf-8" standalone="no"?> <svg width="113px" height="113px" viewbox="0 0 113 113" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <!-- generator: sketch 3.6 (26304) - http://www.bohemiancoding.com/sketch --> <title>combined shape</title> <desc>created sketch.</desc> <defs></defs> <g id="introduction" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> <g id="facebook" transform="translate(-1.000000, -1.000000)" fill="#000000"> <path d="m114,57.5 c114,26.2959116 88.7040884,1 57.5,1 c26.2959116,1 1,26.2959116 1,57.5 c1,88.7040884 26.2959116,114 57.5,114 c88.7040884,114 114,88.7040884 114,57.5 l114,57.5 l114,57.5 l114,57.5 l114,57.5 l114,57.5 z m49.9465,88.7759701 l61.4605,88.7759701 l61.4605,59.8388273 l71.0245,59.8388273 l72.5035,48.5534939 l61.4605,48.5534939 l61.4605,41.3001606 c61.4605,39.5233987 61.8655,38.1550177 62.6065,37.1980654 c63.3475,36.3081606 64.7605,35.8296844 66.9145,35.8296844 l72.7735,35.8296844 l72.7735,25.7725415 c70.7545,25.4312082 67.9255,25.2940654 64.2235,25.2940654 c59.9125,25.2940654 56.4115,26.5923511 53.8525,29.1950177 c51.2275,31.7915892 49.9465,35.4853035 49.9465,40.2060654 l49.9465,48.5534939 l40.3855,48.5534939 l40.3855,59.8388273 l49.9465,59.8388273 l49.9465,88.7759701 l49.9465,88.7759701 l49.9465,88.7759701 l49.9465,88.7759701 l49.9465,88.7759701 z" id="combined-shape"></path> </g> </g> </svg>
fyi fontello doesn't support fill-rule or fill. still trying figure out how around w/ icon cause behavior describing.
Comments
Post a Comment