webapp: optimize look of firmware update cards

This commit is contained in:
Bernhard Kirchen 2024-10-27 21:03:39 +01:00 committed by Bernhard Kirchen
parent 2f0699d62e
commit e6ee0d584f

View File

@ -17,16 +17,15 @@
<p class="h1 mb-2"> <p class="h1 mb-2">
<BIconExclamationCircleFill /> <BIconExclamationCircleFill />
</p> </p>
{{ OTAError }}
<span style="vertical-align: middle" class="ml-2"> <div class="mt-3 d-flex gap-3 justify-content-center">
{{ OTAError }} <button class="btn btn-light" @click="clear">
</span> <BIconArrowLeft /> {{ $t('firmwareupgrade.Back') }}
<br /> </button>
<br /> <button class="btn btn-primary" @click="retryOTA">
<button class="btn btn-light" @click="clear"><BIconArrowLeft /> {{ $t('firmwareupgrade.Back') }}</button> <BIconArrowRepeat /> {{ $t('firmwareupgrade.Retry') }}
<button class="btn btn-primary" @click="retryOTA"> </button>
<BIconArrowRepeat /> {{ $t('firmwareupgrade.Retry') }} </div>
</button>
</CardElement> </CardElement>
<CardElement <CardElement
@ -35,13 +34,8 @@
center-content center-content
v-else-if="!loading && !uploading && OTASuccess" v-else-if="!loading && !uploading && OTASuccess"
> >
<span class="h1 mb-2"> <BIconCheckCircle class="fs-1" />&nbsp;{{ $t('firmwareupgrade.OtaSuccess') }}
<BIconCheckCircle /> <div>
</span>
<span> {{ $t('firmwareupgrade.OtaSuccess') }} </span>
<br />
<br />
<div class="text-center">
<div class="spinner-border" role="status"> <div class="spinner-border" role="status">
<span class="visually-hidden"></span> <span class="visually-hidden"></span>
</div> </div>
@ -62,7 +56,7 @@
center-content center-content
v-else-if="!loading && !uploading" v-else-if="!loading && !uploading"
> >
<div class="form-group pt-2 mt-3"> <div class="form-group">
<input class="form-control" type="file" ref="file" accept=".bin,.bin.gz" @change="uploadOTA" /> <input class="form-control" type="file" ref="file" accept=".bin,.bin.gz" @change="uploadOTA" />
</div> </div>
</CardElement> </CardElement>