Fixes 3803

[hSaria]

Fixes: #3803

Replaced the current PNG logo (raster-based) with an SVG one (vector-based).

I kept the old logo, but I don't think it is being referenced anymore.

[jeremystretch]

Looks great! One minor issue: in netbox_logo.svg, the text appears to be aligned along the top of the image, rather centered vertically with the icon. (Or, the bottom of the text is aligned along the vertical center of the image. I can't really tell.) Do you see this as well?

[hSaria]

That's odd. Which platform (OS and web browser) are you on? I don't think I used anything new or special in the SVG, but perhaps I did.

[jeremystretch]

This is using Firefox on Linux Mint. I see the same thing when viewing the SVG code on JSFiddle.

Edit: Renders correctly on Chrome.

[jeremystretch]

This looks relevant.

[hSaria]

alignment-baseline is set to middle but maybe that has limited supported.

[hSaria]

This works on FireFox, though I'm gonna test it on other platforms too given the unknown support for alignment-baseline and dominant-baseline.

[hSaria]

I could just use path instead of text for "netbox" which will two-birds-one-stone it:

• People that don't have the Avenir font won't see the fallback fonts
• Won't have to rely on alignment-baseline nor dominant-baseline to positing "netbox"

The downside is that changing the "font" won't be as easy as it would've gotten converted to a path.

[hSaria]

How about this? Had to play around, but got it working with the help of text-to-svg and some "finesse," if you will.

TextToSVG = require('text-to-svg');
textToSVG = TextToSVG.loadSync('Avenir-Heavy-05.ttf');

console.log(textToSVG.getD('netbox', {fontSize: 200, anchor: 'top', letterSpacing: 0.02}));

This should work everywhere as it's only built with circles, rectangles, and paths (all widely compatible).

[jeremystretch]

Can't say I have a strong opinion either way, so long as it's widely supported. I do like that the path approach ensures consistency regardless of installed fonts.

[jeremystretch]

Let's go with the path approach for now. We can always revert to the text approach later on if needed for some reason.