Use the regular styling for the disk reset button
Use the warning styling only for the confirmation
This commit is contained in:
parent
310a9ce2e2
commit
a874b2a332
@ -11,16 +11,40 @@
|
|||||||
else
|
else
|
||||||
dispatch('reset');
|
dispatch('reset');
|
||||||
}
|
}
|
||||||
function getButtonText()
|
function getButtonText(state)
|
||||||
{
|
{
|
||||||
if(state == "START")
|
if(state == "START")
|
||||||
return "Reset disk";
|
return "Reset disk";
|
||||||
else
|
else
|
||||||
return "Confirm?"
|
return "Reset disk. Confirm?"
|
||||||
|
}
|
||||||
|
function getBgColor(state)
|
||||||
|
{
|
||||||
|
if(state == "START")
|
||||||
|
{
|
||||||
|
// Use default
|
||||||
|
return undefined;
|
||||||
|
}
|
||||||
|
else
|
||||||
|
{
|
||||||
|
return "bg-red-900";
|
||||||
|
}
|
||||||
|
}
|
||||||
|
function getHoverColor(state)
|
||||||
|
{
|
||||||
|
if(state == "START")
|
||||||
|
{
|
||||||
|
// Use default
|
||||||
|
return undefined;
|
||||||
|
}
|
||||||
|
else
|
||||||
|
{
|
||||||
|
return "hover:bg-red-700";
|
||||||
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
<h1 class="text-lg font-bold">Disk</h1>
|
<h1 class="text-lg font-bold">Disk</h1>
|
||||||
<PanelButton buttonIcon="fa-solid fa-trash-can" clickHandler={handleReset} buttonText={getButtonText(state)} bgColor="bg-red-900" hoverColor="hover:bg-red-700">
|
<PanelButton buttonIcon="fa-solid fa-trash-can" clickHandler={handleReset} buttonText={getButtonText(state)} bgColor={getBgColor(state)} hoverColor={getHoverColor(state)}>
|
||||||
</PanelButton>
|
</PanelButton>
|
||||||
{#if state == "CONFIRM"}
|
{#if state == "CONFIRM"}
|
||||||
<p><span class="font-bold">Warning: </span>WebVM will reload</p>
|
<p><span class="font-bold">Warning: </span>WebVM will reload</p>
|
||||||
|
Loading…
x
Reference in New Issue
Block a user