Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Webapp Polishing #1362

Merged
merged 33 commits into from
Oct 29, 2024
Merged
Changes from 1 commit
Commits
Show all changes
33 commits
Select commit Hold shift + click to select a range
6db65ed
webapp: right-align labels for inputs on non-sm viewports
schlimmchen Oct 25, 2024
630b5c0
webapp: last table row shall have no bottom border
schlimmchen Oct 25, 2024
f4ce0ba
webapp: remove table's bottom margin
schlimmchen Oct 25, 2024
6f07d6a
webapp: add gap between inverter selectors
schlimmchen Oct 26, 2024
83cab36
webapp: avoid inline style in inverter channel info card
schlimmchen Oct 26, 2024
ed28913
webapp: equalize style of cards with tables in live view
schlimmchen Oct 26, 2024
fb83405
webapp: use reasonable name for radio stats accordion
schlimmchen Oct 25, 2024
2f189be
webapp: align table headers with card headers
schlimmchen Oct 26, 2024
6b0c363
webapp: apply card-table class to info view cards
schlimmchen Oct 26, 2024
4441f38
webapp: adjust look of tables in accordions to live view cards
schlimmchen Oct 26, 2024
7197dc6
webapp: beautify radio statistics reset button
schlimmchen Oct 26, 2024
a0faf96
webapp: fix inverter "add" and "save order" button positions
schlimmchen Oct 26, 2024
a2d79aa
webapp: do not use div with v-if but template elements
schlimmchen Oct 26, 2024
49dfaee
webapp: avoid spurious DOM elements, avoid v-show, use v-if
schlimmchen Oct 27, 2024
7905baa
webapp: optimize spacing on bottom of cards
schlimmchen Oct 26, 2024
723d3f1
webapp: MQTT: use v-if in favor of v-show
schlimmchen Oct 26, 2024
d8a7010
webapp: MQTT: no login with cert if TLS disabled
schlimmchen Oct 26, 2024
9a04a5c
webapp: avoid inline style for inverter channel info value
schlimmchen Oct 26, 2024
e2abc20
webapp: use value class to format live values
schlimmchen Oct 26, 2024
57565b9
webapp: fixup battery total cards
schlimmchen Oct 26, 2024
9d4e820
webapp: consistently use no colon in form labels
schlimmchen Oct 27, 2024
27083f1
webapp: replace remaining "OpenDTU" texts with "OpenDTU-OnBattery"
schlimmchen Oct 26, 2024
0321d4b
webapp: optimize placement of device profile doc buttons
schlimmchen Oct 27, 2024
311ca98
webapp: show pin mapping categories as cards
schlimmchen Oct 27, 2024
ebfc1a8
webapp: device manager: optimize cards for tab nav
schlimmchen Oct 27, 2024
cd31765
webapp: properly space alert with hint for hostname
schlimmchen Oct 27, 2024
728d8b8
webapp: optimize look of firmware update cards
schlimmchen Oct 27, 2024
4b5f7f1
webapp: inverter advanced tab needs space at the top
schlimmchen Oct 27, 2024
8a95960
webapp: fix AC charger admin view
schlimmchen Oct 27, 2024
6a63487
webapp: optimize look of login page
schlimmchen Oct 27, 2024
8d26836
webapp: optimize spacing around power meter test buttons
schlimmchen Oct 28, 2024
a9d8cf2
webapp: always scroll up when navigating to another view
schlimmchen Oct 28, 2024
af8bd9f
webapp: optimize body bottom padding and length
schlimmchen Oct 28, 2024
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Prev Previous commit
Next Next commit
webapp: MQTT: use v-if in favor of v-show
if we hide elements (which is done using style="display:none;"), they
are still part of the DOM and mess with CSS rules that shall apply to
the last element of a card or the last row of a table.
schlimmchen committed Oct 28, 2024
commit 723d3f15bb0324a2756003b206795a897677e9cc
18 changes: 9 additions & 9 deletions webapp/src/views/MqttAdminView.vue
Original file line number Diff line number Diff line change
@@ -14,15 +14,15 @@
/>

<InputElement
v-show="mqttConfigList.mqtt_enabled"
v-if="mqttConfigList.mqtt_enabled"
:label="$t('mqttadmin.VerboseLogging')"
v-model="mqttConfigList.mqtt_verbose_logging"
type="checkbox"
wide
/>

<InputElement
v-show="mqttConfigList.mqtt_enabled"
v-if="mqttConfigList.mqtt_enabled"
:label="$t('mqttadmin.EnableHass')"
v-model="mqttConfigList.mqtt_hass_enabled"
type="checkbox"
@@ -34,7 +34,7 @@
:text="$t('mqttadmin.MqttBrokerParameter')"
textVariant="text-bg-primary"
add-space
v-show="mqttConfigList.mqtt_enabled"
v-if="mqttConfigList.mqtt_enabled"
>
<InputElement
:label="$t('mqttadmin.Hostname')"
@@ -107,7 +107,7 @@
<InputElement :label="$t('mqttadmin.EnableTls')" v-model="mqttConfigList.mqtt_tls" type="checkbox" />

<InputElement
v-show="mqttConfigList.mqtt_tls"
v-if="mqttConfigList.mqtt_tls"
:label="$t('mqttadmin.RootCa')"
v-model="mqttConfigList.mqtt_root_ca_cert"
type="textarea"
@@ -116,14 +116,14 @@
/>

<InputElement
v-show="mqttConfigList.mqtt_tls"
v-if="mqttConfigList.mqtt_tls"
:label="$t('mqttadmin.TlsCertLoginEnable')"
v-model="mqttConfigList.mqtt_tls_cert_login"
type="checkbox"
/>

<InputElement
v-show="mqttConfigList.mqtt_tls_cert_login"
v-if="mqttConfigList.mqtt_tls_cert_login"
:label="$t('mqttadmin.ClientCert')"
v-model="mqttConfigList.mqtt_client_cert"
type="textarea"
@@ -132,7 +132,7 @@
/>

<InputElement
v-show="mqttConfigList.mqtt_tls_cert_login"
v-if="mqttConfigList.mqtt_tls_cert_login"
:label="$t('mqttadmin.ClientKey')"
v-model="mqttConfigList.mqtt_client_key"
type="textarea"
@@ -145,7 +145,7 @@
:text="$t('mqttadmin.LwtParameters')"
textVariant="text-bg-primary"
add-space
v-show="mqttConfigList.mqtt_enabled"
v-if="mqttConfigList.mqtt_enabled"
>
<InputElement
:label="$t('mqttadmin.LwtTopic')"
@@ -190,7 +190,7 @@
:text="$t('mqttadmin.HassParameters')"
textVariant="text-bg-primary"
add-space
v-show="mqttConfigList.mqtt_enabled && mqttConfigList.mqtt_hass_enabled"
v-if="mqttConfigList.mqtt_enabled && mqttConfigList.mqtt_hass_enabled"
>
<InputElement
:label="$t('mqttadmin.HassPrefixTopic')"
4 changes: 2 additions & 2 deletions webapp/src/views/MqttInfoView.vue
Original file line number Diff line number Diff line change
@@ -89,7 +89,7 @@
/>
</td>
</tr>
<tr v-show="mqttDataList.mqtt_tls">
<tr v-if="mqttDataList.mqtt_tls">
<th>{{ $t('mqttinfo.RootCertifcateInfo') }}</th>
<td>{{ mqttDataList.mqtt_root_ca_cert_info }}</td>
</tr>
@@ -103,7 +103,7 @@
/>
</td>
</tr>
<tr v-show="mqttDataList.mqtt_tls_cert_login">
<tr v-if="mqttDataList.mqtt_tls_cert_login">
<th>{{ $t('mqttinfo.ClientCertifcateInfo') }}</th>
<td>{{ mqttDataList.mqtt_client_cert_info }}</td>
</tr>