Setup Assistant: Style progress for current + done step

As well as color when a step is already done but we are at a previous step.

First step is always marked as done and colored.
This commit is contained in:
Pablo Vazquez 2022-07-22 12:02:38 +02:00 committed by Francesco Siddi
parent 860017fb42
commit 341f874ec2

@ -7,7 +7,9 @@
@click="jumpToStep(step)"
:class="{
current: step == currentSetupStep,
done: step < currentSetupStep,
done: step < overallSetupStep,
done_previously: (step < overallSetupStep && currentSetupStep > step),
done_and_current: step == currentSetupStep && (step < overallSetupStep || step == 1),
disabled: step > overallSetupStep,
}"
>
@ -498,6 +500,11 @@ export default {
}
.progress li.done span {
background-color: var(--setup-progress-indicator-color);
box-shadow: 0 0 0 var(--setup-progress-indicator-border-width) var(--setup-progress-indicator-color);
}
.progress li.done_previously span {
background-color: var(--setup-progress-indicator-color-done);
box-shadow: 0 0 0 var(--setup-progress-indicator-border-width) var(--setup-progress-indicator-color-done);
}
@ -507,6 +514,11 @@ export default {
box-shadow: 0 0 0 var(--setup-progress-indicator-border-width) var(--setup-progress-indicator-color-current);
}
.progress li.done_and_current span {
background-color: var(--setup-progress-indicator-color-current);
box-shadow: 0 0 0 var(--setup-progress-indicator-border-width) var(--setup-progress-indicator-color-current);
}
body.is-setup-assistant #app {
grid-template-areas:
"header"