Add no-spinners utility to remove input spinners

[seccofs]

Adds a new utility class .no-spinners to remove spinners
from number inputs. Includes visual test in tests/visual/no-spinners.html
and documentation in docs/5.3/utilities/misc.md. Implemented via
a separate _no-spinners.scss file due to utilities API limitations
with pseudo-elements like ::-webkit-inner-spin-button.

Description

This pull request introduces a new utility class, .no-spinners, to the
Bootstrap framework. The purpose of this utility is to remove the spinner
arrows (increment/decrement controls) from
elements and similar input types across supported browsers, providing a
cleaner visual appearance while preserving the input's numeric functionality.

Motivation & Context

This change is required to address a common customization need in web
development: removing the spinner arrows (increment/decrement controls)
from elements and similar input types. Bootstrap
currently lacks a built-in utility to control this aspect of form inputs, leaving
developers to implement custom CSS outside the framework. By adding the
.no-spinners utility, Bootstrap provides a standardized, reusable solution that
aligns with its philosophy of offering flexible, ready-to-use utilities for
common styling tasks. This enhances the framework’s utility suite, reduces
the need for external overrides, and ensures consistency across projects that
rely on Bootstrap.
The .no-spinners utility solves several problems faced by developers:

• Inconsistent default behavior across browsers;
• Aesthetic and usability customization;
• Lack of native Bootstrap support; and,
• Community Demand

Type of changes

• Bug fix (non-breaking change which fixes an issue)
• New feature (non-breaking change which adds functionality)
• Refactoring (non-breaking change)
• Breaking change (fix or feature that would change existing functionality)

Checklist

• I have read the contributing guidelines
• My code follows the code style of the project (using npm run lint)
• My change introduces changes to the documentation
• I have updated the documentation accordingly
• I have added tests to cover my changes
• All new and existing tests passed

Live previews

Related issues

This pull request addresses a recurring need in the Bootstrap community for controlling the appearance of spinner arrows in <input type="number"> elements. Below are some related issues and discussions from the Bootstrap GitHub repository:

• Issue input[type="number"] not displaying properly in Chrome #8350: input[type="number"] not displaying properly in Chrome (Opened June 29, 2013)

  • Link: input[type="number"] not displaying properly in Chrome #8350
  • Description: Users reported inconsistencies with <input type="number"> rendering, including spinner visibility issues in Chrome. A suggested fix involved CSS targeting ::-webkit-outer-spin-button and ::-webkit-inner-spin-button, similar to this PR’s approach.

• Issue Spinner inside input #28600: Spinner inside input (Opened April 1, 2019)

  • Link: Spinner inside input #28600
  • Description: A feature request to embed loading spinners inside inputs. This reflects broader interest in input customization, including spinner control.

• General Community Feedback: Frequent discussions on Stack Overflow and forums highlight the need for spinner removal, often using custom CSS. This PR formalizes that solution within Bootstrap.

[julien-deramond]

Implemented via a separate _no-spinners.scss file due to utilities API limitations with pseudo-elements like ::-webkit-inner-spin-button.

Hello there, the _no-spinner.scss file your mentioned is missing, and the site/content/docs/5.3/utilities/no-spinners.md content is truncated.