# Dashboard D2 - Default cursor issue
**URL:** https://discourse.nodered.org/t/dashboard-d2-default-cursor-issue/93598
**Category:** Dashboard
**Tags:** dashboard-2
**Created:** [1 December 2024 06:51 UTC](https://discourse.nodered.org/t/dashboard-d2-default-cursor-issue/93598 "2024-12-01T06:51:09Z")
**Posts on this page:** 5
**Page:** 1
### Author:  [@BartButenaers](https://discourse.nodered.org/u/BartButenaers)
#### Post date: [1 December 2024 06:51 UTC](https://discourse.nodered.org/t/dashboard-d2-default-cursor-issue/93598/1 "2024-12-01T06:51:09Z")
Hi folks,
I tried to create a pull request, to help Joe resolving one of the many dashboard D2 issues:
>
>
> \## Description
>
> This is a follow-up of one of my \[other\](https://github.com/Fl…owFuse/node-red-dashboard/pull/1290) PRs, by adding the option \*"None"\*:
>
> !\[image\](https://github.com/user-attachments/assets/abbcdfd1-7775-4449-98e3-ad753cdf2b2e)
>
> In that case neither the label nor the switch itself would be clickable. Not relevant for most users, but cannot harm either to add for those that need it...
>
> HOWEVER I have an open \*\*\*issue\*\*\* because you still get a hand-shaped cursor when hoovering above the switch. I apply the \*\*\*default cursor\*\*\* to both the label and the switch in my \[UISwitch.vue\](https://github.com/bartbutenaers/node-red-dashboard/blob/ui-switch-clickable-none/ui/src/widgets/ui-switch/UISwitch.vue#L21) file:
>
> !\[image\](https://github.com/user-attachments/assets/7d8f909a-e6a1-4cc5-b23f-82d0a198f874)
>
> The default cursor on my Windows portable is arrow-shaped. That works fine for the label and the empty area (between the label and the switch). But for the switch it keeps resulting in a hand-shaped cursor, indicating that you can click it (which is not the case for option "None"):
>
> !\[default\_cursor\](https://github.com/user-attachments/assets/5bc72461-4ded-44c8-8083-f7c9a643957b)
>
> Don't get it fixed unfortunately. Me and CSS are unfortunately not best mates...
> So I will mark it as \*\*DRAFT\*\*, allthough I won't be working on it anymore!
>
> \## Related Issue(s)
>
> \[1508\](https://github.com/FlowFuse/node-red-dashboard/issues/1508)
>
> \## Checklist
>
>
>
> - \[X\] I have read the \[contribution guidelines\](https://github.com/FlowFuse/flowfuse/blob/main/CONTRIBUTING.md)
> - \[\] Suitable unit/system level tests have been added and they pass
> - \[X\] Documentation has been updated
> - \[\] Upgrade instructions
> - \[X\] Configuration details
> - \[\] Concepts
> - \[\] Changes \`flowforge.yml\`?
> - \[\] Issue/PR raised on \`FlowFuse/helm\` to update ConfigMap Template
> - \[\] Issue/PR raised on \`FlowFuse/CloudProject\` to update values for Staging/Production
>
> \## Labels
>
> - \[\] Includes a DB migration? -\> add the \`area:migration\` label
Unfortunately I am stuck with a CSS issue, which are among the worst ones for me: the _default_ cursor for a `v-switch` keeps giving me a _ **hand-shaped** _ cursor, while the other elements result in a _ **arrow-shaped** _ cursor. I tried to find a way to get that default arrow-shaped cursor also on the switch. But I failed ☹
I would really appreciate if anybody could assist me with this (see detailed info in the pull request). Because if Joe needs to figure it out for me, then I have not helped him but instead given him even some more extra work...
Thanks and enjoy your sunday!!!
Bart
---
### Author:  [@hotNipi](https://discourse.nodered.org/u/hotNipi)
#### Post date: [1 December 2024 08:50 UTC](https://discourse.nodered.org/t/dashboard-d2-default-cursor-issue/93598/2 "2024-12-01T08:50:12Z")
Add one more class for it conditionally (name it as you like)
And a bit of CSS
```auto
.class-when-the-cursor-should-be-arrow .v-selection-control__input input{
cursor:default;
}
```
---
### Author:  [@BartButenaers](https://discourse.nodered.org/u/BartButenaers)
#### Post date: [1 December 2024 10:37 UTC](https://discourse.nodered.org/t/dashboard-d2-default-cursor-issue/93598/3 "2024-12-01T10:37:49Z")
Hey @hotNipi,
Really appreciated!!
Will try to test your proposal tonight. Out of curiosity: why would it work to apply a cursor like that, while it doesn't work when I apply the same via an inline style (as mentioned in the screenshot of the pull request)?
---
### Author:  [@hotNipi](https://discourse.nodered.org/u/hotNipi)
#### Post date: [1 December 2024 11:07 UTC](https://discourse.nodered.org/t/dashboard-d2-default-cursor-issue/93598/4 "2024-12-01T11:07:51Z")
Because the `input` element which is the target of the css selector is created by `v-switch` component. The inline styles land on outer DOM element which they then canot drive any rules for inner elements.
---
### Author:  [@system](https://discourse.nodered.org/u/system)
#### Post date: [15 December 2024 11:08 UTC](https://discourse.nodered.org/t/dashboard-d2-default-cursor-issue/93598/5 "2024-12-15T11:08:28Z")
This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.