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
497 views

Screen freezes when aura:iteration is running

I am using aura:iteration to dynamically render components and as the components are many, it is taking a bit of time. During this, I want to show spinner till all components are rendered, but as soon ...
2
votes
1answer
2k views

SLDS pills without container not working

I have following component which renders pills after filtering showing attributes of filtering. I want to render them individually without container but its not working and I am getting all of them ...
2
votes
2answers
1k views

Not able to view lookup icon on visualforce page using Lightning Design

I am using lightning design classes for visualforce pages. Each and everything is working perfectly only the issue is that i can't see the search icon for lookup field. Code: PO Box Address
2
votes
2answers
1k views

Retrieve selected value from picklist inside an html table using Salesforce lightning

I am trying to get the selected value of picklist. This picklist is inside a HTML table and the picklists are dynamically created. <aura:iteration items="{!v.oppRecordTypeMappingList}" var="item"&...
2
votes
1answer
233 views

Why this pattern - Span tags with class enclosing img in Lightning Design System?

I was checking out the new Lightning Design System framework from Salesforce, and noticed there's a pattern of img tags inside of span tags. Reference link - https://www.lightningdesignsystem.com/...
2
votes
1answer
774 views

Cannot get slds-col to stretch if they are embedded in child slds-grid

I'm creating a custom theme layout. I am stuck on getting a basic layout created. Here's how I want the layout to appear: Row 1: Logo (align left), Profile (align right) Row 2: Menu Row 3: Body ...
2
votes
2answers
2k views

Aura:Method with Parameters / Conditional Component Instancing

I'm trying to make a component that can be used for many different scenarios. So I want to be able to use it in parent components. The idea is that the parent component would be used to create records ...
2
votes
2answers
2k views

Can you use two force:recordData in one lightning component?

I want to load the fields of an existing Record into a component, then display that component next to the existing detail of the record. Let the user change what they will then save that form as a new ...
2
votes
2answers
599 views

Avoid delay in aura handler init method

I have an aura handler defined in the component: <aura:attribute name="ErrorMessage" type="String" default=""/> <aura:handler name="init" action="{!c.doinit}" value="{!this}"/> ...
2
votes
3answers
4k views

How detect a scroll event in lightning component when there are multiple scroll bars

I have scenario where I implemented a datatable with in a lightning component with scrollable y axis. Now the challenge is there are two scroll bars. One for lightning component and another one for ...
2
votes
1answer
528 views

field set in visualforce page

I have created field set and using it in visualforce page, I have included all the fields from field set in viusalforce page using but there is an issue with the css, css is not working properly my ...
2
votes
1answer
346 views

Lightning Design System: Dates displaying as DateTime Output

I'm using the LDS for utilising the Lightning CSS on our VisualForce page but for some reason our Date field is being converted to a DateTime Output in my VF Page. Below is the VisualForce piece - ...
2
votes
1answer
277 views

Salesforce Lightning Multiple Instance of Checkbox Alternate doesn't work correctly

I am trying to use Checkbox Alternate Lightning code as a code of CheckboxAlternate component <aura:component > <fieldset class="slds-form-element"> <legend class="slds-form-...
2
votes
1answer
4k views

Display spinner in specific component only

I added lightning component to the page layout but when I fire spinner it displays for all components: Also I have two components with aura:id to use component.find() in doInit function. That is the ...
2
votes
2answers
6k views

Display a Component as Modal in lightning

I have two components Component A : Display's the list of Account, on click of account name it fires a event which passes Accountid to Component B. Component B - It listens the event and Displays the ...
2
votes
1answer
98 views

Lightning: newly added child objects in JS doesn't render on component

I have parent class Car: public class Car { @AuraEnabled public String model { get; set; } @AuraEnabled public List<Radio> radios { get; set; } public Car( String model, ...
2
votes
1answer
230 views

Nested if in lightning design

How to use nested if in style css Lightning Design System. this is working fine <div class="{!v.case.Priority == 'Closed' ? 'row closed' : 'row '}" > But when I write the ...
2
votes
2answers
2k views

Styling of Lightning UI-Component radioButton does not match SLDS Style

i have an issue regarding the styling of Lightning ui:inputRadio. Other components like ui:inputText or ui:inputSelect get rendered with the right styling. Do i need to add additional style classes ...
2
votes
1answer
2k views

apex:InputField Equivalent in Lightning framework

I am new to Lightning framework. I imported lightning design system files into the visualforce page. Now I wan to use apex:inputfield with lightning design. I don't want to use html tag because I ...
2
votes
1answer
70 views

Open LWC as a full page without salesforce header

I have a button on Lightning Record page. On click i am redirecting to a LWC. Is there anyway where i can redirect or open the LWC in a full screen page. As of now it is opening with salesforce main ...
2
votes
1answer
101 views

Set relative height for ui:scrollerWrapper

I'm trying to implement a ui:scrollerWrapper for a Lightning Component in a quick action in the Salesforce app. I'd like to have a scrollable section that occupies 60% of the screens height, so I ...
2
votes
0answers
49 views

Salesforce1 on focus on textarea header top is hiding

I have seen the same, or a similar, issue. The problem I encountered also occurs on a mobile device (Android in this case) with a textarea component at the bottom of a container component that extends ...
2
votes
0answers
1k views

Can Lightning SLDS icons be displayed in formula field without using static resources?

I want to display an icon in a formula field based on the value in another checkbox field on my object. I would like to use the standard Lightning SLDS icons here. I've found a way to achieve this ...
2
votes
0answers
113 views

Lightning component: List view base component display problems [closed]

I used List View base component in my lightning component, everything works fine besides display issues when inline editing User lookup when editing last record in a list. Below screens shows the ...
2
votes
1answer
427 views

Lightning Overlay Issues

Issue facing while using lightning overlay: 1) when I override the Quick Action with Lightning overlay Component there are two overlay showing one is quick action overlay and other is the standard ...
2
votes
1answer
368 views

Display path from right to left

I want to display a field status in a very visual way, the path component is ideal (any of them, for example lightning:path or even the slds one): Problem: Displaying that component from right to ...
2
votes
0answers
357 views

Lightning design Grid layout does not work in IE11

i have a problem in IE11 grid layout slds-size-** which is making a grid as bad way but in other browser is great all working fine .. <div class="slds-card__body"> <div class="slds-...
2
votes
1answer
1k views

How to set only Time for ui:inputDateTime tag at first time in Lightning?

I want to default time to 9:00 AM when user selects date first time. Still He is allowed to change the time. I am using below tag for DateTime input field: <ui:inputDateTime aura:id="startDate" ...
2
votes
1answer
814 views

How to find invalid lightning code before it causes an error? [duplicate]

Why this is not a duplicate: This question is different than How do I debug my lightning component? My issue was caused by a missing attribute on a Lightning component. It would be nice to see some ...
2
votes
0answers
274 views

ui:inputCheckbox disabled property not working in Microsoft edge

I am dynamically rendering disabled property of checkbox to true or false from controller. This works fine for other browsers but does not for Microsoft Edge. The checkbox remains disabled, i.e it is ...
2
votes
1answer
739 views

lightning:tab - wrap label text

did anyone was able to work with lightning:tab and find way to wrap text in label of tab? <lightning:tabset selectedTabId="{!v.selTabId}" > <lightning:tab aura:id="tab1" id="...
2
votes
0answers
604 views

Understanding Lightning interactions - How does Lightning component and controller (.js) calls apex class controller and interact with it? [closed]

I have just started learning Lightning through trail head and have completed a basic Lightning component creation task but I am failing to understand as to how are the things working here. As I have ...
2
votes
1answer
1k views

Visualforce lookup field with apex:inputField in LEX?

Simple story: As a sales user, I want to mass assign leads to a teammate, so I can better distribute our total workload. The constraint is that I need to do this in Lightning Experience, in which the ...
2
votes
0answers
96 views

Unwanted padding bottom in app.css inside Lightning Experience overriding SLDS styling

And now, there's yet another new issue even in Lightning Experience[Desktop]. Here's the screenshot of the same:- The above screenshot shows an unwanted padding-bottom of 2.5rem in a class named ...
2
votes
0answers
214 views

Applying CSS to force:recordView in lightning:component

I'm trying to use force:recordView and it works okay in Lightning Experience, and S1 but but when rendered in a stand alone app, the SLDS CSS are not applied - that is if I preview the ...
2
votes
0answers
857 views

Lightning is showing unnecessary blue border around slds-grid elements

A blue border is shown around slds-grid elements which disappears when inspector is opened. I have tried applying 'border:0px;', 'border-collapse:collapse' in CSS. But it didn't work. <div class="...
2
votes
1answer
329 views

Unwanted padding added from app.css in Salesforce1 app | How to remove/override style added from app.css?

A padding of 0.75rem has been added to an outer div as shown in the image below in the latest Salesforce1 app. It's affecting the custom styling of the application. Is it a good idea to override ...
2
votes
3answers
2k views

Binding a click event to document Lightning Component

I am using SLDS Picklist in Aura Component, I am trying to close the picklist when user clicked outside the picklist. I am trying to bind a click event to document and call the action to close the ...
2
votes
1answer
883 views

How to constantly display scrollbar in iOS using <ui:scrollerWrapper> element?

I would like to display scrollbar always in iOS devices when implementing scroll functionality using <ui:scrollerWrapper> element in Salesforce1 app which was recently fixed in Winter '17 ...
2
votes
0answers
153 views

Why in LEX aura:doneWaiting is firing before aura:waiting?

Why in LEX aura:doneWaiting is firing before aura:waiting? I am showing spinner mask on aura:waiting and hiding it on aura:doneWaiting, and my mask is shown forever because aura:doneWaiting is firing ...
2
votes
0answers
812 views

help text in lightning component using CSS

I have below line of code which will show help text when user will hover over question mark. <div> <div class="helptext" onmouseover="{!c.applyCSS}">?</div> <div ...
2
votes
1answer
391 views

visualforce page to list cases by contact using 'case.AccountId' for Person Account - Lightning Design

I have a business use case demand to show a list of Cases for the current associated Contact on the Case Feed in Service Console. I was able to achieve this with the below VisualForce Page: I was ...
2
votes
0answers
114 views

Salesforce Lightning Design System : Can we create side bar menu similar to lightning experience using LDS?

Salesforce Lightning Design System : Can we create side bar menu similar to lightning experience using LDS? Here is the attached sample:
2
votes
1answer
291 views

Tab of Lightning Design System

I have 2 problems: I'm trying to use the tab tag in salesforce lightning : https://www.lightningdesignsystem.com/components/tabs (i use the first one) but my tab is not responsive to the width of ...
2
votes
0answers
189 views

Lightning Design System svg on Console vf page

We have a vforce page with a list of items and actions over it. We are applying lds on the page and found out that if we use buttons with svg icons, when displaying the page in the console, those ...
1
vote
1answer
4k views

Lightning component: Child rows in data table

I have a data table based on Lightning component. In one of the column it displays Icon and when user click it should expand and show more information as child row. Is it possible to achieve this ...
1
vote
4answers
10k views

Which radio button is selected in lightning

How do I know in the JS controller which radio button option is selected. I tried the below code for which I see "undefined" in console log <span class="slds-radio"> <input type="radio" ...
1
vote
3answers
4k views

Expandable Section not working in Lightning

I'm trying to do an expandable section, but the collapse and expand buttons don't seem to be working: <aura:component > <div class="slds-section slds-is-open"> <h3 class="slds-...
1
vote
1answer
283 views

Different style in lightning from sandbox to production

I developped a quick lightning component that is embedded in a visualforce page and so far everything is fine. Look wise though, it seems like some styles aren't migrating correctly from my Sandbox ...
1
vote
1answer
977 views

Create a chart in Lightning

I want to create a chart map in lightning something like this where the names are marked on a point on the base map based on 2 scores. I don't see any option to create as such using scatter chart or ...