Skip to content

Commit

Permalink
webapp: beautify radio statistics reset button
Browse files Browse the repository at this point in the history
it would be nice to have this in the header of the accordion, which is
hard, but doable. however, clicking the button then also toggles the
accordion, which is unacceptable. preventing that seems non-trivial, as
the @click.stop() is not enough. also, nesting interactive elements is
simply bad practice. the button can also go to the right of header, with
reasonable effort, but the corner radii are then messed up and would
need to react interactively (accordion collapsed or not), which is also
a pain.

we now "float" the reset button to the right, add a nice icon, and give
the button some space so it at least looks like it belongs there.
  • Loading branch information
schlimmchen authored and tbnobody committed Nov 1, 2024
1 parent 3c188f2 commit 0832d3e
Showing 1 changed file with 19 additions and 17 deletions.
36 changes: 19 additions & 17 deletions webapp/src/views/HomeView.vue
Original file line number Diff line number Diff line change
Expand Up @@ -308,23 +308,25 @@
</tr>
</tbody>
</table>
<button
:disabled="!isLogged || performRadioStatsReset"
type="button"
class="btn btn-danger"
@click="onResetRadioStats(inverter.serial)"
>
<template v-if="!performRadioStatsReset">
{{ $t('home.StatsReset') }}
</template>
<template v-else>
<span
class="spinner-border spinner-border-sm"
aria-hidden="true"
></span>
<span role="status"> {{ $t('home.StatsResetting') }}</span>
</template>
</button>
<div class="d-flex">
<button
:disabled="!isLogged || performRadioStatsReset"
type="button"
class="btn btn-danger ms-auto me-3 mt-3"
@click="onResetRadioStats(inverter.serial)"
>
<template v-if="!performRadioStatsReset">
<BIconArrowCounterclockwise />&nbsp;{{ $t('home.StatsReset') }}
</template>
<template v-else>
<span
class="spinner-border spinner-border-sm"
aria-hidden="true"
></span>
<span role="status">&nbsp;{{ $t('home.StatsResetting') }}</span>
</template>
</button>
</div>
</div>
</div>
</div>
Expand Down

0 comments on commit 0832d3e

Please sign in to comment.