Goal of this change is to prevent a overflow in the command queue by flooding it with MQTT commands and therefor also prevent the reading of the inverter data.
To achieve this it is now possible to specify a insert type for each queue element.
* increase the spacing between the icon and the text.
* put the text into its own box so it does not flow around the icon.
* vertically center the icon to account for multiple lines of text.
* vertically center the text to account for a single line of text.
closes#1441.
if a page uses the reload button, it had only 1 column of space, and
only if the viewport was at least "sm". this is not the case for typical
smartphones, in which case the reload button would appear on its own row
instead of to the right.
we now limit the heading to 10 columns if and only if the reload button
is to be used, otherwise the heading uses all 12 columns, regardless of
the viewport size. the reload buton uses two columns -- if it is
displayed at all.
the font size of the icon is increased slightly.
as the font size of h1 headings changes with the viewport size, we need
to center both the heading and the button vertically.
fixes an annoying warning (visible in the browser console):
[Vue warn]: Extraneous non-emits event listeners (reload) were passed to
component but could not be automatically inherited because component
renders fragment or text root nodes. If the listener is intended to be a
component custom event listener only, declare it using the "emits"
option.
the removal of console and debugger statements by esbuild even when not
building for production seems to be a regression, as these were
definitely working in the past.
this change uses the command parameter to configure esbuild to either
keep or indeed remove the respective statements. they are only kept if
command is not "serve".
to avoid having to indent everything in defineConfig() by one block, the
return statement and closing curly brace were added "inline".
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.
the top border of the card was breaking the design of the tabs, where
the active tab would be "visually connected" to the content. also, the
rounded border at the top did not blend in with the navbar's bottom
border.
on a desktop browser, this approach allows to display all categories at
once. we also increase readability as the values are much closer to
their label. previously, the values were far to the right of the screen
and it was unpleasent to read which value belonged to which setting. the
grouping of values per category was also not very well conceived.
by using cards, we also avoid some styling issues, namely the use of
rowspan, which caused a spurious table cell border at the end of the old
table layout.
* remove empty container for device profile links. if a device profile
has no links, no buttons are generated, but a row was still part of
the DOM, adding spurious space between the select and the alert with
the hint.
long forms, when scrolled to the bottom, would leave no space between
the bottom of the viewport and the buttons, which is unpleasent.
short views would still createa large (high) body, for apparently no
reason.
