AdvancedCustomFields / AdvancedCustomFields/acf

Not enough space for editing sub fields inside nested repeaters in flexible content fields ACF 6.0.1

Open
#722 3 comments 1 reaction 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
PHP
Stars
945
Forks
197
PR merge metrics
No merged PRs in 30d

Description

Hello,
I have some nested repeaters inside flexible content fields and a lot of space is wasted for the editing of sub fields.
As you can see, with only two nested repeaters, the space in the last one is not enough to work comfortably in a 1920x1080 screen.
It would be better to use all the available space and set a max-with only on the single inputs instead of the whole block.

Please, consider removing or reviewing the rule

.acf-admin-single-field-group .acf-field-object-flexible-content .acf-is-subfields .acf-field-object .acf-label, 
.acf-admin-single-field-group .acf-field-object-flexible-content .acf-is-subfields .acf-field-object .acf-input {
  max-width: 600px;
}

inside /advanced-custom-fields-pro/assets/build/css/acf-field-group.css

Also, some margins are not needed for the Sub fields block.

This happens only when the repeaters are nested inside flexible content fields.
Their behavior inside "normal" fields is correct and the use all the available space.

Thank you!

Modifica-gruppo-di-campi-“Contenuti”-‹-Cordivari-—-WordPress

Contributor guide

No contributing guide indexed for this repository

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start in advanced-custom-fields-pro/assets/build/css/acf-field-group.css and inspect the listed max-width rule and related margins for nested subfields. Compare nested repeaters inside flexible content fields with their behavior in normal fields; done means the nested layout uses available editing space without regressing the normal-field layout.

Written by the indexing model from the issue text.

Assessment

Tech stack
css, php
Domain
frontend
Issue type
Bug
Difficulty
2/5
Estimated time
1-3 hours
Activity status
Stale
Clarity
Clearly specified
Newbie friendliness
45/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.