Altitude/AltitudeWeb
5
0
Fork 0
Code Issues 12 Pull Requests Actions Packages Projects Releases Wiki Activity

Punishment page styling

Browse Source
This commit is contained in:
Peter 2025-04-12 00:53:20 +02:00
parent 02c69b318a
commit df9c3ac996
4 changed files with 73 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
frontend/src/app/bans/bans.component.html
View File

@ -18,6 +18,7 @@
</div> </div>
<div class="historySearchContainer"> <div class="historySearchContainer">
<input class="historySearch" type="text" placeholder="Search.."> <input class="historySearch" type="text" placeholder="Search..">
<button class="searchButton">Search</button>
</div> </div>
</div> </div>
<div class="historyTable"> <div class="historyTable">

22
frontend/src/app/bans/bans.component.scss
View File

@ -3,12 +3,12 @@ main .container {
} }
.container { .container {
max-width: 1200px; max-width: 1300px;
} }
.columnSection { .columnSection {
padding: 20px 0 20px 0; padding: 20px 0 20px 0;
max-width: 1200px; max-width: 1300px;
} }
.historyTypeContainer { .historyTypeContainer {
@ -22,15 +22,23 @@ main .container {
text-align: right; text-align: right;
} }
.historySearch { .button-outer {
margin-right: 15px;
}
.historySearch {
vertical-align: -15px;
}
.searchButton {
vertical-align: -15px;
} }
.historyTable { .historyTable {
font-family: 'open-sans', sans-serif; font-family: 'open-sans', sans-serif;
margin-bottom: 20px; margin-bottom: 20px;
} width: 100%;
text-align: center;
.button-outer { box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
margin-right: 15px; border-radius: 5px;
} }

42
frontend/src/app/bans/history/history.component.html
View File

@ -3,25 +3,29 @@
</ng-container> </ng-container>
<ng-container *ngIf="history.length > 0"> <ng-container *ngIf="history.length > 0">
<table> <table [cellSpacing]="0">
<thead> <div style="width: 1300px; background-color: #dadada;">
<tr> <thead>
<th>Player</th> <tr>
<th>Banned By</th> <th class="historyPlayer">Player</th>
<th>Reason</th> <th class="historyPlayer">Banned By</th>
<th>Date</th> <th class="historyReason">Reason</th>
<th>Expires</th> <th class="historyDate">Date</th>
</tr> <th class="historyDate">Expires</th>
</thead> </tr>
<tbody> </thead>
<tr *ngFor="let entry of history"> </div>
<td>{{ entry.username }}</td> <div>
<td>{{ entry.punishedBy }}</td> <tbody>
<td>{{ entry.reason }}</td> <tr *ngFor="let entry of history">
<td>{{ getPunishmentTime(entry) }}</td> <td class="historyPlayer">{{ entry.username }}</td>
<td>{{ getExpiredTime(entry) }}</td> <td class="historyPlayer">{{ entry.punishedBy }}</td>
</tr> <td class="historyReason">{{ entry.reason }}</td>
</tbody> <td class="historyDate">{{ getPunishmentTime(entry) }}</td>
<td class="historyDate">{{ getExpiredTime(entry) }}</td>
</tr>
</tbody>
</div>
</table> </table>
</ng-container> </ng-container>

34
frontend/src/app/bans/history/history.component.scss
View File

@ -0,0 +1,34 @@
table {
width: 100%;
table-layout: fixed;
}
thead {
height: 25px;
font-size: 1.1em;
}
tbody {
font-size: 0.9em;
}
td {
padding: 5px 0 5px 0;
}
th, td {
text-overflow: ellipsis;
}
.historyPlayer {
width: 200px;
text-overflow: clip;
}
.historyReason {
width: 940px;
}
.historyDate {
width: 160px;
}