0

I have an input field that looks incredibly small. It's a checkbox, and I would like to increase the size of the box. disclaimer: 'Images in screenshot may be larger than they appear' :D enter image description here

Html

<lightning-card
    title="RecordEditFormDynamicContact"
    icon-name="standard:contact"
>
    <div class="slds-m-around_medium">
        <lightning-record-edit-form
            object-api-name={objectApiName}
            record-id={recordId}
            columns="2"
        >
            <lightning-messages></lightning-messages>
        <div class="slds-grid">
            <div class="slds-col slds-size_1-of-2">
                <lightning-input-field
                    field-name="Phone_2__c"
                ></lightning-input-field>
            </div>
            <div class="slds-col slds-size_1-of-2">
            <lightning-input type="checkbox"  label="Phone 2 TCPA" name="Phone2TCPA" checked required
                    field-name="Phone_2_TCPA__c"
                ></lightning-input>
            </div>
        </div>
            <div class="slds-m-top_medium">
                <lightning-button
                    variant="brand"
                    type="submit"
                    name="save"
                    label="Save"
                ></lightning-button>
            </div>
        </lightning-record-edit-form>
    </div>
    </lightning-card>

2 Answers 2

1

You'll probably get a better layout with a stacked layout:

<lightning-input type="checkbox"  label="Phone 2 TCPA" name="Phone2TCPA" checked required
        variant="label-stacked" field-name="Phone_2_TCPA__c"
    ></lightning-input>
0

You can just use standard input with class slds-input instead of lightning-input:

Playground example:

<input class="slds-input my-cb" type="checkbox" label="Phone 2 TCPA" name="Phone2TCPA" checked required ></input>

CSS:

.my-cb {
    width:40px;
}

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .