notfire/Iceshrimp.NET
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

[frontend] Add birthday/location field icons and fix mobile alignment

Browse source
This commit is contained in:
pancakes 2024-11-01 23:51:18 +10:00 • committed by Lilian
parent 92e33462cb
commit d3af198a50
No known key found for this signature in database
2 changed files with 25 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

23
Iceshrimp.Frontend/Components/ProfileInfo.razor
View file

@ -1,6 +1,7 @@
@using Iceshrimp.Frontend.Localization
@using Iceshrimp.Shared.Schemas.Web
@using Microsoft.Extensions.Localization
@using Iceshrimp.Assets.PhosphorIcons
@inject IStringLocalizer<Localization> Loc;
<div class="profile-info">
@if (UserProfile.Bio != null)
@ -10,20 +11,26 @@
</div>
}
<div class="data">
@if (UserProfile.Location != null)
{
<div class="location field">
<span class="field-name">@Loc["Location"]</span>
<span class="field-value">@UserProfile.Location</span>
</div>
}
@if (UserProfile.Birthday != null)
{
<div class="birthday field">
<span class="field-name">@Loc["Birthday"]</span>
<span class="field-name">
<Icon Name="Icons.Balloon" Size="1.3em"/>
@Loc["Birthday"]
</span>
<span class="field-value">@UserProfile.Birthday</span>
</div>
}
@if (UserProfile.Location != null)
{
<div class="location field">
<span class="field-name">
<Icon Name="Icons.MapPin" Size="1.3em"/>
@Loc["Location"]
</span>
<span class="field-value">@UserProfile.Location</span>
</div>
}
</div>
@if (UserProfile.Fields != null)
{

10
Iceshrimp.Frontend/Components/ProfileInfo.razor.css
View file

@ -25,6 +25,10 @@
.field-name {
font-weight: 600;
width: 10rem;
.ph {
vertical-align: text-bottom;
}
}
}
}
@ -38,4 +42,10 @@
.field-data {
font-weight: 600;
}
}
@media (max-width: 640px) {
::deep .field {
flex-direction: column;
}
}