Questions tagged [lightning-design-system]

Questions related to Lightning CSS Framework called Salesforce Lightning Design System or SLDS for short. Specifically questions on how to use, getting certain features to work, and questions related to any of the suggested code or use cases on the Lightning Design System Website: https://www.lightningdesignsystem.com/ Lightning Experience UI, Lightning Components, Visualforce, and Lightning App Builder are all different but related tags.

Filter by
Sorted by
Tagged with
2
votes
1answer
25 views

Getting input field type from lightning:input tag

I want to get input field type information in my lightning javascript controller. How is that possible? For ex: <lightning:input type="number" value="{!v.value1}"/> <lightning:input ...
0
votes
1answer
27 views

Error in Lightning Web component :afterRender threw an error in 'c:lightning' [Cannot read property 'data' of undefined]

Below is my code for Lightning Web Component: HTML File: <template> <template if:true = {files.data}> <template for:each={files.data} for:item='file'> <...
2
votes
1answer
47 views

Spinner with a delay to disappear!

I created a component where I use lightning Spinner a lot, especially when I have to search for information in the Salesforce database or after some dynamic procedure on the screen, like a calculation ...
0
votes
1answer
25 views

Error when trying to set values for <force:inputField

I'm trying to set the default value of lookup for I'm getting the error when I try to set value: var value = [{ type: 'Account', id: "0014343234543", label: "Related To" }]; component.find("...
0
votes
0answers
15 views

I want to view vf page in lightning style

I have created a vf page and used the lightning style sheet (lightningstylesheet="true"), I have also made the vf page public , but I am facing an issue as I am not able to view my page in lightning ...
0
votes
1answer
22 views

Nested Checkbox in Lightning Component

I need to build nested checkbox in lightning component, like the below image. I tried to achieve this using ul and li tag but its not appearing like the image: <lightning:layoutItem size="2"> ...
2
votes
0answers
39 views

Animate custom refresh lightning-button-icon LWC

I want animate a lightning-button-icon as the standard Salesforce refresh button in LWC. I've already seen a related question but the answer was not conclusive, at this point I don't know if it's ...
0
votes
0answers
28 views

Responsive Lightning design component

I have an lightning component and I am Using it in two different record detail page ,One on main page and other in small side bar. My component is compatible with the main bar,But when I placed my ...
0
votes
0answers
19 views

LDS Multiselect picklist

I am trying to use the following code from the Lightning Design System documentation. I am getting SVG errors. Can someone tell me how to resolve this? Can I use something other than the svg code?
3
votes
1answer
115 views

Dynamically changing lightning button icon name with setAttribute not working

I'm trying to change the icon of a lightning button icon but the image isn't changing however I see that the attribute is being updated. this.template.querySelector('#'+event.target.id).setAttribute(...
4
votes
3answers
135 views

lightning:card Icon size

Is there a way to set icon size? Like in this example: <lightning:card iconName="action:flow" title="My beautiful title"> Is there an equivalent of class="slds-icon_xx-small" I have tried ...
0
votes
0answers
16 views

Custom Lightning Home Page Template not displaying Dashboard content

I've created a custom lightning home page template. It mostly works in the sense that it has the desired layout and displays most components that are configured on it. However, when I drop a ...
1
vote
1answer
23 views

Unable to display action lightning design icon in visualforce page

I'm trying to use one of the action icons from the lightning design system on my visualforce page. But I'm getting the icon color in black & white. I have tried to fill color from the CSS too but ...
-1
votes
1answer
59 views

I am getting Error at the time of saving the record using page reference to navigate to standard application, Please help

Controller - appNavigation : function(component, event, helper) { var action= component.get('c.getAllApps'); console.log(action); action.setCallback(this,function(response){ ...
0
votes
2answers
45 views

Is it possible to show action button in lightning outside of dropdown icon?

Currently buttons are visible within this drop down icon Is it possible to show these buttons directly like this ?
0
votes
1answer
36 views

Fix the Lightning component on app page

I need to fix the position of 1st component on top & 2nd component at the bottom of page.Both shouldn't be scrollable (As i want them as buttons). If any other component is in between that should ...
0
votes
1answer
22 views

Checkbox misaligned in mobile view

I have a table which I am showing stacked in the mobile view. I have a checkbox input to show an indicator, it looks alright in desktop view, however gets misaligned in the mobile view. I have tried ...
1
vote
1answer
54 views

Table as horizantal scroll and body as vertical scroll but header should be freeze

We have a requirement i.e Table scroll should be horizontal and vertical but when we scroll vertical, title should be Freeze . I have achieved almost requirement but when i scroll vertically Table ...
2
votes
1answer
317 views

LWC lightning-card border not shown with slds-card_boundary

Playground example https://developer.salesforce.com/docs/component-library/tools/playground/KLHs3GU9 I have a Lightning Web Component template with a lightning-card in an App Page. <template>...
3
votes
3answers
98 views

Not able to add dynamic style based on device

I am trying to add dynamic style one of lightning layout, the code goes till the device identification yet it doesn't apply the proper style. Here is my code:- <lightning:layout aura:id="...
1
vote
1answer
63 views

How to escape lightning CSS scoping

I have a component called basic, with the following in it's css file (basic.css) td { background: red; } The rendered CSS comes out like td[c-basic_basic]{background: red;} Is there a way to ...
0
votes
0answers
33 views

SLDS in Internet Explorer 11 / slds-grid is not working

How to fix it? <html style="height:100%"> <head> <link rel="stylesheet" type="text/css" href="slds/styles/salesforce-lightning-design-system.css"> <title>CIS IDS</...
0
votes
2answers
107 views

I want to Navigate my list of account to account detail page [closed]

Apex Class - public class searchAccountController { @AuraEnabled public static List < account > fetchAccount(String searchKeyWord) { String searchKey = searchKeyWord + '%'; List < ...
0
votes
0answers
16 views

Show List of Account Records and sort them according to selected button value (Multiple button can be clicked or selected)

I want to Show Records on the button Click Below Code is Working fine but i want to add Multiple button click check without Deselecting previous Button. In the above Picture if i select Hot it will ...
0
votes
1answer
43 views

Lightning LayoutItem flexibility not working properly

I am using lightning setup assistant in my UI, and I am trying to make it mobile responsive. The button in question here is Add Email Address I am trying to set size attributes accordingly, however ...
0
votes
0answers
30 views

How to add the hover to the Kanban view when you move the mouse over one record?

We can config the hover in detail page in the compact layout/ mini layout. However, for the kanban view, I think we will need to build the all Kanban in Lightning Component. Please correct me if you ...
0
votes
1answer
60 views

lightning-input-field displays differently in production and sandbox

I have the exact same code in production and sandbox. Things look as expected in sandbox, but in production I can see different css being applied. In Production the lightning input field is being ...
0
votes
1answer
48 views

Formula Text value not appearing in Lightning component

I'd like to show the value of the formula text field. The formula text field is {!v.opptyOwnerName.Account_Name__c} but on the lightning page the value doesn't appear. FYI the Accounts {!v....
0
votes
0answers
21 views

How to Populate the pick list field value in lightning component

I have a custom lightning component that creates a new Task record. I use Ui:inputtext for status and priority field in Task .My requirement is i need to auto populate the default values for these two ...
1
vote
2answers
66 views

Increase Spacing Between Lightning-Icon and title

Trying to get the spacing between this icon and text. Any advice? <h3 slot ="title" class="slds-card__header-title slds-media__body"> <lightning-icon icon-name="standard:...
0
votes
0answers
22 views

SLDS via Node.js

I am trying to work with the Lightning Design System in a Node.js program and I have a question about the design tokens. What is the best way of either dynamically changing the design token values, OR,...
0
votes
0answers
22 views

Mobile UI issue in lightning buttonMenu Aura Component

I just notice that Lightning:buttonMenu aura component size bigger in the mobile after winter 20 Salesforce release. Is it any way to control the size as previous because it's breaking our UI. Its ...
0
votes
1answer
32 views

Is it possible to link slds to an embedded chat deployment?

I am building a chat deployment to be embedded on an external site. I created a custom prechat form using aura/lightning components that rely on styling from slds. When embedded in the external site, ...
0
votes
0answers
17 views

Render DesignAttribute configuration by visualforce page (LightningOut)

Hi I have a lightning component with design attributes. I want to render this component in salesforce classic view. So I have created a visualforce page and embedded the lightning component using ...
0
votes
0answers
17 views

Same file is getting attached “ total number of file times” through when i try to attach multiple file in SFDC lightning “KIndly assist”

Controller: handleSave: function(component, event, helper) { if (component.find("fuploader").get("v.files").length > 0) { helper.uploadHelper(component, event); } else {...
1
vote
1answer
263 views

LWC lightning-spinner not able to display the text

I am able to add a lightning-spinner in an LWC component, but I'm not able to display the text along with the spinner. I need some help regarding the same. I tried both alternate-text in HTML & ...
0
votes
1answer
47 views

LWC: How to potentially return several different object lists based on user input

I am trying to allow a user to select an object from a dropdown, and based on the chosen object, return a random number of records. The problem I'm having is that I am having trouble returning ...
0
votes
2answers
327 views

LWC: How to iterate over a list of SObjects

I'm trying to create a lightning web component that will iterate through existing objects, however, I'm not sure how to get it to render. Here is the Controller public with sharing class ...
0
votes
1answer
47 views

Need to wrap url inside lightning card

I am using lightning:formattedUrl to show the url. I don't want give label to this url, so the url should show iin raw format. However I am using it in card, and it is going beyond the card boundary....
0
votes
1answer
189 views

recordId is empty when overriding edit button in lwc?

I needed a custom popup for creating and editing a record. To achieve this I have created a LWC which will create and edit the record. I had wrapped this component with an aura component. and ...
2
votes
0answers
109 views

Unable to upload the LDS 2.10.0 as static resource

As we know that static resource has a limit of 5MB, I am trying to upload the LDS winter 20 as static resource, but its size is more than 5 MB https://lightningdesignsystem.com/downloads/ In this ...
0
votes
1answer
91 views

How to display the 3 records in a row using lightning layout with next & previous arrow buttons, clicking on it should display next set of 3 records

I am creating home page lightning component where i am displaying the records in the . I am trying to display the 3 records( each record in separate tile) using lightning:layout in a row. I should ...
-2
votes
1answer
51 views

actions popover is hidden in lightning:datatable

i am using plain lightning:datatable with actions column. but after click on action icon popover shows hidden in below row like image, same issue but no solutions cmp <aura:handler name="init" ...
0
votes
1answer
31 views

Not able to view line breaks i.e. \n

I have lightning component, which shows a dynamic message -4 Here is the component code-- <!-- Success Message Start --> <div class="slds-...
1
vote
1answer
56 views

HTML Email Templates delivered Incompletely in Lightning List Email

I have few html email templates which are used to send mass emails to Contact and Campaigns. They are working fine in Salesforce classic whereas in Lightning, they are delivered incompletely. We need ...
4
votes
3answers
361 views

Difference in using Lightning Component <lightning:badge/> and Normal DOM with slds <span class=“slds-badge”></span>? Which is Better and Why?

Example: <lightning:badge label="Lightning Component"/> <span class="slds-badge">DOM Tag</span> Which is better? Which is faster? And why should I use Lightning component if I am ...
2
votes
1answer
40 views

Why I See Different Views with same Lightning Component

I'm designing opportunity Edit page with a lightning component using lightning:recordEditForm and Lightning:inputField <lightning:recordEditForm recordId="{!v.recordId}" ...
0
votes
1answer
27 views

Lighning Experience Cache issue with Static Resource

I have the next Code: <aura:component implements="flexipage:availableForAllPageTypes" access="global" > <aura:attribute name="logo" type="String"/> <aura:...
3
votes
2answers
899 views

How do you Expand All/Collapse All in lightning:accordion

I'm trying to Expand All/Hide All in lightning:accordion Lightning aura component. <aura:iteration items="{!v.pboW.listPb}" var="pbW"> <lightning:accordionSection name="{...
0
votes
1answer
32 views

Use Dynamic List when designing custom component

I'm working on a new component in lightning experience. For this new component I need to do something like the Standard component Tabs As you see, this component can setup dinamically the quantity ...