-
-
Notifications
You must be signed in to change notification settings - Fork 1k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
feature #5956 Added a feature to include columns inside forms (javier…
…eguiluz) This PR was squashed before being merged into the 4.x branch. Discussion ---------- Added a feature to include columns inside forms This PR is BIG and includes some very important and nice changes: * You can now divide a form into columns with `FormField::addColumn()`. Combine this with form tabs and fieldsets to create super complex forms very easily. * The `detail` page FINALLY shows the SAME design as new/edit pages. Form tabs, columns, fieldsets, etc. Everything looks exactly how you expect. Finally!! If you want to review this, the most important things are: * The new `FormLayoutFactory` is the key. It transforms the form config (which is optimized for developers using EasyAdmin) into a linear list of layout + field items (which is optimized for rendering it in Twig templates and Symfony Form themes templates). * Check out the `FormLayoutFactoryTest` to see many practical examples of the work that this new class does to flatten and linearize the layout configuration. In the coming days I'm going to provide: * More and better docs about form layouts * Some design tweaks * Fixes in the code for the bugs reported by the community Thanks! Commits ------- d289100 Added a feature to include columns inside forms
- Loading branch information
Showing
49 changed files
with
2,094 additions
and
434 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,48 @@ | ||
| // Detail Page styles | ||
| // ---------------------------------------------------------------------------- | ||
| .ea-detail .form-column .form-fieldset-body { | ||
| padding-bottom: 5px; | ||
| padding-top: 5px; | ||
|
|
||
| &.without-header { | ||
| padding-bottom: var(--bs-gutter-x); | ||
| padding-top: var(--bs-gutter-x); | ||
| } | ||
| } | ||
|
|
||
| .ea-detail .field-group { | ||
| margin-bottom: 12px; | ||
| } | ||
|
|
||
| .ea-detail .field-group .field-label { | ||
| color: var(--form-label-color); | ||
| font-size: var(--font-size-base); | ||
| font-weight: 500; | ||
| margin: 0; | ||
| padding: 0 0 1px 0; | ||
|
|
||
| .data-help { | ||
| color: var(--gray-600); | ||
| font-size: var(--font-size-sm); | ||
| margin: 15px 0 0; | ||
|
|
||
| i { | ||
| color: var(--datalist-label-color); | ||
| } | ||
| } | ||
| } | ||
|
|
||
| .ea-detail .field-group .field-code_editor { | ||
| color: inherit; | ||
| font-family: var(--font-family-monospace); | ||
| font-size: var(--font-size-sm); | ||
| line-height: 1.6; | ||
| white-space: pre-wrap; | ||
| } | ||
|
|
||
| .ea-detail .field-group.field-textarea .field-value, | ||
| .ea-detail .field-group.field-text_editor .field-value { | ||
| max-height: 350px; | ||
| max-width: 80ch; | ||
| overflow-y: auto; | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.