[BUGFIX] Make forms module context and small screen aware
The forms module has been made context-aware, improving its usability on small screen devices. The interface has been polished and the button positioning has been streamlined for better accessibility in all conditions. The inspector and structure browser now collapses when there isn't enough space and can be toggled into view when needed. Element identifiers are now visible in the inspector, making it easier for integrators and users to reference elements. The structure browser has been visually aligned with existing trees in the backend, though it doesn't yet use the tree component due to the need for further refactoring of the data handling within the forms module. Steps can now be created directly within the main editor, allowing the structure browser to take more space while keeping the button consistently available during form editing. The Settings button has been attached directly to the form title to prevent layout shifts and ensure accessibility in all view modes. Finally, step names now have a fallback mechanism, allowing them to be selected even when no name is set through the editor. Resolves: #105216 Releases: main Change-Id: I834efafe84a87f86df0fc451f9769ce6a464d82d Reviewed-on: https://review.typo3.org/c/Packages/TYPO3.CMS/+/86404 Tested-by:Benjamin Franzke <ben@bnf.dev> Reviewed-by:
Benjamin Franzke <ben@bnf.dev> Tested-by:
Andreas Kienast <akienast@scripting-base.de> Tested-by:
core-ci <typo3@b13.com> Reviewed-by:
Andreas Kienast <akienast@scripting-base.de>
Showing
- Build/Sources/Sass/component/_modal.scss 2 additions, 0 deletionsBuild/Sources/Sass/component/_modal.scss
- Build/Sources/Sass/component/_panel.scss 26 additions, 10 deletionsBuild/Sources/Sass/component/_panel.scss
- Build/Sources/Sass/component/forms/_form-label.scss 1 addition, 0 deletionsBuild/Sources/Sass/component/forms/_form-label.scss
- Build/Sources/Sass/form.scss 657 additions, 836 deletionsBuild/Sources/Sass/form.scss
- Build/Sources/TypeScript/form/backend/form-editor/helper.ts 3 additions, 4 deletionsBuild/Sources/TypeScript/form/backend/form-editor/helper.ts
- Build/Sources/TypeScript/form/backend/form-editor/inspector-component.ts 77 additions, 61 deletions...ypeScript/form/backend/form-editor/inspector-component.ts
- Build/Sources/TypeScript/form/backend/form-editor/mediator.ts 1 addition, 0 deletions...d/Sources/TypeScript/form/backend/form-editor/mediator.ts
- Build/Sources/TypeScript/form/backend/form-editor/stage-component.ts 11 additions, 7 deletions...es/TypeScript/form/backend/form-editor/stage-component.ts
- Build/Sources/TypeScript/form/backend/form-editor/tree-component.ts 41 additions, 53 deletions...ces/TypeScript/form/backend/form-editor/tree-component.ts
- Build/Sources/TypeScript/form/backend/form-editor/view-model.ts 50 additions, 138 deletions...Sources/TypeScript/form/backend/form-editor/view-model.ts
- typo3/sysext/backend/Resources/Public/Css/backend.css 6 additions, 3 deletionstypo3/sysext/backend/Resources/Public/Css/backend.css
- typo3/sysext/form/Classes/Controller/FormEditorController.php 4 additions, 21 deletions...3/sysext/form/Classes/Controller/FormEditorController.php
- typo3/sysext/form/Resources/Private/Backend/Partials/FormEditor/Inspector/CheckboxEditor.html 4 additions, 4 deletions...Backend/Partials/FormEditor/Inspector/CheckboxEditor.html
- typo3/sysext/form/Resources/Private/Backend/Partials/FormEditor/Inspector/CollectionElementHeaderEditor.html 6 additions, 5 deletions...s/FormEditor/Inspector/CollectionElementHeaderEditor.html
- typo3/sysext/form/Resources/Private/Backend/Partials/FormEditor/Inspector/CountrySelectEditor.html 8 additions, 8 deletions...nd/Partials/FormEditor/Inspector/CountrySelectEditor.html
- typo3/sysext/form/Resources/Private/Backend/Partials/FormEditor/Inspector/FinishersEditor.html 9 additions, 12 deletions...ackend/Partials/FormEditor/Inspector/FinishersEditor.html
- typo3/sysext/form/Resources/Private/Backend/Partials/FormEditor/Inspector/FormElementHeaderEditor.html 2 additions, 2 deletions...artials/FormEditor/Inspector/FormElementHeaderEditor.html
- typo3/sysext/form/Resources/Private/Backend/Partials/FormEditor/Inspector/GridColumnViewPortConfigurationEditor.html 16 additions, 16 deletions...itor/Inspector/GridColumnViewPortConfigurationEditor.html
- typo3/sysext/form/Resources/Private/Backend/Partials/FormEditor/Inspector/MaximumFileSizeEditor.html 2 additions, 4 deletions.../Partials/FormEditor/Inspector/MaximumFileSizeEditor.html
- typo3/sysext/form/Resources/Private/Backend/Partials/FormEditor/Inspector/MultiSelectEditor.html 8 additions, 8 deletions...kend/Partials/FormEditor/Inspector/MultiSelectEditor.html
Please register or sign in to comment