docs(site): make logo smaller

[nguyenvanduocit]

Logo is too big, it is taller than the menu.

The commit made it smaller.

Before:

After:

[natefinch]

I think I'd prefer to take the logo out of the sidebar, rather than make it so small. It looks weird being that small. We could have it just on the main page instead.

[mirogta]

Why don't we get the best out of both options?

@nguyenvanduocit could you make the size of the logo as tall as the "Mage" heading in the menu and move it to the left of "Mage" with a bit of padding on sides, rather than being above the heading. This way, the logo won't take any extra vertical space of the menu panel and it will make the navigation more accessible.

The full size logo could then still be on the main page, above the "Mage" heading. It's a nice logo after all.

[mirogta]

@natefinch this is what I had in mind - do you like it?

It would also benefit from removing the "Mage" from the gary.svg. The font in it doesn't match the "Mage" on the front page and it would make it easier to move the logo to the left (in the menu) and above (on the front page) the "Mage" text. Alternatively, we could have two different logos with different position of the "Mage" text. WDYT

---

Style I've hacked to make the screenshot:

Menu:

<a id="logo" href="/">

<div style="width:80px;height:91px;overflow-y:hidden;float:left">
<img src="/images/gary.svg">
</div>

<span style="color:#000;font-size:68px;font-weight:700;font-family:'Almendra', 'Novacento Sans Wide', 'Helvetica', 'Tahoma', 'Geneva', 'Arial', sans-serif">Mage</span>
</a>

Front page:

<div style="height:344px;overflow-y:hidden;text-align:center"><img src="/images/gary.svg" width="300px"></div>
<h1 class="site_title">Mage</h1>

[thorntonrose]

👍