From eb8d51f47c98c279cc3c3afbe7e14c6bf28598b3 Mon Sep 17 00:00:00 2001 From: SteWers <42718143+SteWers@users.noreply.github.com> Date: Sun, 7 Sep 2025 21:58:43 +0200 Subject: [PATCH] Update web UI styles and HTML syntax (#23847) * Update web UI styles and HTML syntax Merged HTTP_HEAD_STYLE2 into HTTP_HEAD_STYLE1 and removed redundant style files. Updated button and form HTML across web UI to use consistent markup. Adjusted various style and separator elements for improved HTML5 compliance and consistency. * Fix WiFi config page * Fix typo * Revert merging HTTP_HEAD_STYLE Revert merging `HTTP_HEAD_STYLE1.h` and `HTTP_HEAD_STYLE2.h` --- tasmota/html_compressed/HTTP_HEAD_STYLE1.h | 40 +++++++++---------- .../HTTP_HEAD_STYLE_ROOT_COLOR.h | 6 +-- tasmota/html_uncompressed/HTTP_HEAD_STYLE1.h | 1 - .../HTTP_HEAD_STYLE_ROOT_COLOR.h | 3 +- tasmota/include/i18n.h | 4 +- tasmota/include/xsns_62_esp32_mi.h | 2 +- .../xdrv_01_9_webserver.ino | 21 +++++----- .../tasmota_xdrv_driver/xdrv_02_9_mqtt.ino | 2 +- .../tasmota_xdrv_driver/xdrv_07_domoticz.ino | 2 +- .../xdrv_07_ufs_domoticz.ino | 2 +- .../tasmota_xdrv_driver/xdrv_09_timers.ino | 2 +- .../tasmota_xdrv_driver/xdrv_10_scripter.ino | 6 +-- tasmota/tasmota_xdrv_driver/xdrv_11_knx.ino | 2 +- .../xdrv_121_gpioviewer.ino | 2 +- .../xdrv_28_pcf8574_v2.ino | 2 +- .../tasmota_xdrv_driver/xdrv_43_mlx90640.ino | 2 +- .../xdrv_50_filesystem.ino | 2 +- .../tasmota_xdrv_driver/xdrv_52_9_berry.ino | 8 ++-- .../tasmota_xdrv_driver/xdrv_79_esp32_ble.ino | 2 +- .../tasmota_xsns_sensor/xsns_01_counter.ino | 2 +- tasmota/tasmota_xsns_sensor/xsns_34_hx711.ino | 4 +- .../tasmota_xsns_sensor/xsns_83_neopool.ino | 2 +- 22 files changed, 58 insertions(+), 61 deletions(-) diff --git a/tasmota/html_compressed/HTTP_HEAD_STYLE1.h b/tasmota/html_compressed/HTTP_HEAD_STYLE1.h index 60172fe53..4ddc8e498 100644 --- a/tasmota/html_compressed/HTTP_HEAD_STYLE1.h +++ b/tasmota/html_compressed/HTTP_HEAD_STYLE1.h @@ -1,26 +1,26 @@ ///////////////////////////////////////////////////////////////////// // compressed by tools/unishox/compress-html-uncompressed.py -// input sha256: a92df5da4ce64371d708d5b7f3d01034e2593d4b183bdbc689b47a77764de0c1 +// input sha256: f34fe5fc63b5aed264b8d6174930571a0834c9d9dcfd3edaf4d704e0260e24d4 ///////////////////////////////////////////////////////////////////// -const size_t HTTP_HEAD_STYLE1_SIZE = 646; // compressed size 348 bytes -const char HTTP_HEAD_STYLE1_COMPRESSED[] PROGMEM = "\x3D\x3D\x46\x41\x33\xF0\x4D\x33\x3A\x8C\x6B\x08\x4F\x3A\x3A\xB7\x86\x0B\xA3\xAB" - "\xCC\x26\x1D\x1E\xD1\x96\x20\x9B\xC3\xC7\x99\xCD\x21\x86\xC3\xC1\x8C\xEA\x3A\xFD" - "\xA6\xD6\x79\x9C\x84\xC6\x9E\x0F\x70\x21\xE1\xA7\xB4\x75\x86\x68\x3D\xFC\x17\xC2" - "\x1E\x66\x77\xF3\xBA\x75\x9D\x61\x9F\xB3\x1F\x1A\x77\x8F\x07\xB8\x61\xED\x1B\x7F" - "\x1E\xDE\x3C\xCE\x33\xA6\x93\x1A\x8E\x33\xC1\xEE\x2D\xE1\x82\xE8\xF6\x8F\xE8\x94" - "\x28\xF3\x39\x1B\x3E\x8F\x04\x3B\x0D\x87\x5F\xB4\xDB\xBC\x3C\x79\x8E\xCF\x88\xFE" - "\x75\x8E\xC3\x61\xE0\xEB\x1F\x63\x8D\x36\x8E\xB0\x52\xB4\x37\x0D\xA0\xA5\x5C\x13" - "\xB6\x7D\xE3\xBC\x78\x0F\x02\xCF\x82\x34\xEA\x36\x51\xDE\x04\x2D\xA4\xF7\xA8\xC8" - "\x63\x3E\x06\x29\x86\x68\x3B\x0D\x87\xBE\x08\x3C\x2D\x02\x0D\x1F\xD8\x9B\x87\xBE" - "\x08\x7C\x05\x31\xA7\x80\x41\xE0\xA8\xEB\xFE\x8F\x0A\xA3\xCC\xE7\x10\xC3\x61\xE0" - "\xCD\xFE\xB4\x3B\x08\xEB\xB0\xB4\x7B\x8F\x33\xAC\xE4\x21\x86\xC0\x48\xCC\xFF\x7C" - "\x3C\xC1\x0F\x1E\x38\x91\xF4\x78\x3D\xC4\x08\x5C\x59\x82\x3F\x0B\xC0\xC1\xF8\x0F" - "\xA6\x6C\xAB\xFB\xB3\xDB\xF7\xED\x36\xB3\xCC\x10\xF5\xD3\xC0\x21\x67\xE7\x3E\x7D" - "\x1E\x08\x53\xD1\xE1\x54\x79\x9C\xB9\xF2\x18\x6C\x3C\x02\x3F\x23\x78\x66\xFE\x60" - "\x2C\x1F\x3C\xEC\x5D\x60\x27\xEA\x63\x87\x81\x2F\x53\x0F\xC1\x02\x0E\xA8\x3B\x04" - "\x32\x3D\xB4\xCD\x94\x08\x5C\x23\x06\xFA\x9F\xC1\x07\x96\xE3\x16\x37\x42\x32\x3C" - "\xCC\xDF\xC4\xBE\xB3\xAB\xD7\xDE\x3A\xFC\xFF\xA6\x01\x4F\x40\x3D\xD4\x20\x22\x73" - "\x68\x71\x90\xC3\x61\xE0\xF7\x1B"; +const size_t HTTP_HEAD_STYLE1_SIZE = 639; // compressed size 345 bytes +const char HTTP_HEAD_STYLE1_COMPRESSED[] PROGMEM = "\x13\x4C\xCE\xA3\x1A\xC2\x13\xCE\x8E\xAD\xE1\x82\xE8\xEA\xF3\x09\x87\x47\xB4\x65" + "\x88\x26\xF0\xF1\xE6\x73\x48\x61\xB0\xF0\x63\x3A\x8E\xBF\x69\xB5\x9E\x67\x21\x31" + "\xA7\x83\xDC\x08\x78\x69\xED\x1D\x61\x9A\x0F\x7F\x05\xF0\x87\x99\x9D\xFC\xEE\x9D" + "\x67\x58\x67\xEC\xC7\xC6\x9D\xE3\xC1\xEE\x18\x7B\x46\xDF\xC7\xB7\x8F\x33\x8C\xE9" + "\xA4\xC6\xA3\x8C\xF0\x7B\x8B\x78\x60\xBA\x3D\xA3\xFA\x25\x0A\x3C\xCE\x46\xCF\xA3" + "\xC1\x0E\xC3\x61\xD7\xED\x36\xEF\x0F\x1E\x63\xB3\xE2\x3F\x9D\x63\xB0\xD8\x78\x3A" + "\xC7\xD8\xE3\x4D\xA3\xAC\x14\xAD\x0D\xC3\x68\x29\x57\x04\xED\x9F\x78\xEF\x1E\x03" + "\xC0\xB3\xE0\x8D\x3A\x8D\x94\x77\x81\x0B\x69\x3D\xEA\x32\x18\xCF\x81\x8A\x61\x9A" + "\x0E\xC3\x61\xEF\x82\x0F\x0B\x40\x83\x47\xF6\x26\xE1\xEF\x82\x1F\x01\x4C\x69\xE0" + "\x10\x78\x2A\x2B\x3A\xFF\xA3\xC2\xA8\xF3\x39\xC4\x30\xD8\x78\x33\x7F\xAD\x0E\xC2" + "\x3A\xEC\x2D\x1E\xE3\xCC\xEB\x39\x08\x61\xB0\x12\x33\x3F\xDF\x0F\x30\x43\xC7\x8E" + "\x24\x7D\x1E\x0F\x71\x02\x17\x16\x60\x8F\xC2\xF0\x30\x7E\x03\xE9\x9B\x2A\x2B\xFE" + "\xEC\xF6\xFD\xFB\x4D\xAC\xF3\x04\x3D\x74\xF0\x08\x59\xF9\xCF\x9F\x47\x82\x14\xF4" + "\x78\x55\x1E\x67\x2E\x7C\x86\x1B\x0F\x2A\x01\x8F\xC8\xDE\x19\xBF\x98\x0B\x07\xCF" + "\x3B\x17\x58\x09\xFA\x98\xE1\xE0\x4B\xD4\xC3\xF0\x40\x83\xAA\x0E\xC1\x0C\x8F\x6D" + "\x33\x65\x02\x17\x08\xC1\xBE\xA7\xF0\x41\xE5\xB8\xC5\x8D\xD0\x8C\x8F\x33\x37\xF1" + "\x2F\xAC\xEA\xF5\xF7\x8E\xBF\x3F\xE9\x80\x53\xD0\x0F\x75\x08\x08\x9C\xDA\x1C\x64" + "\x30\xD8\x78\x3D\xC6"; #define HTTP_HEAD_STYLE1 Decompress(HTTP_HEAD_STYLE1_COMPRESSED,HTTP_HEAD_STYLE1_SIZE).c_str() \ No newline at end of file diff --git a/tasmota/html_compressed/HTTP_HEAD_STYLE_ROOT_COLOR.h b/tasmota/html_compressed/HTTP_HEAD_STYLE_ROOT_COLOR.h index ee47212f1..307db8ad7 100644 --- a/tasmota/html_compressed/HTTP_HEAD_STYLE_ROOT_COLOR.h +++ b/tasmota/html_compressed/HTTP_HEAD_STYLE_ROOT_COLOR.h @@ -1,14 +1,14 @@ ///////////////////////////////////////////////////////////////////// // compressed by tools/unishox/compress-html-uncompressed.py -// input sha256: 1f042dbb6cfa6491dcc939f00b6fe46ec08b5186baacb85be6a2f2e24aa0e7b5 +// input sha256: a112dc52f358757d9993d14d9006ad457e4540f3967ee02664912a3785547cf4 ///////////////////////////////////////////////////////////////////// -const size_t HTTP_HEAD_STYLE_ROOT_COLOR_SIZE = 339; // compressed size 116 bytes +const size_t HTTP_HEAD_STYLE_ROOT_COLOR_SIZE = 331; // compressed size 110 bytes const char HTTP_HEAD_STYLE_ROOT_COLOR_COMPRESSED[] PROGMEM = "\x3D\x3D\x46\x41\x33\xF0\xF3\xFE\x65\x1E\xD3\xAC\xEB\x0C\xFD\x8E\x1E\x3C\xCF\x23" "\xE8\xE3\xE2\x36\x1E\x0E\xB3\xAC\x33\xF6\x63\xE3\x41\x1A\x55\x50\x40\x8F\x28\xD9" "\x40\x93\x28\x7F\xFC\x09\x33\x7C\x18\x60\x8D\x34\x75\x02\x3D\xB1\xD5\xD8\x60\xC0" "\x24\xCD\x04\x9C\xB8\x75\x70\xA3\x3F\x82\x4C\xDF\xF8\x12\xAF\x7F\xD4\x09\x98\x0F" "\x8C\xC1\x2E\x60\x24\xDF\xD0\x47\xD9\x34\x12\xB5\x20\xFC\x08\xFC\x20\x07\xE0\x81" - "\x2B\x84\x3B\x1C\x09\x32\x81\x16\xD9\xEE\x3D\x0E\xC0\x41\xE2\xA0"; + "\x2B\x84\x3B\x1C\x09\x32\x81\x16\xD9\xEE"; #define HTTP_HEAD_STYLE_ROOT_COLOR Decompress(HTTP_HEAD_STYLE_ROOT_COLOR_COMPRESSED,HTTP_HEAD_STYLE_ROOT_COLOR_SIZE).c_str() \ No newline at end of file diff --git a/tasmota/html_uncompressed/HTTP_HEAD_STYLE1.h b/tasmota/html_uncompressed/HTTP_HEAD_STYLE1.h index d9e5c537c..1cba50ca0 100644 --- a/tasmota/html_uncompressed/HTTP_HEAD_STYLE1.h +++ b/tasmota/html_uncompressed/HTTP_HEAD_STYLE1.h @@ -1,5 +1,4 @@ const char HTTP_HEAD_STYLE1[] PROGMEM = - ""; + "}"; diff --git a/tasmota/include/i18n.h b/tasmota/include/i18n.h index 21192b751..21093955c 100644 --- a/tasmota/include/i18n.h +++ b/tasmota/include/i18n.h @@ -978,8 +978,8 @@ const float kSpeedConversionFactor[] = {1, // none // xdrv_02_webserver.ino #ifdef USE_WEBSERVER // {s} =