feat: player info layout

This commit is contained in:
Mikhail Shabanov committed 2022-05-04 16:29:29 +02:00
1 parent a4d166e406
commit 17dd2c833c
3 files changed
+82 -38

No files matched your search

@@ -13,11 +13,19 @@
}
</h1>
<div style="margin-top: 10px; margin-bottom: 20px;">
<div>
<small>@Localize["Created"]: <b>@AccountInfo.CreatedAt.ToString("d") | @AccountInfo.CreatedAt.SinceTime(Localize)</b></small>
<div class="data-field">
<div class="data-label">@Localize["Created"]:</div>
<div class="data-value">
<div> <b>@AccountInfo.CreatedAt.ToString("d")</b></div>
<div class="data-label">@AccountInfo.CreatedAt.SinceTime(Localize)</div>
</div>
</div>
<div>
@Localize["Last battle"]: <b>@AccountInfo.LastBattleTime.ConvertToLocalTime().ToString("g") | @AccountInfo.LastBattleTime.ConvertToLocalTime().SinceTime(Localize)</b>
<div class="data-field">
<div class="data-label">@Localize["Last battle"]:</div>
<div class="data-value">
<div> <b>@AccountInfo.LastBattleTime.ConvertToLocalTime().ToString("g")</b></div>
<div class="data-label">@AccountInfo.LastBattleTime.ConvertToLocalTime().SinceTime(Localize)</div>
</div>
</div>
</div>
<RadzenTabs >
@@ -1,4 +1,21 @@
dates-section {
margin-top: 10px;
margin-bottom: 10px;
margin-top: 10px;
margin-bottom: 10px;
}
.data-field {
display: flex;
flex-direction: column;
justify-content: space-between;
}
.data-label {
color: #b3b1ad;
font-size: small;
}
.data-value {
display: flex;
flex-direction: row;
justify-content: space-between;
}
@@ -1,10 +1,9 @@
@using WotBlitzStatisticsPro.Blazor.Helpers
@inject IStringLocalizer<App> Localize;
<RadzenCard>
<div class="row">
<div class="col-md-3 col-lg-3">
<table class="table" width="230px">
<RadzenCard class="m-3" style="width: 350px;">
<table class="table" width="100%">
<tbody>
<tr>
<td>@Localize["Battles"]:</td>
@@ -34,37 +33,57 @@
</tr>
</tbody>
</table>
</div>
<div class="col-md-3 col-lg-3 align-items-center d-flex">
<div style="width: 120px; margin: 3px;">
@Localize["Most effective tank"]:
</div>
@if (MostRelevantTank != null)
{
<TankCard Tank=@MostRelevantTank></TankCard>
}
</div>
<div class="col-md-3 col-lg-3 align-items-center d-flex">
<div style="width: 100px; margin: 3px;">
@Localize["Tank with Max XP"] (@AccountInfo.MaxXp.ToString("N0")):
</div>
@if (MaxXpTank != null)
{
<TankCard Tank=@MaxXpTank></TankCard>
}
</div>
<div class="col-md-3 col-lg-3 align-items-center d-flex">
<div style="width: 100px; margin: 3px;">
@Localize["Tank with Max frags"] (@AccountInfo.MaxFrags):
</div>
</RadzenCard>
<RadzenCard class="m-3" style="width: 350px;">
<h3 class="h5">@Localize["Most effective tank"]</h3>
<div class="row">
<div class="col col-sm col-md col-lg col-xl">
</div>
<div class="col col-sm col-md col-lg col-xl">
@if (MostRelevantTank != null)
{
<TankCard Tank=@MostRelevantTank></TankCard>
}
</div>
<div class="col col-sm col-md col-lg col-xl">
</div>
@if (MaxFragsTank != null)
{
<TankCard Tank=@MaxFragsTank></TankCard>
}
</div>
</div>
</RadzenCard>
<RadzenCard class="m-3" style="width: 350px;">
<h3 class="h5">@Localize["Tank with Max XP"] (@AccountInfo.MaxXp.ToString("N0"))</h3>
<div class="row">
<div class="col col-sm col-md col-lg col-xl">
</div>
<div class="col col-sm col-md col-lg col-xl">
@if (MaxXpTank != null)
{
<TankCard Tank=@MaxXpTank></TankCard>
}
</div>
<div class="col col-sm col-md col-lg col-xl">
</div>
</div>
</RadzenCard>
<RadzenCard class="m-3" style="width: 350px;">
<h3 class="h5">@Localize["Tank with Max frags"] (@AccountInfo.MaxFrags)</h3>
<div class="row">
<div class="col col-sm col-md col-lg col-xl">
</div>
<div class="col col-sm col-md col-lg col-xl">
@if (MaxFragsTank != null)
{
<TankCard Tank=@MaxFragsTank></TankCard>
}
</div>
<div class="col col-sm col-md col-lg col-xl">
</div>
</div>
</RadzenCard>
</div>
</RadzenCard>
@code {
[Parameter]