function readOnly(count){ }
Sign Up ›
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
Learn More

Browse by Topic
ShowAll Questionssorted byDate Posted
+ Start a Discussion
Rasmus SikkRasmus Sikk 

Overriding "new" action with lightning component styling/DOM issues.

I have written lightning component to override 'new' action when creating a record. My problem is, that salesforce auto-generates a div element which has a padding that I don't like. How can I change that, or is there any "form-container" that ignores this outer div. I will provide code and pictures for better understanding.

Image of devTools in chrome - this is the div salesforce is auto-generating that has a padding around it.
User-added image

My component code: 
<aura:component description="testComponent" implements="lightning:actionOverride" access="global" >
 <p>Test style</p>
 </aura:component>
Image of the component in action
User-added image
As you can see, there is padding around my lightning component. This is a problem because my other forms' which are generated by Salesforce(standard) are looking different.

This is the standard form, generated by Salesforce, as you can see, the div is in the middle of my form.
User-added image

I think I have to use a specific container or outer element around my customs form so that salesforce knows where to put my lightning component?  Have not found any solutions yet. Modifying the DOM elements generated by Salesforce is a very bad idea so I don't want to do to that.

Thanks in advance
Jagannathan MJagannathan M
Hello,
You must publish the component to "flexipage:availableForRecordHome" and "force:hasRecordId" aong with "actionOverride" when overriding a standard action using Lightning Component, then you have to add the code for the fields that you will showing when New button is clicked. Please refer the below trailhead with good example,
https://trailhead.salesforce.com/en/projects/workshop-override-standard-action/steps/override_4

Thanks.
Rasmus SikkRasmus Sikk
@Jagannathan M Thank you for your reply.
I can successfully load my custom form, i have these implementations added. The problem is that salesforce puts my custom form inside a div that has padding around it. I am trying to avoid that.


 
Dave AppletonDave Appleton
Hi.

Did you ever find a solution for this?  I have exactly the same problem.

Thanks.
Rasmus SikkRasmus Sikk
@Dave Appleton I didn't. Just accepted the margin.
Dave AppletonDave Appleton
Thanks for letting me know @Rasmus Sikk.  Looks like I'll just have to learn to love the border.