Add 'box-selected' css class

This commit is contained in:
Ivan Yaremenchuk 2022-08-21 19:52:48 -05:00
parent 4dbed82f05
commit 0a9e36d96e
2 changed files with 9 additions and 2 deletions

View File

@ -2,7 +2,10 @@
<RadzenDataList WrapItems="true" Data="@Data" TItem="NetworkModel" > <RadzenDataList WrapItems="true" Data="@Data" TItem="NetworkModel" >
<Template Context="network"> <Template Context="network">
<RadzenCard class=@("box" + (network.IsSupported ? string.Empty : " non-supported-container")) Style="width: 250px;" onclick="@(async () => await ToggleSelection(network.Id))"> <RadzenCard class=@("box"
+ (network.IsSupported ? string.Empty : " box-disabled")
+ (SelectedNetworkIds != null && SelectedNetworkIds.Contains(network.Id) ? " box-selected" : string.Empty))
Style="width: 250px;" onclick="@(async () => await ToggleSelection(network.Id))">
<div class="d-flex flex-row align-items-center"> <div class="d-flex flex-row align-items-center">
<RadzenImage Path=@("./images/" + (network.ImageName ?? "ethereum.svg")) Class="float-left mr-3" Style="width: 80px; height: 80px; margin-right: 1em;" /> <RadzenImage Path=@("./images/" + (network.ImageName ?? "ethereum.svg")) Class="float-left mr-3" Style="width: 80px; height: 80px; margin-right: 1em;" />
<div> <div>

View File

@ -72,10 +72,14 @@ a, .btn-link {
box-shadow: 0 0 11px rgba(33,33,33,.2); box-shadow: 0 0 11px rgba(33,33,33,.2);
} }
.non-supported-container { .box-disabled {
background-color: #dfdfdf !important; background-color: #dfdfdf !important;
} }
.box-selected {
border: solid 0.2em green !important;
}
.checkmark { .checkmark {
display:inline-block; display:inline-block;
width: 22px; width: 22px;