Feature Request: Floating Labels
Created by: imcodingideas
I want to add a feature request! I would like to see floating labels be incorporated into bootstrap 4. Please take a look at this dribble shot: https://dribbble.com/shots/1254439--GIF-Float-Label-Form-Interaction which shows this in action as well as some pros for it:
User keeps context The main advantage of this pattern is that the user keeps the field’s context after they’ve focused and entered a value. This provides for a more accessible, less frustrating experience.
Clean and scannable by default This pattern allows for a clean inline label experience by default, and only becomes a little more cluttered once the user has filled things out.
Elegant It needs to be said: this pattern is sexy. You usually can’t say that about forms. It looks good and the animations are a nice subtle touch.
Google uses floating labels in their material design: https://material.google.com/components/text-fields.html#text-fields-floating-labels and designers love them: https://dribbble.com/search?q=floating+label
Here is a live example http://mrlopez.me/bootstrap-floating-labels/ someone else did with bootstrap.