Set `cursor: pointer` for interactive elements

Created by: printercu

In #21812 @mdo provided links which says that pointer cursor should be used only for links.

Both Microsoft's design guidelines and Apple's HIG are related to desktop applications. While W3C spec is related to web, it does not follow it's recommendation: all provided sources use cursor pointer for buttons on their web pages, some of them for checkboxes (ex.: Apple, Microsoft, W3C).

There are some issues with having cursor: pointer for links but not for buttons.

It's usual to have controls in forms like this:

<button class='btn btn-primary' type='submit'>Save</button>
<a class='btn btn-secondary' href='/back'>Cancel</a>

This way both controls looks the same, but have different cursors. This looks inconsistent.

.navbar-toggler is good example when it's not clear if element is interactive or not: https://getbootstrap.com/docs/4.0/components/navbar/#external-content

Why desktop application design guides should not be used for web pages?

The main difference is that web-page contains mostly static content (not-interactive) but desktop app usually almost totally interactive (this should be considered in global scale, not for single web-site that can be fully interactive: users use browser to visit different web-sites). So it has become usual to use pointer cursor to help users distinguish interactive elements on webpages. Especially with custom-styled inputs.

Please consider to set back pointer cursor for interactive elements.