Fix spacing

This commit is contained in:
akastijn 2025-11-08 18:32:49 +01:00
parent 724b773be5
commit 042a6450c2

View File

@ -1,10 +1,10 @@
<ng-container> <ng-container>
<app-header [current_page]="'team'" height="450px" background_image="/public/img/backgrounds/staff.png" <app-header [current_page]="'team'" height="450px" background_image="/public/img/backgrounds/staff.png"
[overlay_gradient]="0.5">> [overlay_gradient]="0.5">>
<div class="title" header-content> <div class="title" header-content>
<h1>Staffing Team</h1> <h1>Staffing Team</h1>
<h2>The team that makes Altitude happen. Your owners, admins, moderators, and trainees are all working together to <h2>The team that makes Altitude happen. Your owners, admins, moderators, and trainees are all working together to
create Altitude, to create home. This is where the magic happens.</h2> create Altitude, to create home. This is where the magic happens.</h2>
</div> </div>
</app-header> </app-header>
@ -15,72 +15,72 @@
@for (member of getTeamMembers('owner') | async; track member) { @for (member of getTeamMembers('owner') | async; track member) {
<div class="member"> <div class="member">
<img [ngSrc]="getAvatarUrl(member)" alt="{{member.name}}'s Minecraft skin" <img [ngSrc]="getAvatarUrl(member)" alt="{{member.name}}'s Minecraft skin"
height="160" width="160" style="width: 160px;"> height="160" width="160" style="width: 160px;">
<h2>{{ member.name }}</h2> <h2>{{ member.name }}</h2>
<p>Owner</p> <p>Owner</p>
</div> </div>
} }
@for (member of getTeamMembers('manager') | async; track member) { @for (member of getTeamMembers('manager') | async; track member) {
<div class="member">
<img [ngSrc]="getAvatarUrl(member)" alt="{{member.name}}'s Minecraft skin"
height="160" width="160" style="width: 160px;">
<h2>{{ member.name }}</h2>
<p>Manager</p>
</div>
}
</div>
</section>
<section class="darkmodeSectionThree">
<div class="container teamContainer">
<h2 class="sectionTitle">Admins</h2>
@for (member of getTeamMembers('admin') | async; track member) {
<div class="member">
<img [ngSrc]="getAvatarUrl(member)" alt="{{member.name}}'s Minecraft skin"
height="160" width="160" style="width: 160px;">
<h2>{{ member.name }}</h2>
<p>Admin</p>
</div>
}
</div>
</section>
<section class="darkmodeSection">
<div class="container teamContainer">
<h2 class="sectionTitle">Head Moderators</h2>
@for (member of getTeamMembers('headmod') | async; track member) {
<div class="member">
<img [ngSrc]="getAvatarUrl(member)" alt="{{member.name}}'s Minecraft skin"
height="160" width="160" style="width: 160px;">
<h2>{{ member.name }}</h2>
<p>Head Mod</p>
</div>
}
</div>
</section>
<section class="darkmodeSectionThree">
<div class="container teamContainer">
<h2 class="sectionTitle">Moderators</h2>
@for (member of getTeamMembers('moderator') | async; track member) {
<div class="member">
<img [ngSrc]="getAvatarUrl(member)" alt="{{member.name}}'s Minecraft skin"
height="160" width="160" style="width: 160px;">
<h2>{{ member.name }}</h2>
</div>
}
</div>
</section>
@if ((getTeamMembers('trainee') | async)?.length ?? 0 > 0) {
<section class="darkmodeSection">
<div class="container teamContainer">
<h2 class="sectionTitle">Trainees</h2>
@for (member of getTeamMembers('trainee') | async; track member) {
<div class="member"> <div class="member">
<img [ngSrc]="getAvatarUrl(member)" alt="{{member.name}}'s Minecraft skin" <img [ngSrc]="getAvatarUrl(member)" alt="{{member.name}}'s Minecraft skin"
height="160" width="160" style="width: 160px;"> height="160" width="160" style="width: 160px;">
<h2>{{ member.name }}</h2> <h2>{{ member.name }}</h2>
<p>Manager</p>
</div>
}
</div>
</section>
<section class="darkmodeSectionThree">
<div class="container teamContainer">
<h2 class="sectionTitle">Admins</h2>
@for (member of getTeamMembers('admin') | async; track member) {
<div class="member">
<img [ngSrc]="getAvatarUrl(member)" alt="{{member.name}}'s Minecraft skin"
height="160" width="160" style="width: 160px;">
<h2>{{ member.name }}</h2>
<p>Admin</p>
</div>
}
</div> </div>
</section> }
<section class="darkmodeSection"> </div>
<div class="container teamContainer"> </section>
<h2 class="sectionTitle">Head Moderators</h2> }
@for (member of getTeamMembers('headmod') | async; track member) { </main>
<div class="member"> </ng-container>
<img [ngSrc]="getAvatarUrl(member)" alt="{{member.name}}'s Minecraft skin"
height="160" width="160" style="width: 160px;">
<h2>{{ member.name }}</h2>
<p>Head Mod</p>
</div>
}
</div>
</section>
<section class="darkmodeSectionThree">
<div class="container teamContainer">
<h2 class="sectionTitle">Moderators</h2>
@for (member of getTeamMembers('moderator') | async; track member) {
<div class="member">
<img [ngSrc]="getAvatarUrl(member)" alt="{{member.name}}'s Minecraft skin"
height="160" width="160" style="width: 160px;">
<h2>{{ member.name }}</h2>
</div>
}
</div>
</section>
@if ((getTeamMembers('trainee') | async)?.length ?? 0 > 0) {
<section class="darkmodeSection">
<div class="container teamContainer">
<h2 class="sectionTitle">Trainees</h2>
@for (member of getTeamMembers('trainee') | async; track member) {
<div class="member">
<img [ngSrc]="getAvatarUrl(member)" alt="{{member.name}}'s Minecraft skin"
height="160" width="160" style="width: 160px;">
<h2>{{ member.name }}</h2>
</div>
}
</div>
</section>
}
</main>
</ng-container>