Correct Accusoft icon

[lukeocodes]

Issue: #3169
Alexa rank:

Checklist

• I updated the JSON data in _data/simple-icons.json
• I optimized the icon with SVGO or SVGOMG
• The SVG viewbox is 0 0 24 24

Description

• Took existing SVG.
• Updated the image in Illustrator, resizing to canvas and centering.
• Ran npm run svgo command line optimizer.

[lukeocodes]

Hey @service-paradis, as you've done loads would you help and sanity check this one for me? If it's okay, I can go and do a load more.

Illustrator doesn't seem to enjoy the precision at 24px, so in the raw code everything is at or below 24, but after I optimize it and open it back up in Illustrator, it says the width is 24.0414px 🙄

I'm pretty confident it's wrong...

[ericcornelissen]

Illustrator doesn't seem to enjoy the precision at 24px, so in the raw code everything is at or below 24, but after I optimize it and open it back up in Illustrator, it says the width is 24.0414px

I'm pretty confident it's wrong...

Actually, it is likely due to optimizing. Part of the optimization is reducing the precision and this may change the width (and height) of the SVG. You can try increasing the precision of the optimization (if you tell us what you're using to do the optimization we can help you with how to do that) to the point where the width no longer changes.

Also, you can try removing Accusoft from the .svglint-ignored.json file and running npm run svglint (without SI_UPDATE_IGNORE=true!) again to check if it worked. If this command does not give any errors it is indeed the case that Illustrator is wrong.

[service-paradis]

I really had a hard time trying to fix or optimize icon using Illustrator. I finally used Inkscape. Here is a short summary of my process:

1. Open the current SVG (or the official one if needed) using Inkscape
2. Use the node editing tool to fix path if needed
   
3. While in Node editing mode, I use the transform tool to precisely scale the element and the canvas (sorry for the french capture). The checkboxes are important there (Scale proportionally and Apply to each object separately)
   
4. I switch back to the select tool
   
5. While in select mode, I use the Align and distribute tool to center the object vertically and horizontally
   
6. Finally, I use https://jakearchibald.github.io/svgomg/ to optimize

[fbernhart]

@lukeocodes Thanks for your work.

Unfortunately it seems like you've optimized the icon with a precision of 1, which leads to a loss of detail and deforms the icon (your version is the red one). Can you instead optimize it with a precision of 3?

And please as well remove the entry for Accusoft from the file .svglint-ignored.json.

[lukeocodes]

Hi Florian, happy to do this. Just out of interest, how do you overlay my version vs the original? I'd like to be able to produce that myself so I know I'm not butchering the icon. I've recently started using Inkscape for this too, so they've been much more accurate. Thanks for the feedback :) I'll try and get back to it ASAP

…

On Tue, 15 Dec 2020 at 09:59, Florian Bernhart ***@***.***> wrote: ***@***.**** commented on this pull request. ------------------------------ In icons/accusoft.svg <#3751 (comment)> : > \ No newline at end of file +<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>Accusoft icon</title><path d="M18.1 16.3c-.2-.3-8.7-11-9-11.4-.3-.3-.2-.4-.2-.5.1-.1.3-.1.9-.1h4.4c.8 0 .9.1 1 .1s.3.2.5.4c.1.1 7.7 9.2 7.8 9.3.1.1.2.3.3.4.1.2.1.4 0 .5-.1.1-4.3 1.8-4.4 1.8-.1.1-.3.1-.5.1-.3-.1-.5-.2-.8-.6m4.3-.2l.3.1s1 .2 1.1.2c.1 0 .2.1.2.1 0 .1-.1.1-.1.2-.1.1-4.6 2.9-4.7 2.9-.1.1-.2.1-.4.1-.5.1-1.3-.2-1.6-.2-.3 0-11.5-2.5-11.6-2.5-.1 0-.2 0-.2-.1 0-.2.2-.2.4-.3.2-.1 5.5-2 5.6-2.1.2-.1.4-.1.5-.1s.9.1 1.2.2 1.3.2 1.3.2l2.1 2.8c.4.4.6.6.9.6.2 0 .3 0 .5-.1s4.5-2 4.5-2M10.2 9.3s1.8 2.4 1.9 2.4c0 0 0 .1.1.1-.2.1-3.5 3.2-3.5 3.2l-3.5 1.3s-.1 0-.2.1v1.2L.7 19c-.2.1-.6.2-.7.2-.1-.1 0-.2.1-.2.1-.1 8.8-8.7 9.1-9 .5-.6 1-.7 1-.7"/></svg> @lukeocodes <https://github.com/lukeocodes> Thanks for your work. Unfortunately it seems like you've optimized the icon with a precision of 1, which leads to a loss of detail and deforms the icon (your version is the red one). Can you instead optimize it with a precision of 3? [image: image] <https://user-images.githubusercontent.com/70264417/102199394-dcddcb80-3ec3-11eb-9629-1a08d363b1fd.png> And please as well remove the entry for Accusoft from the file .svglint-ignored.json. — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub <#3751 (review)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AAHJPASXWSLQUQTJPI7IO63SU4XQBANCNFSM4SZKXPBQ> .

-- Regards, Luke

[fbernhart]

@lukeocodes It's easily doable with Inkscape. 😊

• Open the original version.
• Resize it to 24x24, center it.
• File --> Import; Open your new version.
• Give your new version a coloured fill (for example red) with an opacity. (Object --> Fill and Stroke)
• Center your new version.

[fbernhart]

I took the liberty to update this PR with the needed changes, as there has been no activity in the last few weeks.

I've rebuilt it, using the "Accusoft Icon (.SVG)" file from the source. I had to use a precision of 4 to pass the linter.

[adamrusted]

LGTM! Thanks @lukeocodes and @fbernhart for your work on this one!