[Icons] explain svg size

[dbu]

Q	A
Bug fix?	no
New feature?	no
Docs?	yes
Issues	-
License	MIT

better explain that icons need their size specified, and explain how to do that.

[smnandre]

Suggested change

	.. note::
	Without size instructions, ``<svg>`` elements will be dynamically sized by the browser.
	For icons, we therefore recommend to explicitly set the size. This can be done with a
	CSS class or a height attribute in pixels, with variables of your CSS framework or using
	``em`` to set the size in relation to the font size of the current element.
	Note that it is enough to specify the height, the width will be adjusted accordingly:
	.. code-block:: twig
	{{ ux_icon('user-profile', {style: 'height: 1em;'}) }}
	For a consistent look, you might want to set the size through a
	:ref:`default attribute <icons_default_attributes>`.
	Icon Sizes
	~~~~~~~~
	.. note::
	``<svg>`` elements will be dynamically sized by the browser.
	For icons, we therefore recommend to explicitly set the size.
	To align icons naturally with surrounding text and inherit font sizing, use ``em``
	units. This works well for buttons, links, or inline text. Defining the height alone
	is sufficient—the width will scale proportionally:
	.. code-block::twig
	{# Twig function #}
	{{ ux_icon('user-profile', {style: 'height: 1em;'}) }}
	{# HTML syntax #}
	<twig:ux:icon name="profile" style="height: 1em;" />
	If your project uses a CSS framework like Tailwind or Bootstrap, prefer their
	sizing utilities for consistency and theming:
	.. code-block::twig
	{# Twig function #}
	{{ ux_icon('bi:chat', {class: 'size-4'}) }}
	{# HTML syntax #}
	<twig:ux:icon name="bi:chat" class="size-4" />
	To keep your design consistent and easily adjustable, consider defining a :ref:default attribute <icons_default_attributes>. This allows you to control the size of all your icons from a single place.

wdyt?