update icon: apache (original, plain, line, original-wordmark, plain-wordmark, line-wordmark)

[cyberalien]

Double check these details before you open a PR

• PR does not match another non-stale PR currently opened

Features

Rewrite of Apache logos

This PR closes #1525
#1525

Notes

Full redesign of logos, based on official Apache logo

[Snailedlt]

Those icons are looking nice!

In addition to changing the color, please remove the width and height attributes, as well as optimizing the icons with SVGOMG by following this guide.

We should add checks for this, and automate the optimization with SVGO (I'll make issues for doing that)

[github-actions]

Hi!

I'm the check-bot and we have some issues with your PR:

SVG Error in 'apache-original.svg':
- 'viewBox' is not '0 0 128 128' -> Set it or scale the file using https://www.iloveimg.com/resize-image/resize-svg.

SVG Error in 'apache-original-wordmark.svg':
- 'viewBox' is not '0 0 128 128' -> Set it or scale the file using https://www.iloveimg.com/resize-image/resize-svg.

SVG Error in 'apache-plain.svg':
- 'viewBox' is not '0 0 128 128' -> Set it or scale the file using https://www.iloveimg.com/resize-image/resize-svg.

SVG Error in 'apache-plain-wordmark.svg':
- 'viewBox' is not '0 0 128 128' -> Set it or scale the file using https://www.iloveimg.com/resize-image/resize-svg.

SVG Error in 'apache-line.svg':
- 'viewBox' is not '0 0 128 128' -> Set it or scale the file using https://www.iloveimg.com/resize-image/resize-svg.

SVG Error in 'apache-line-wordmark.svg':
- 'viewBox' is not '0 0 128 128' -> Set it or scale the file using https://www.iloveimg.com/resize-image/resize-svg.

Check our CONTRIBUTING guide for more details regarding these errors.

Please address these issues. When you update this PR, I will check your SVGs again.

Thanks for your help,
SVG-Checker Bot 😄

[Snailedlt]

Looks like you removed the viewbox instead of the height and width attributes. Whoopsie 🙊

It can probbaly be fixed by just replacing

width="128" height="128"

With

viewbox="0 0 128 128"

[cyberalien]

Doh!

Fixed :)

[Snailedlt]

You're so fast! 💯

[github-actions]

Hi there,

I'm Devicons' Peek Bot and I just peeked at the icons that you wanted to add using icomoon.io.

Here are the SVGs as intepreted by Icomoon when we upload the files:

Here are the zoomed-in screenshots of the added icons as SVGs:

Here are the icons that will be generated by Icomoon:

Here are the zoomed-in screenshots of the added icons as icons:

Here are the colored versions:

The maintainers will now check for:

1. The number of Glyphs matches the number of SVGs that were selected.
2. The icons (second group of pictures) look the same as the SVGs (first group of pictures).
3. The icons are of high quality (legible, matches the official logo, etc.)

In case of font issues, it might be caused by Icomoon not accepting strokes in the SVGs. Check this doc for more details and fix the issues as instructed by Icomoon and update this PR once you are done.

Thank you for contributing to Devicon! I hope that your icons are accepted into the repository.

Note: If the images don't show up, it has been autodeleted by Imgur after 6 months due to our API choice.

Cheers,
Peek Bot 😊

[Snailedlt]

Te line-wordmark and plain-wordmark versions have these small defects :/

Do you know how to fix them? If not, you can tag lunatic-fox to get help fixing it, since he knows how to do it :)

[cyberalien]

I've checked shapes, those bugs don't exist. So looks like icomoon bug. My guess is it can't handle compressed paths that SVGO generates, which is a common problem with old parsers and often it looks just like that.

Updated icons with cleaned up path, hoping it fixes issue.

[github-actions]

Hi there,

I'm Devicons' Peek Bot and I just peeked at the icons that you wanted to add using icomoon.io.

Here are the SVGs as intepreted by Icomoon when we upload the files:

Here are the zoomed-in screenshots of the added icons as SVGs:

Here are the icons that will be generated by Icomoon:

Here are the zoomed-in screenshots of the added icons as icons:

Here are the colored versions:

The maintainers will now check for:

1. The number of Glyphs matches the number of SVGs that were selected.
2. The icons (second group of pictures) look the same as the SVGs (first group of pictures).
3. The icons are of high quality (legible, matches the official logo, etc.)

In case of font issues, it might be caused by Icomoon not accepting strokes in the SVGs. Check this doc for more details and fix the issues as instructed by Icomoon and update this PR once you are done.

Thank you for contributing to Devicon! I hope that your icons are accepted into the repository.

Note: If the images don't show up, it has been autodeleted by Imgur after 6 months due to our API choice.

Cheers,
Peek Bot 😊

[cyberalien]

Hm. Bad guess. Something else is bugged :(

[Snailedlt]

Yeah, I think those lines are usually the result of merging paths, causing paths to overlap. @lunatic-fox knows more about it, and can probably fix it when he has time.

@lunatic-fox maybe you could also make a little guide on how we can fix these issues?

[cyberalien]

Found a way to debug it on icomoon by creating custom font and importing icons. Icon does show that error there, but only after SVGO optimisation. Icon exported directly from Figma does not have that issue.

[cyberalien]

Should be fixed now

[github-actions]

Hi there,

I'm Devicons' Peek Bot and I just peeked at the icons that you wanted to add using icomoon.io.

Here are the SVGs as intepreted by Icomoon when we upload the files:

Here are the zoomed-in screenshots of the added icons as SVGs:

Here are the icons that will be generated by Icomoon:

Here are the zoomed-in screenshots of the added icons as icons:

Here are the colored versions:

The maintainers will now check for:

1. The number of Glyphs matches the number of SVGs that were selected.
2. The icons (second group of pictures) look the same as the SVGs (first group of pictures).
3. The icons are of high quality (legible, matches the official logo, etc.)

In case of font issues, it might be caused by Icomoon not accepting strokes in the SVGs. Check this doc for more details and fix the issues as instructed by Icomoon and update this PR once you are done.

Thank you for contributing to Devicon! I hope that your icons are accepted into the repository.

Note: If the images don't show up, it has been autodeleted by Imgur after 6 months due to our API choice.

Cheers,
Peek Bot 😊

[Snailedlt]

Ahh, yes the issue seems to be the combining of the paths. Sadly, line and plain icons only containing one path is a requirement from our side though. Luckily this is usually fixable by offsetting the paths a bit. I haven't found a good way to fix it consistently, but I think @lunatic-fox has, so hopefully he can share some knowledge about this

[cyberalien]

I've combined paths, it works fine. Issue is somewhere else.

In code I've used to clean up icons, I did run SVGO, but with the following plugins disabled: removeHiddenElems, convertShapeToPath, convertEllipseToCircle, convertPathData, mergePaths, reusePaths. Its a preset I'm using for animated icons, which is designed to not mess with shapes because SVGO is very bad at working with SVG 2 animations, messing up icons in 99% of cases.

So one of them causes issue. Biggest suspect is convertPathData.

[Snailedlt]

I see, maybe SVGOMG has the same options then. Worth checking out and updating the guide I linked to earlier if it does :)

[lunatic-fox]

Hello there!
I searched a little and shouldn't we be basing the icons on this one?

Source: APACHE SOFTWARE FOUNDATION

---

Perhaps, you're doing the base on this other one:

Source: APACHE HTTP SERVER

From Wikipedia we can also see this info about "Apache HTTP Server".

The Apache Software Foundation - Vectorised by Vulphere based from https://www.apache.org/logos/

But what's the difference?

"Apache Software Foundation" logo has few nodes compared to "Apache HTTP Server", which reinforce the idea that it's the original one.

Apache Software Foundation

Apache HTTP Server

The excess of nodes can be a problem when converted to font. And some segments have unnecessary curve nodes within a line segment.

As far as I see when converted to font that segments can be misinterpreted and resulting in spikes or bugged lines.

Changing the word "APACHE" based on "Apache Software Foundation" logo and optimizing in SVGO, they have no issues as seen below.

I think you can rebase the icons and you will have no problem. But if that happen for some oddly reason I'll be helping ASAP. 🙂

[cyberalien]

I agree. The simpler the shape is, the better and that source should help a lot.

[github-actions]

Hi there,

I'm Devicons' Peek Bot and I just peeked at the icons that you wanted to add using icomoon.io.

Here are the SVGs as intepreted by Icomoon when we upload the files:

Here are the zoomed-in screenshots of the added icons as SVGs:

Here are the icons that will be generated by Icomoon:

Here are the zoomed-in screenshots of the added icons as icons:

Here are the colored versions:

The maintainers will now check for:

1. The number of Glyphs matches the number of SVGs that were selected.
2. The icons (second group of pictures) look the same as the SVGs (first group of pictures).
3. The icons are of high quality (legible, matches the official logo, etc.)

In case of font issues, it might be caused by Icomoon not accepting strokes in the SVGs. Check this doc for more details and fix the issues as instructed by Icomoon and update this PR once you are done.

Thank you for contributing to Devicon! I hope that your icons are accepted into the repository.

Note: If the images don't show up, it has been autodeleted by Imgur after 6 months due to our API choice.

Cheers,
Peek Bot 😊

[Snailedlt]

Looks good! ✔️
Thank you for another great contribution 🚀

[lunatic-fox]

I got a little break here from research. 😅

And I think I didn't express myself right.
Well, I was asking if we should use the entirely logo, like, with the words "The Apache Software Foundation TM". I know is far way better the way it is now, because they're good to read even in small proportions, but I not sure about modifying it.

Another option would be preserve the font wordmark versions the way it is and do the original-wordmark version as the logo will all the features, since it's used as icon and not as font.

Let me now what you think @cyberalien and @Snailedlt.

I'll be answering back until tomorrow. 😉

[cyberalien]

I think that would make logo unreadable, unless scaled to really big icon, but then it would be too high, so unusable.

[Snailedlt]

Both ways work, but like cyberalien said, it quickly becomes unreadable on smaller sizes. That's not that big of a deal imo though, since we have the non-wordmark version available too.

Up to you guys what you decide on using, but I think we should add The Apache Software Foundation as an altname while we're at it :)

[Snailedlt]

"altnames": [
    "The Apache Software Foundation™"
]

[lunatic-fox]

"altnames": [
    "The Apache Software Foundation™",
    "The Apache Software Foundation"
]

For sure! 😅

[cyberalien]

Is there a standard for altnames field?

I've checked file, almost all entries are alternative icon names in lower case, not project name. Few items are project names in mixed case, few items are identical to name but with spacing. What I haven't found though is any entry with ™ and technically many names there are trademarks.

[Snailedlt]

@cyberalien nope, there are no naming standards for it. Basically altnames is used together with the name in the search field on the website. So it's only to make the icon more searchable atm.

Might use it for something more in the future though

[github-actions]

Hi there,

I'm Devicons' Peek Bot and I just peeked at the icons that you wanted to add using icomoon.io.

Here are the SVGs as intepreted by Icomoon when we upload the files:

Here are the zoomed-in screenshots of the added icons as SVGs:

Here are the icons that will be generated by Icomoon:

Here are the zoomed-in screenshots of the added icons as icons:

Here are the colored versions:

The maintainers will now check for:

1. The number of Glyphs matches the number of SVGs that were selected.
2. The icons (second group of pictures) look the same as the SVGs (first group of pictures).
3. The icons are of high quality (legible, matches the official logo, etc.)

In case of font issues, it might be caused by Icomoon not accepting strokes in the SVGs. Check this doc for more details and fix the issues as instructed by Icomoon and update this PR once you are done.

Thank you for contributing to Devicon! I hope that your icons are accepted into the repository.

Note: If the images don't show up, it has been autodeleted by Imgur after 6 months due to our API choice.

Cheers,
Peek Bot 😊

[lunatic-fox]

I was mixing up the gradient color with text color, sorry guys, my bad. 😅
I also ungroup some versions. Hope that's ok!

Approved! ✔
Thank you for this contribution! 🚀