<template>
    <c-util-expandable-section id={section.id}
                               label={section.label}
                               alternative-text={altTextLabel}
                               is-collapsed={collapsed}
                               body-class="slds-m-bottom_large">
        <lightning-layout multiple-rows='true'>
            <template for:each={section.elements}
                      for:item='element'>
                <!-- TODO: It would be great to make the layout sizing more dynamic,
                    but the lightning-layout-item needs to be in the same component as the lightning-layout.
                    Maybe size numbers should be passed as part of the "element"? -->
                <template if:false={element.componentName}>
                    <lightning-layout-item key={element.id}
                                           size='6'
                                           medium-device-size='3'>
                        <article class='slds-p-horizontal_small slds-p-vertical_xx-small'>
                            <c-ge-form-field element={element}
                                             onchangelookup={handleChangeLookup}
                                             onchangepicklist={handleChangePicklist}>
                            </c-ge-form-field>
                        </article>
                    </lightning-layout-item>
                </template>
                <template if:true={element.componentName}>
                    <lightning-layout-item key={element.id}
                                           padding='around-small'
                                           size='12'
                                           medium-device-size='12'>
                        <c-ge-form-widget element={element} widget-data={widgetData}></c-ge-form-widget>
                    </lightning-layout-item>
                </template>
            </template>
        </lightning-layout>
    </c-util-expandable-section>
</template>

<template>
    <c-util-expandable-section id={section.id}
                               label={section.label}
                               alternative-text={altTextLabel}
                               is-collapsed={collapsed}
                               body-class="slds-m-bottom_large">
        <lightning-layout multiple-rows='true'>
            <template for:each={section.elements}
                      for:item='element'>
                <!-- TODO: It would be great to make the layout sizing more dynamic,
                    but the lightning-layout-item needs to be in the same component as the lightning-layout.
                    Maybe size numbers should be passed as part of the "element"? -->
                <template if:false={element.componentName}>
                    <lightning-layout-item key={element.id}
                                           size='6'
                                           medium-device-size='3'>
                        <article class='slds-p-horizontal_small slds-p-vertical_xx-small'>
                            <c-ge-form-field element={element}
                                             onchangelookup={handleChangeLookup}
                                             onchangepicklist={handleChangePicklist}>
                            </c-ge-form-field>
                        </article>
                    </lightning-layout-item>
                </template>
                <template if:true={element.componentName}>
                    <lightning-layout-item key={element.id}
                                           size='12'
                                           medium-device-size='12'>
                        <c-ge-form-widget element={element} widget-data={widgetData}></c-ge-form-widget>
                    </lightning-layout-item>
                </template>
            </template>
        </lightning-layout>
    </c-util-expandable-section>
</template>

Fix extra padding on allocations widget
Fix extra padding on allocations widget
