Merge 9dbe08bb29 into 8143158399

components/number/index.rst

@@ -69,6 +69,10 @@ MQTT Options:
 
 - All other options from :ref:`MQTT Component <config-mqtt-component>`.
 
+Webserver Options:
+
+- All other options from :ref:`Webserver Component <config-webserver-sorting>`.
+
 Number Automation
 -----------------
 

components/web_server.rst

@@ -10,20 +10,28 @@ The ``web_server`` component creates a simple web server on the node that can be
 through any browser and a simple :ref:`api-rest`. Please note that enabling this component
 will take up *a lot* of memory and may decrease stability, especially on ESP8266.
 
+**Web server version 1**
+------------------------
+
 .. figure:: /components/images/web_server.png
     :align: center
     :width: 86.0%
 
-    Web server version 1
+    
-
 
+**Web server version 2**
+------------------------
 .. figure:: /components/images/web_server-v2.png
     :align: center
     :width: 86.0%
 
-    Web server version 2
+**Web server version 3**
-
+------------------------
+.. figure:: /components/images/web_server-v3.png
+    :align: center
+    :width: 86.0%
 
+    
 To navigate to the web server in your browser, either use the IP address of the node or
 use ``<node_name>.local/`` (note the trailing forward slash) via mDNS.
 
@@ -64,7 +72,7 @@ Configuration variables:
 - **ota** (*Optional*, boolean): Turn on or off the OTA feature inside webserver. Strongly not suggested without enabled authentication settings. Defaults to ``true``. Cannot be used with the ``esp-idf`` framework.
 - **id** (*Optional*, :ref:`config-id`): Manually specify the ID used for code generation.
 - **local** (*Optional*, boolean): Include supporting javascript locally allowing it to work without internet access. Defaults to ``false``.
-- **version** (*Optional*, string): ``1`` or ``2``. Version 1 displays as a table. Version 2 uses web components and has more functionality. Defaults to ``2``.
+- **version** (*Optional*, string): ``1``, ``2`` or ``3``. Version 1 displays as a table. Version 2 uses web components and has more functionality. Version 3 uses HA-Styling and has even more functionality. Defaults to ``2``.
 
 To conserve flash size, the CSS and JS files used on the root page to show a simple user
 interface are hosted by esphome.io. If you want to use your own service, use the
@@ -136,6 +144,23 @@ V2 embeds the css within the js file so is not required, however you could inclu
 
 Copy https://oi.esphome.io/v2/www.js to a V2 folder in your yaml folder.
 
+.. _config-webserver-sorting:
+
+Entity sorting
+--------------
+
+``web_server`` version 3 supports the sorting of the entitys.
+You can set a ``web_server_sorting_weight`` on each entity.
+Smaller numbers will be displayed first, defaults to 50.
+Example ``sensor`` configuration
+
+.. code-block:: yaml
+
+    sensor:
+      - platform: template
+        name: "My Sensor"
+        web_server_sorting_weight: -99
+
 
 See Also
 --------