better status and in progress view

This commit is contained in:
Julien Calixte
2023-04-10 23:36:23 +02:00
parent b716ea5c97
commit a2be252b71

View File

@@ -60,8 +60,8 @@ const isSuperiorToEstimation = computed(() => {
<span v-else></span> <span v-else></span>
</td> </td>
<td class="title"> <td class="title">
{{ step.title }}
<div v-if="isCurrentStep" class="blob green"></div> <div v-if="isCurrentStep" class="blob green"></div>
{{ step.title }}
</td> </td>
<td class="estimation">{{ step.estimation }} minutes</td> <td class="estimation">{{ step.estimation }} minutes</td>
<td v-if="stepRecord">{{ duration }} minutes</td> <td v-if="stepRecord">{{ duration }} minutes</td>
@@ -73,6 +73,10 @@ const isSuperiorToEstimation = computed(() => {
.step-record { .step-record {
.status { .status {
text-align: center; text-align: center;
div {
margin: auto;
}
} }
.rank { .rank {
@@ -80,15 +84,9 @@ const isSuperiorToEstimation = computed(() => {
} }
.blob { .blob {
background: black;
border-radius: 50%; border-radius: 50%;
box-shadow: 0 0 0 0 rgba(0, 0, 0, 1);
height: 10px; height: 10px;
width: 10px; width: 10px;
animation: pulse-black 2s infinite;
}
.blob {
background: rgba(51, 217, 178, 1); background: rgba(51, 217, 178, 1);
box-shadow: 0 0 0 0 rgba(51, 217, 178, 1); box-shadow: 0 0 0 0 rgba(51, 217, 178, 1);
animation: pulse 2s infinite; animation: pulse 2s infinite;
@@ -97,8 +95,8 @@ const isSuperiorToEstimation = computed(() => {
.title { .title {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: space-between;
padding-right: 1rem; padding-right: 1rem;
gap: 1rem;
} }
} }