Teriuihi
a2f1a079cf
Refactor header background styling to use a method supporting optional gradient overlays. Update map component to include detailed server map links and adjust styling for better layout and clarity.
139 lines
8.3 KiB
HTML
139 lines
8.3 KiB
HTML
<ng-container>
|
|
<header id="top"
|
|
[ngStyle]="{ 'background-image': getBackgroundImage(), 'height': height }">
|
|
<nav id="nav" [ngClass]="active">
|
|
<div class="container">
|
|
<div id="mobile_nav">
|
|
<div id="menu_toggle">
|
|
<!--A fake / hidden checkbox is used as click receiver, so you can use the :checked selector on it.-->
|
|
<input type="checkbox"/>
|
|
<!--Some spans to act as a hamburger. They are acting like a real hamburger, not that McDonald's stuff.-->
|
|
<span class="hamburger"></span>
|
|
<span class="hamburger"></span>
|
|
<span class="hamburger"></span>
|
|
<!--Too bad the menu has to be inside of the button but hey, it's pure CSS magic.-->
|
|
<ul id="mobile_nav_list">
|
|
<li><a href="/">Home</a></li>
|
|
<li>
|
|
<a href="#">Features</a>
|
|
<ul class="mobile_dd">
|
|
<li><a [routerLink]="['/map']">Map</a></li>
|
|
<li><a [routerLink]="['/economy']">Economy</a></li>
|
|
<!-- <li><a [routerLink]="['/events']">Events</a></li> -->
|
|
<li><a [routerLink]="['/claiming']">Land Claiming</a></li>
|
|
<li><a [routerLink]="['/mypet']">MyPet</a></li>
|
|
<li><a [routerLink]="['/warps']">Warps</a></li>
|
|
<li><a [routerLink]="['/skyblock']">Skyblock</a></li>
|
|
<li><a [routerLink]="['/customfeatures']">Custom Features</a></li>
|
|
<li><a
|
|
href="https://kanboard.alttd.com/public/board/ef0c28f3d022f7e98801bbc97278e9a523c7c6dc2a3b0c58c47e2ebdbd1e">Suggestion
|
|
Board</a></li>
|
|
</ul>
|
|
</li>
|
|
<li>
|
|
<a href="#">Reference</a>
|
|
<ul class="mobile_dd">
|
|
<li><a [routerLink]="['/guide']">Guide Book</a></li>
|
|
<!-- <li><a [routerLink]="['/faq']">FAQ</a></li> -->
|
|
<li><a [routerLink]="['/ranks']">Ranks</a></li>
|
|
<li><a [routerLink]="['/rules']">Rules</a></li>
|
|
<li><a [routerLink]="['/commandlist']">Command List</a></li>
|
|
<li><a [routerLink]="['/mapart']">Mapart</a></li>
|
|
<li><a [routerLink]="['/lag']">Reducing Lag</a></li>
|
|
<li><a [routerLink]="['/staffpowers']">Staff Powers</a></li>
|
|
<li><a [routerLink]="['/nicknames']">Nicknames</a></li>
|
|
<li><a [routerLink]="['/bans']">Bans</a></li>
|
|
</ul>
|
|
</li>
|
|
<li><a href="https://discordapp.com/invite/TGqpzCJ">Discord</a></li>
|
|
<li><a [routerLink]="['/vote']">Vote</a></li>
|
|
<li><a href="https://store.alttd.com">Store</a></li>
|
|
<li>
|
|
<a href="#">Altitude</a>
|
|
<ul class="mobile_dd">
|
|
<li><a [routerLink]="['/about']">About Us</a></li>
|
|
<li><a [routerLink]="['/socials']">Socials</a></li>
|
|
<li><a [routerLink]="['/team']">Team</a></li>
|
|
<li><a [routerLink]="['/birthdays']">Famous Birthdays</a></li>
|
|
<li><a [routerLink]="['/community']">Community</a></li>
|
|
<li><a href="https://alttd.typeform.com/to/dnKlkX">Contact Us</a></li>
|
|
<li><a href="https://alttd.com/appeal">Ban Appeal</a></li>
|
|
<li><a href="https://alttd.com/blog/">Blog</a></li>
|
|
</ul>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
<a href="/"><img ngSrc="/public/img/logos/logo.png" alt="Altitude Server Logo" height="319" width="550"></a>
|
|
<ul id="nav_list">
|
|
<li class="nav_li"><a [id]="getCurrentPageId(['home'])" class="nav_link" href="/" [ngClass]="active">Home</a>
|
|
</li>
|
|
<li class="nav_li">
|
|
<span [id]="getCurrentPageId(['map', 'customfeatures', 'economy', 'events', 'mypet', 'warps',
|
|
'skyblock', 'claiming'])" class="nav_link fake_link" [ngClass]="active">Features</span>
|
|
<ul class="dropdown">
|
|
<li class="nav_li"><a class="nav_link2" [routerLink]="['/map']">Map</a></li>
|
|
<li class="nav_li"><a class="nav_link2" [routerLink]="['/economy']">Economy</a></li>
|
|
<!-- <li class="navli"><a class="nav_link2" [routerLink]="['/events']">Events</a></li> -->
|
|
<li class="nav_li"><a class="nav_link2" [routerLink]="['/claiming']">Land Claiming</a></li>
|
|
<li class="nav_li"><a class="nav_link2" [routerLink]="['/mypet']">MyPet</a></li>
|
|
<li class="nav_li"><a class="nav_link2" [routerLink]="['/warps']">Warps</a></li>
|
|
<li class="nav_li"><a class="nav_link2" [routerLink]="['/skyblock']">Skyblock</a></li>
|
|
<li class="nav_li"><a class="nav_link2" [routerLink]="['/customfeatures']">Custom Features</a></li>
|
|
<li class="nav_li"><a class="nav_link2"
|
|
href="https://kanboard.alttd.com/public/board/ef0c28f3d022f7e98801bbc97278e9a523c7c6dc2a3b0c58c47e2ebdbd1e">Suggestion
|
|
Board</a></li>
|
|
</ul>
|
|
</li>
|
|
<li class="nav_li">
|
|
<span
|
|
[id]="getCurrentPageId(['guide', 'faq', 'ranks', 'rules', 'commandlist', 'art', 'lag', 'staffpowers',
|
|
'nicknames', 'bans'])" class="nav_link fake_link" [ngClass]="active">Reference</span>
|
|
<ul class="dropdown">
|
|
<li class="nav_li"><a class="nav_link2" [routerLink]="['/guide']">Guide Book</a></li>
|
|
<!-- <li class="navli"><a class="nav_link2" [routerLink]="['/faq']">FAQ</a></li> -->
|
|
<li class="nav_li"><a class="nav_link2" [routerLink]="['/ranks']">Ranks</a></li>
|
|
<li class="nav_li"><a class="nav_link2" [routerLink]="['/rules']">Rules</a></li>
|
|
<li class="nav_li"><a class="nav_link2" [routerLink]="['/commandlist']">Command List</a></li>
|
|
<li class="nav_li"><a class="nav_link2" [routerLink]="['/mapart']">Mapart</a></li>
|
|
<li class="nav_li"><a class="nav_link2" [routerLink]="['/lag']">Reducing Lag</a></li>
|
|
<li class="nav_li"><a class="nav_link2" [routerLink]="['/staffpowers']">Staff Powers</a></li>
|
|
<li class="nav_li"><a class="nav_link2" [routerLink]="['/nicknames']">Nicknames</a></li>
|
|
<li class="nav_li"><a class="nav_link2" [routerLink]="['/bans']">Bans</a></li>
|
|
</ul>
|
|
</li>
|
|
<li class="nav_li"><a class="nav_link" target="_blank" rel="noopener"
|
|
href="https://discordapp.com/invite/TGqpzCJ" [ngClass]="active">Discord</a></li>
|
|
<li class="nav_li"><a [id]="getCurrentPageId(['vote'])" class="nav_link" [routerLink]="['/vote']"
|
|
[ngClass]="active">Vote</a>
|
|
</li>
|
|
<li class="nav_li">
|
|
<a class="nav_link" target="_blank" rel="noopener" href="https://store.alttd.com"
|
|
[ngClass]="active">Store</a>
|
|
</li>
|
|
<li class="nav_li">
|
|
<a [id]="getCurrentPageId(['about', 'team', 'community', 'birthdays'])"
|
|
class="nav_link fake_link" [ngClass]="active">Altitude</a>
|
|
<ul class="dropdown">
|
|
<li class="nav_li"><a class="nav_link2" [routerLink]="['/about']">About Us</a></li>
|
|
<li class="nav_li"><a class="nav_link2" [routerLink]="['/socials']">Socials</a></li>
|
|
<li class="nav_li"><a class="nav_link2" [routerLink]="['/team']">Team</a></li>
|
|
<li class="nav_li"><a class="nav_link2" [routerLink]="['/birthdays']">Famous Birthdays</a></li>
|
|
<li class="nav_li"><a class="nav_link2" [routerLink]="['/community']">Community</a></li>
|
|
<li class="nav_li"><a class="nav_link2" target="_blank" rel="noopener"
|
|
href="https://alttd.typeform.com/to/dnKlkX">Contact Us</a></li>
|
|
<li class="nav_li"><a class="nav_link2" target="_blank" rel="noopener" href="https://alttd.com/appeal">Ban
|
|
Appeal</a></li>
|
|
<li class="nav_li"><a class="nav_link2" target="_blank" href="https://alttd.com/blog/">Blog</a></li>
|
|
</ul>
|
|
</li>
|
|
</ul>
|
|
<app-theme></app-theme>
|
|
</div>
|
|
</nav>
|
|
|
|
<ng-content select="[header-content]"></ng-content>
|
|
|
|
</header>
|
|
</ng-container>
|