[WebHost] Unify style and behavior of popover and mobile menus (#1596)

* [WebHost] Unify styles for popover and mobile menus. Adjust popover menu to function the same as the mobile menu, and toggle via JS.

* Remove class `first-link` in favor of CSS `:first-child`.

* Adjust mobile menu link font size and padding. Change wording of popover trigger text. Add border-right to popover menu. Change "Upload Host File" to "Host Game"

* Change mobile menu text to "Host Game"
This commit is contained in:
Chris Wilson
2023-03-27 00:12:10 -04:00
committed by GitHub
parent b5bd93c420
commit f09f3663d6
4 changed files with 63 additions and 33 deletions

View File

@@ -11,18 +11,16 @@
</a>
</div>
<div id="base-header-right">
<div id="dropdown">
<span id="dropdown-text">
<img id="dropdown-icon" src="/static/static/button-images/dropdown.png"></img>
start playing
</span>
<span id="dropdown-menu">
<div><a href="/games">supported games</a></div>
<div><a href="/generate">generate game</a></div>
<div><a href="/uploads">upload game</a></div>
<div><a href="/user-content">user content</a></div>
<div><a href="/tutorial">setup guides</a></div>
</span>
<div id="base-header-popover-text">
<img id="base-header-popover-icon" src="/static/static/button-images/popover.png" alt="Popover Menu" />
get started
</div>
<div id="base-header-popover-menu">
<a href="/games">supported games</a>
<a href="/tutorial">setup guides</a>
<a href="/generate">generate game</a>
<a href="/uploads">host game</a>
<a href="/user-content">user content</a>
</div>
<a href="/faq/en">f.a.q</a>
<a href="https://discord.gg/8Z65BR2" target="_blank">discord</a>
@@ -38,8 +36,8 @@
<a href="/tutorial">setup guides</a>
<a href="/faq/en">f.a.q.</a>
<a href="/generate">generate game</a>
<a href="/uploads">host game</a>
<a href="/user-content">user content</a>
<a href="/uploads">upload game</a>
<a href="https://discord.gg/8Z65BR2" target="_blank">discord</a>
</div>
{% endblock %}