mirror of
https://github.com/hmaxnl/SharpRSS.git
synced 2024-09-20 01:54:20 +02:00
102 lines
3.0 KiB
Plaintext
102 lines
3.0 KiB
Plaintext
|
@using WebSharpRSS.Models
|
||
|
@using CodeHollow.FeedReader
|
||
|
<style>
|
||
|
.cat-item {
|
||
|
background: var(--background-color);
|
||
|
tab-index: 0;
|
||
|
width: 100%;
|
||
|
display: flex;
|
||
|
position: relative;
|
||
|
box-sizing: border-box;
|
||
|
text-align: start;
|
||
|
align-items: center;
|
||
|
padding-top: 8px;
|
||
|
padding-bottom: 8px;
|
||
|
justify-content: flex-start;
|
||
|
text-decoration: none;
|
||
|
}
|
||
|
.cat-item:hover {
|
||
|
background: var(--hover-bg-color);
|
||
|
}
|
||
|
.cat-item-text {
|
||
|
flex: 1 1 auto;
|
||
|
min-width: 0;
|
||
|
}
|
||
|
.cat-item-icon {
|
||
|
display: inline-flex;
|
||
|
min-width: 56px;
|
||
|
flex-shrink: 0;
|
||
|
}
|
||
|
|
||
|
.feed-item {
|
||
|
background: var(--background-color);
|
||
|
tab-index: 1;
|
||
|
}
|
||
|
.feed-item:hover {
|
||
|
background: var(--hover-bg-color);
|
||
|
}
|
||
|
</style>
|
||
|
|
||
|
<div>
|
||
|
<MudText>@HeaderText</MudText>
|
||
|
@foreach (CategoryGuideItem catItem in Categories)
|
||
|
{
|
||
|
<div>
|
||
|
<div @onclick="@(() => CatItemClicked(catItem))" class="cat-item mud-ripple" style="--hover-bg-color: @catItem.CategoryHexColor; --background-color: @(catItem.IsSelected ? catItem.CategoryHexColor : "transparent")">
|
||
|
@*<MudListItem Icon="@catItem.CategoryIcon">@catItem.CategoryTitle</MudListItem>*@
|
||
|
<div class="cat-item-icon">
|
||
|
<MudIcon Class="pointer-events-none" Icon="@catItem.CategoryIcon" Size="Size.Medium"/>
|
||
|
</div>
|
||
|
<div class="cat-item-text">
|
||
|
<MudText Class="pointer-events-none" Typo="Typo.subtitle1">@catItem.CategoryTitle</MudText>
|
||
|
</div>
|
||
|
</div>
|
||
|
@* Feeds *@
|
||
|
@if (catItem.IsExpanded && catItem.Feeds != null)
|
||
|
{
|
||
|
foreach (Feed feed in catItem.Feeds)
|
||
|
{
|
||
|
<div class="cat-item mud-ripple" style="--hover-bg-color: @catItem.CategoryHexColor">
|
||
|
@* Items *@
|
||
|
<div @onclick="() => FeedItemClicked(feed)">
|
||
|
@* Image *@
|
||
|
<MudText Class="pointer-events-none">@feed.Title</MudText>
|
||
|
</div>
|
||
|
</div>
|
||
|
}
|
||
|
}
|
||
|
</div>
|
||
|
}
|
||
|
</div>
|
||
|
|
||
|
@code {
|
||
|
[Parameter]
|
||
|
public string HeaderText { get; set; }
|
||
|
[Parameter]
|
||
|
public HashSet<CategoryGuideItem> Categories { get; set; } = new HashSet<CategoryGuideItem>();
|
||
|
[Parameter]
|
||
|
public Action<CategoryGuideItem> HandleCat { get; set; }
|
||
|
|
||
|
CategoryGuideItem? _selectedCategory;
|
||
|
|
||
|
void CatItemClicked(CategoryGuideItem categoryItem)
|
||
|
{
|
||
|
categoryItem.IsExpanded = !categoryItem.IsExpanded;
|
||
|
|
||
|
if (_selectedCategory != categoryItem)
|
||
|
{
|
||
|
if (_selectedCategory != null)
|
||
|
_selectedCategory.IsSelected = false;
|
||
|
_selectedCategory = categoryItem;
|
||
|
_selectedCategory.IsSelected = true;
|
||
|
}
|
||
|
//TODO: Handle click!
|
||
|
HandleCat(categoryItem);
|
||
|
}
|
||
|
|
||
|
void FeedItemClicked(Feed feed)
|
||
|
{
|
||
|
|
||
|
}
|
||
|
|
||
|
}
|