Merge branch 'develop' of https://gitlab.steamware.net/egalware-web/special/webdoorcreator into develop
This commit is contained in:
@@ -1,5 +1,38 @@
|
||||
<div class="d-flex justify-content-between">
|
||||
<div class="btn @doorCSS w-100" @onclick="()=>doChangeStep(Core.Enum.DoorDefStep.Door)">Door</div>
|
||||
<div class="btn @hwCSS w-100" @onclick="()=>doChangeStep(Core.Enum.DoorDefStep.Hardware)">Hardware</div>
|
||||
<div class="btn @reportCSS w-100" @onclick="()=>doChangeStep(Core.Enum.DoorDefStep.Report)">Report</div>
|
||||
<div class="row bg-secondary text-light">
|
||||
<div class="col-4 p-0 fs-3 d-flex justify-content-between" @onclick="()=>doChangeStep(Core.Enum.DoorDefStep.Door)">
|
||||
@if (DoorDefStep == Core.Enum.DoorDefStep.Door)
|
||||
{
|
||||
<div class="tail-left"></div>
|
||||
<div class="@doorCSS flex-fill text-center">Door</div>
|
||||
<div class="arrow-right"></div>
|
||||
}
|
||||
else
|
||||
{
|
||||
<div class="@doorCSS flex-fill text-center">Door</div>
|
||||
}
|
||||
</div>
|
||||
<div class="col-4 p-0 fs-3 d-flex justify-content-between" @onclick="()=>doChangeStep(Core.Enum.DoorDefStep.Hardware)">
|
||||
@if (DoorDefStep == Core.Enum.DoorDefStep.Hardware)
|
||||
{
|
||||
<div class="tail-left"></div>
|
||||
<div class="@hwCSS flex-fill text-center">Hardware</div>
|
||||
<div class="arrow-right"></div>
|
||||
}
|
||||
else
|
||||
{
|
||||
<div class="@hwCSS flex-fill text-center">Hardware</div>
|
||||
}
|
||||
</div>
|
||||
<div class="col-4 p-0 fs-3 d-flex justify-content-between" @onclick="()=>doChangeStep(Core.Enum.DoorDefStep.Report)">
|
||||
@if (DoorDefStep == Core.Enum.DoorDefStep.Report)
|
||||
{
|
||||
<div class="tail-left"></div>
|
||||
<div class=" @reportCSS flex-fill text-center">Report</div>
|
||||
<div class="arrow-right"></div>
|
||||
}
|
||||
else
|
||||
{
|
||||
<div class=" @reportCSS flex-fill text-center">Report</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
@@ -10,30 +10,23 @@ namespace WebDoorCreator.UI.Components.DoorDef
|
||||
[Parameter]
|
||||
public EventCallback<Core.Enum.DoorDefStep> E_StepChanged { get; set; }
|
||||
|
||||
protected string doorCSS { get; set; } = "btn-secondary";
|
||||
protected string hwCSS { get; set; } = "btn-secondary";
|
||||
protected string reportCSS { get; set; } = "btn-secondary";
|
||||
protected string doorCSS
|
||||
{
|
||||
get => DoorDefStep == Core.Enum.DoorDefStep.Door ? "bg-success" : "bg-secondary";
|
||||
}
|
||||
protected string hwCSS
|
||||
{
|
||||
get => DoorDefStep == Core.Enum.DoorDefStep.Hardware ? "bg-success" : "bg-secondary";
|
||||
}
|
||||
protected string reportCSS
|
||||
{
|
||||
get => DoorDefStep == Core.Enum.DoorDefStep.Report ? "bg-success" : "bg-secondary";
|
||||
}
|
||||
|
||||
|
||||
protected override async Task OnParametersSetAsync()
|
||||
{
|
||||
await Task.Delay(1);
|
||||
|
||||
if(DoorDefStep == Core.Enum.DoorDefStep.Door)
|
||||
{
|
||||
doorCSS = "btn-success";
|
||||
}
|
||||
else if (DoorDefStep == Core.Enum.DoorDefStep.Hardware)
|
||||
{
|
||||
doorCSS = "btn-success";
|
||||
hwCSS = "btn-success";
|
||||
}
|
||||
else if(DoorDefStep == Core.Enum.DoorDefStep.Report)
|
||||
{
|
||||
doorCSS = "btn-success";
|
||||
hwCSS = "btn-success";
|
||||
reportCSS = "btn-success";
|
||||
}
|
||||
}
|
||||
|
||||
protected async Task doChangeStep(Core.Enum.DoorDefStep actDoorDefStep)
|
||||
|
||||
@@ -0,0 +1,17 @@
|
||||
/*.arrowItem {
|
||||
transform: skewX(20deg);
|
||||
}*/
|
||||
.arrow-right {
|
||||
width: 0;
|
||||
height: 0;
|
||||
border-top: 25px solid transparent;
|
||||
border-left: 30px solid #198754;
|
||||
border-bottom: 25px solid transparent;
|
||||
}
|
||||
.tail-left {
|
||||
width: 0;
|
||||
height: 0;
|
||||
border-top: 25px solid #198754;
|
||||
border-left: 30px solid transparent;
|
||||
border-bottom: 25px solid #198754;
|
||||
}
|
||||
@@ -0,0 +1,21 @@
|
||||
@bordL: 25px;
|
||||
@bordH: 30px;
|
||||
@itemColor: #198754;
|
||||
|
||||
/*.arrowItem {
|
||||
transform: skewX(20deg);
|
||||
}*/
|
||||
.arrow-right {
|
||||
width: 0;
|
||||
height: 0;
|
||||
border-top: @bordL solid transparent;
|
||||
border-left: @bordH solid @itemColor;
|
||||
border-bottom: @bordL solid transparent;
|
||||
}
|
||||
.tail-left {
|
||||
width: 0;
|
||||
height: 0;
|
||||
border-top: @bordL solid @itemColor;
|
||||
border-left: @bordH solid transparent;
|
||||
border-bottom: @bordL solid @itemColor;
|
||||
}
|
||||
@@ -0,0 +1 @@
|
||||
.arrow-right{width:0;height:0;border-top:25px solid transparent;border-left:30px solid #198754;border-bottom:25px solid transparent;}.tail-left{width:0;height:0;border-top:25px solid #198754;border-left:30px solid transparent;border-bottom:25px solid #198754;}
|
||||
@@ -30,5 +30,9 @@
|
||||
{
|
||||
"outputFile": "Components/Hardware/HwSingleInstance.razor.css",
|
||||
"inputFile": "Components/Hardware/HwSingleInstance.razor.less"
|
||||
},
|
||||
{
|
||||
"outputFile": "Components/DoorDef/StepsList.razor.css",
|
||||
"inputFile": "Components/DoorDef/StepsList.razor.less"
|
||||
}
|
||||
]
|
||||
Reference in New Issue
Block a user