'Pointer' cursor on DateInput component

Ignition
1

I have a DateTime Input component (date and time), and I want to show a pointer cursor on hover instead of the default text cursor.

The appropriate style class is applied to the component, like is described in this thread.

On hover in the designer, the cursor is a pointer like I would expect. But when running in a browser (tried in both Edge and Chrome), I am still getting the text cursor when hovering over the component.

This component is contained in a flex container – would that be interfering with the hover behavior? The only other factor that might be at play here is a quick startup event script on the overarching root container that writes a timestamp to the component’s value property. No bindings are applied to the component.

2

No need for the on hover element state, just add the pointer cursor to the normal state (base style)

3

Just tried it and the same thing is happening – cursor is a pointer in the designer, but text input style in browser :thinking:

5

The object that the standard cursor is being applied is not the base input field. It's a wrapper in the DOM. The input element has a cursor: text property

image
image1108×772 80.5 KB

You can use this class to target the input field inside of the input component.
Add the following to the advanced style sheet, then add the class pointer to the input field.

.psc-pointer *{
  cursor: pointer !important;
}
2 Likes