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

[frontend] Implement list menu component (ISH-392)

Browse source
This commit is contained in:
Lilian 2024-07-02 01:38:40 +02:00
parent 80429d399b
commit ffcffe656a
No known key found for this signature in database
4 changed files with 48 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

18
Iceshrimp.Frontend/Components/Menu.razor Normal file
View file

@ -0,0 +1,18 @@
@if (_display)
{
<div class="menu">
@ChildContent
</div>
}
@code {
[Parameter] [EditorRequired] public required RenderFragment ChildContent { get; set; }
private bool _display;
public void Toggle()
{
_display = !_display;
StateHasChanged();
}
}

11
Iceshrimp.Frontend/Components/Menu.razor.css Normal file
View file

@ -0,0 +1,11 @@
.menu {
background-color: var(--foreground-color);
position: absolute;
padding: 0.5rem 1rem;
border-radius: 1rem;
border: var(--highlight-color) solid 0.1rem;
width: 13rem;
top: 2.5rem;
left: -5rem;
}

16
Iceshrimp.Frontend/Components/MenuElement.razor Normal file
View file

@ -0,0 +1,16 @@
@using Iceshrimp.Assets.PhosphorIcons
<div @onclick="OnClick" class="menu-element">
<Icon Name="Icon"></Icon>
@Text
</div>
@code {
[Parameter] [EditorRequired] public required IconName Icon { get; set; }
[Parameter] [EditorRequired] public required RenderFragment Text { get; set; }
[Parameter] [EditorRequired] public required EventCallback OnSelect { get; set; }
private async Task OnClick()
{
await OnSelect.InvokeAsync();
}
}

3
Iceshrimp.Frontend/Components/MenuElement.razor.css Normal file
View file

@ -0,0 +1,3 @@
.menu-element {
display: flex;
}