patrick/OpenDTU
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

webapp: fix inverter selection button breaking

Browse Source 
on small viewports, the icon and the inverter label would be displayed
in two lines. this change keeps the icon and the label tied together in
any case, and the icon is centered vertically around the label.
This commit is contained in:
Bernhard Kirchen 2024-11-03 20:10:18 +01:00 committed by Thomas Basler
parent 661ea6c022
commit 3c56ec3738
1 changed files with 3 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
webapp/src/views/HomeView.vue
View File

@ -29,8 +29,8 @@
aria-controls="'v-pills-' + inverter.serial"
aria-selected="true"
>
<div class="row">
<div class="col-auto col-sm-2">
<div class="d-flex align-items-center">
<div class="me-2">
<BIconXCircleFill class="fs-4" v-if="!inverter.reachable" />
<BIconExclamationCircleFill
class="fs-4"
@ -38,7 +38,7 @@
/>
<BIconCheckCircleFill class="fs-4" v-if="inverter.reachable && inverter.producing" />
</div>
<div class="col-sm-9">
<div class="ms-auto me-auto">
{{ inverter.name }}
</div>
</div>