[Form] Add support for Bootstrap 4 forms #16289
Comments
|
I think this is incomplete. I tried this, but it looks like form errors are no longer printed in red for example. It can be achieved using |
|
Just noticed this and in my opinion for this to be complete it should also include a layout where the custom Bootstrap 4 elements are used. |
|
But Bootstrap4 is still in alpha stage, is there a point introducing a template that may simply stop working after another alpha release? |
|
There will be a beta release very soon, see https://github.com/twbs/bootstrap/projects/3. |
|
Well that still may change to various reasons, it would not be uncommon for release date to be postponed. Anyhow, I think it would be better to wait until it starts approaching a stable release, since we have no idea how much it could change. |
|
Bump - cough - Currently v4.0.0-beta http://getbootstrap.com/ |
|
@PhilETaylor See PR #21751. It has been open for quite some time now. Any reactions/improvements are welcome. I hope the PR can be merged soon so any Symfony + Bootstrap 4 projects start experimenting with the beta including some nice automatically styled forms :). |
|
We're currently developing a narrowcasting solution with Symfony 3.3.6 and Boostrap 4 beta, and yes, the form styles are currently completely messed up due to all the changes. I'm eagerly looking forward to stable support. Supporting a beta however normally isn't something I would do, but Bootstrap has proven time and time again to be one of the most stable of frontend framework solutions, mainly taking CSS. |
|
@ReSpawN Thank you for the interest. The PR should be very functional for the BS 4 beta. I am using it in small personal projects myself, but I have not seen it implemented in large scale projects. The only thing that I was able to determine which does not work is a form widget with invalid state and invalid text for (sets of) radio buttons and checkboxes. I've raised this issuse with the Bootstrap team (twbs/bootstrap#23426). |
…ereguiluz) This PR was merged into the 3.4 branch. Discussion ---------- Bootstrap4 support for Twig form theme **This PR is a followup from #19648. That PR was closed because GitHub thought my branch contained no commits after a force push...** | Q | A | | --- | --- | | Branch? | master | | Bug fix? | no | | New feature? | yes | | BC breaks? | no | | Deprecations? | no | | Tests pass? | yes | | Fixed tickets | #16289 | | License | MIT | | Doc PR | - | I have made a port of the Twig form theming code for Bootstrap 3 to the α-5 version of Bootstrap 4. - The (inheritance) structure of the form theming files has changed because a number of blocks are the same between BS 3 and 4. They have been migrated to `bootstrap_base_layout.html.twig`. The new tree is as follows: ``` bootstrap_base_layout.html.twig |-- bootstrap_3_layout.html.twig | `-- bootstrap_3_horizontal_layout.html.twig `-- bootstrap_4_layout.html.twig `-- bootstrap_4_horizontal_layout.html.twig ``` - Any occurances of `.form-horizontal` have been removed from the BS 4 code. - Checkboxes and radio buttons have been stacked using the `.form-check`, `.form-check-label` and `.form-check-input` classes. There is now no distinction between checkboxes and radio buttons in the markdown. - All layout tests have been added and updated for BS4. The inheritance tree is as follows: ``` AbstractLayoutTest `-- AbstractBootstrap3LayoutTest |-- AbstractBootstrap3HorizontalLayoutTest `-- AbstractBootstrap4LayoutTest `-- AbstractBootstrap4HorizontalLayoutTest ``` All tests pass. The classes `FormExtensionBootstrap4LayoutTest` and `FormExtensionBootstrap4HorizontalLayoutTest` have been created similarly to the BS 3 versions. - ~~The label coloring on an validation is not correct. I've made an issue (twbs/bootstrap#20535) of the problem.~~ - No [custom form elements](http://v4-alpha.getbootstrap.com/components/forms/#custom-forms) have been used. - A docs PR can be created if this PR is accepted. - The new code might have to be updated if large changes occur in the BS 4 α. Screenshot of BS3 and 4 comparison for the same form:  Commits ------- f12e588 Removed unneeded wrapping quotes around a Twig key 709f134 Removed unneeded wrapping quotes around a Twig key 4222d54 Initial commit for Bootstrap 4 form theme, based on Bootstrap 3 form theme
Bootstrap 4 is still in alpha but we should prepare for when it's released (no specific date yet). Regarding the form component, changes from Bootstrap 3 are small, but nonetheless important.
Source: http://v4-alpha.getbootstrap.com/migration/#forms
The text was updated successfully, but these errors were encountered: