Skip to content
GitLab
Projects Groups Snippets
  • /
  • Help
    • Help
    • Support
    • Community forum
    • Submit feedback
    • Contribute to GitLab
  • Sign in / Register
  • B bootstrap
  • Project information
    • Project information
    • Activity
    • Labels
    • Members
  • Repository
    • Repository
    • Files
    • Commits
    • Branches
    • Tags
    • Contributors
    • Graph
    • Compare
  • Issues 263
    • Issues 263
    • List
    • Boards
    • Service Desk
    • Milestones
  • Merge requests 114
    • Merge requests 114
  • CI/CD
    • CI/CD
    • Pipelines
    • Jobs
    • Schedules
  • Deployments
    • Deployments
    • Environments
    • Releases
  • Packages and registries
    • Packages and registries
    • Package Registry
    • Infrastructure Registry
  • Monitor
    • Monitor
    • Incidents
  • Analytics
    • Analytics
    • Value stream
    • CI/CD
    • Repository
  • Wiki
    • Wiki
  • Snippets
    • Snippets
  • Activity
  • Graph
  • Create a new issue
  • Jobs
  • Commits
  • Issue Boards
Collapse sidebar
  • Bootstrap
  • bootstrap
  • Merge requests
  • !31667

Overlay form controls, selects, and files with icons or spinners

  • Review changes

  • Download
  • Email patches
  • Plain diff
Open Mark Otto requested to merge form-controls-with-icons into main Sep 16, 2020
  • Overview 0
  • Commits 1
  • Pipelines 0
  • Changes 5

This is a draft of a new set of options for our .form-control, .form-select, and .form-file to add icons and spinners. I've included support for sizing, too. Had to rearrange some things though, including how we're calculating the input height variables (they weren't right, now they are), but otherwise this was relatively straightforward.

Questions, ideas, and todos:

  • Do we need to update this to support icons on the left and right? If so, do we use start and end over right and left in the names? This is mentioned here: https://github.com/twbs/bootstrap/pull/29107#issuecomment-575000676.
  • Do we split the Sass here, perhaps with a mixin, across each file?
  • Or maybe we put this as a separate page altogether?
  • Any other variations we need to support? Perhaps something on focus to change the icon color?
  • Do we implement this in v4 as well? Would be relatively straightforward I think, but would be a minor bump.
  • Anything else?

Replaces #29107. Fixed #28600.

Screen Shot 2020-09-15 at 10 22 49 PM Screen Shot 2020-09-15 at 10 22 55 PM
Assignee
Assign to
Reviewers
Request review from
Time tracking
Source branch: form-controls-with-icons