Tweak ha-form (#10194)

src/components/ha-form/ha-form-float.ts

@@ -24,6 +24,7 @@ export class HaFormFloat extends LitElement implements HaFormElement {
   protected render(): TemplateResult {
     return html`
       <mwc-textfield
+        inputMode="decimal"
         .label=${this.label}
         .value=${this.data !== undefined ? this.data : ""}
         .required=${this.schema.required}

src/components/ha-form/ha-form-integer.ts

@@ -63,6 +63,7 @@ export class HaFormInteger extends LitElement implements HaFormElement {
     return html`
       <mwc-textfield
         type="number"
+        inputMode="numeric"
         .label=${this.label}
         .value=${this.data !== undefined ? this.data : ""}
         .required=${this.schema.required}

src/components/ha-form/ha-form-multi_select.ts

@@ -101,8 +101,6 @@ export class HaFormMultiSelect extends LitElement implements HaFormElement {
         this.shadowRoot?.querySelector("mwc-textfield") || ({} as any);
       if (formElement) {
         formElement.style.textOverflow = "ellipsis";
-        formElement.style.cursor = "pointer";
-        formElement.setAttribute("readonly", "");
       }
       if (mdcRoot) {
         mdcRoot.style.cursor = "pointer";
@@ -162,10 +160,17 @@ export class HaFormMultiSelect extends LitElement implements HaFormElement {
       :host([own-margin]) {
         margin-bottom: 5px;
       }
-      ha-button-menu,
-      mwc-textfield,
+      ha-button-menu {
+        display: block;
+        cursor: pointer;
+      }
       mwc-formfield {
         display: block;
+        padding-right: 16px;
+      }
+      mwc-textfield {
+        display: block;
+        pointer-events: none;
       }
       ha-svg-icon {
         color: var(--input-dropdown-icon-color);

src/components/paper-time-input.js

@@ -119,6 +119,7 @@ export class PaperTimeInput extends PolymerElement {
         <paper-input
           id="hour"
           type="number"
+          inputmode="numeric"
           value="{{hour}}"
           label="[[hourLabel]]"
           on-change="_shouldFormatHour"
@@ -141,6 +142,7 @@ export class PaperTimeInput extends PolymerElement {
           class$="[[_computeClassNames(enableSecond)]]"
           id="min"
           type="number"
+          inputmode="numeric"
           value="{{min}}"
           label="[[minLabel]]"
           on-change="_formatMin"
@@ -163,6 +165,7 @@ export class PaperTimeInput extends PolymerElement {
           class$="[[_computeClassNames(enableMillisecond)]]"
           id="sec"
           type="number"
+          inputmode="numeric"
           value="{{sec}}"
           label="[[secLabel]]"
           on-change="_formatSec"