Give GroupFormElement a flat design

[zkline101]

(Feedback from @PeggyDu09)
After the Form changes, I tried to achieve this but wasn't able to. Right now it looks like each group form element is grouped together when they should be separate.

When it would look better with a flat design like this:

So the goal would be to take out the background color from each disclosure group. I tried a few different ways to achieve this and none of them worked.

[dfeinzimer]

@zkline101 I'm not sure I see the difference in the images above except for maybe the visibility of the Dividers and that the first uses two different font colors while the second uses only one.

My understanding is that the main issue with Form and GroupFormElement is that when the DisclosureGroup is expanded, there is no 2nd-level background color to connect each inner FieldFormElement visually. Is that a separate issue from this issue?

[zkline101]

@zkline101 I'm not sure I see the difference in the images above except for maybe the visibility of the Dividers and that the first uses two different font colors while the second uses only one.

Yeah I guess it is hard to tell from the pictures. But for the first picture there is a background behind the form and the header of each disclosure group has a separate background. The second picture only shows the background behind the form and the header for each disclosure group doesn't have background color. Does that help?

My understanding is that the main issue with Form and GroupFormElement is that when the DisclosureGroup is expanded, there is no 2nd-level background color to connect each inner FieldFormElement visually. Is that a separate issue from this issue?

That sounds like a separate issue to me. The issue was surrounding the background color behind each disclosure group header.