mirror of
https://github.com/danbulant/Portfolio
synced 2026-05-24 12:35:31 +00:00
fix: orange progress bar for unsubmitted uploads
This commit is contained in:
parent
ad284b3435
commit
3fbd00dfd8
2 changed files with 26 additions and 22 deletions
|
|
@ -155,7 +155,7 @@
|
|||
>
|
||||
<div class="items-center text-center">
|
||||
<h2 class="text-sspsBlueDark mb-2 text-2xl font-bold">{Math.round(progress * 100)} %</h2>
|
||||
<ProgressBar {progress} />
|
||||
<ProgressBar submitted={status === 'submitted'} {progress} />
|
||||
</div>
|
||||
</div>
|
||||
{:else}
|
||||
|
|
|
|||
|
|
@ -1,5 +1,6 @@
|
|||
<script lang="ts">
|
||||
export let progress: number;
|
||||
export let submitted: boolean = false;
|
||||
</script>
|
||||
|
||||
<div class="progress-bar">
|
||||
|
|
@ -13,27 +14,30 @@
|
|||
>
|
||||
<line x1="5" y1="3" x2="45" y2="3" stroke="#e6e6e6" stroke-width="6" stroke-linecap="round" />
|
||||
|
||||
{#if progress === 1}
|
||||
<line
|
||||
x1="5"
|
||||
y1="3"
|
||||
x2={progress * 45}
|
||||
y2="3"
|
||||
stroke="#35e000ff"
|
||||
stroke-width="3"
|
||||
stroke-linecap="round"
|
||||
/>
|
||||
{:else}
|
||||
<line
|
||||
x1="5"
|
||||
y1="3"
|
||||
x2={progress * 45}
|
||||
y2="3"
|
||||
stroke="#75bff8ff"
|
||||
stroke-width="3"
|
||||
stroke-linecap="round"
|
||||
/>
|
||||
{/if}
|
||||
<line
|
||||
x1="5"
|
||||
y1="3"
|
||||
x2={progress * 45}
|
||||
y2="3"
|
||||
class:submitted={progress === 1 && submitted}
|
||||
class:not-submitted={progress === 1 && !submitted}
|
||||
class:uploading={progress !== 1}
|
||||
stroke-width="3"
|
||||
stroke-linecap="round"
|
||||
/>
|
||||
|
||||
>
|
||||
</svg>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.submitted {
|
||||
@apply stroke-[#35e000ff];
|
||||
}
|
||||
.not-submitted {
|
||||
@apply stroke-[#ef8b46];
|
||||
}
|
||||
.uploading {
|
||||
@apply stroke-[#75bff8ff];
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
Loading…
Reference in a new issue