Katheryne/Frontend/Shared/MessageBubble.razor

60 lines
1.5 KiB
Plaintext

@using Frontend.Models
<div>
@if (Message.Left)
{
<Space Align="start">
<SpaceItem>
<Avatar Style="background-color: #5d92e4" Size="2.5rem">
@Message.Sender.First()
</Avatar>
</SpaceItem>
<SpaceItem>
<p style="font-size: 0.8rem; color: rgb(128,128,128)">
@Message.Sender
</p>
<div class="bubble-left">
<p class="message-text">
@Message.Text
</p>
</div>
</SpaceItem>
</Space>
}
else
{
<Space Align="start">
<SpaceItem>
<div>
<p style="font-size: 0.8rem; color: rgb(128, 128, 128); text-align: right;">
@Message.Sender
</p>
<div class="bubble-right">
<p class="message-text">
@Message.Text
</p>
</div>
</div>
</SpaceItem>
<SpaceItem>
<Avatar Style="background-color: #5d92e4" Size="2.5rem">
@Message.Sender.First()
</Avatar>
</SpaceItem>
</Space>
}
</div>
@code {
[Parameter]
public ChatMessage Message { get; set; } = new()
{
Left = true,
Sender = "default",
Text = "default"
};
}