[4] Hide up/down selector arrows on HTML5 Number textboxes

[PhilETaylor]

Steps to reproduce the issue

Throughout Joomla 4 there are input boxes of type="number" - this correctly, in browsers, provided an up and down selector arrow.

However, a lot of the number boxes Joomla uses for readonly data - and Joomla 4 disables these textboxes to show the user they cannot be modifies.

However, disabling a textbox of type="number" doesn't remove the up/down arrows, and could lead to confusion that these numbers can be changed, indeed the browser shows visual feedback when they are clicked, even though the number doesn't change.

A VERY quick google shows me that the arrows CAN be hidden by CSS easily, and thus applied if a textbox of type="number" is disabled.

https://www.w3schools.com/howto/howto_css_hide_arrow_number.asp

Expected result

Same as actual result, but without the browser added up and down arrows on disabled fields.

Actual result

System information (as much as possible)

safari on mac

Additional comments

[brianteeman]

We should not override native html5

[brianteeman]

On a disabled/readonly field the arrows do not appear at all in
Chrome Windows
Edge Windows

They do appear on Firefox

[Quy]

A possible fix is to change the type attribute to text. Revision is an integer yet it is specified as a text.

		<field
			name="version"
			type="text"
			label="COM_CONTENT_FIELD_VERSION_LABEL"
			size="6"
			class="readonly"
			readonly="true"
			filter="unset"
		/>