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
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}" ...
2
votes
3answers
1k views

<aura:html tag=“style”> not working after summer 19 release

I applied the below code to increase the width of quickAction lightning component <aura:html tag="style"> .slds-modal__container { width : 60% !important; max-width : 80% !...
2
votes
1answer
1k views

How to upload a ContentVersion with lightning component?

I'm trying to use simple apex class and simple controller like a test. But can't upload ContentVersion. What is wrong here? handleFileSelected: function(component, event, helper) { let files = ...
2
votes
1answer
2k views

Sizing the layoutitems based on size of the top container and not the viewport

We have built a lightning component which is to be used on the record home page. Now the user can either add the component in the side or in the detail section itself. Everything is working fine ...
2
votes
1answer
592 views

lightning overlay issue

I am trying to display table in the modalbody and modalfooter with ok and cancel button but over lay is not loading it throws some promise errors: Uncaught (in promise) TypeError: Cannot read ...
2
votes
1answer
2k views

Allow to enter percentage values between 1…100 with lightning:input

I am unable to configure a lightning:input to allow a user to input 50 when he wants 50%. It always does strange conversions. Please provide me with a <lightning:input type="number" formatter="...
2
votes
1answer
2k views

Show comma separated values as pills in input field lightning

I have one input field which will store some value. In that field, every comma separated value needs to be shown as a pill. Currently I'm able to show it outside input text but not inside input text. ...
2
votes
1answer
3k views

Increase the Lightning pop up modal size by height

I have created a lightning pop up modal on click of a button. I can change the width of the pop up but is there a way I can increase the size by height by means of css or any other? The text area is ...
2
votes
2answers
3k views

How to use both ltng:outApp and force:slds in lightning Application

I have created one lightning application which I'm using in my vf page. To use lightning app in vf page I need to extends ltng:outApp but at the same time I also want to use lightning design system. ...
2
votes
1answer
937 views

Outline on ui:button when press

Hi I try set color of my ui:button border on click to none or transparent. This is part of my code. my aura: <ui:button class="btn btn-image"/> css .THIS .btn:focus { outline-...
2
votes
1answer
539 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
249 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
2answers
523 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>...
2
votes
1answer
104 views

Progress Ring fill clockwise

I am using Brian's Progress Ring Component here- https://gist.github.com/brianmfear/d1308608c0facdc626b85c9c248fc7af It works great, however it fills in anticlockwise way. I have a requirement to ...
2
votes
1answer
853 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
628 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
5k 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
559 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
359 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
282 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
235 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
0answers
59 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 ...
2
votes
1answer
138 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 ...
2
votes
1answer
114 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
117 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
3answers
791 views

Manually change defualt subtab on Lightning App page

I have a Lightning page in which the default tab has been set to "Product Selector". Is there a way by which I can manually switch the default tab to the 'Detail' tab via a lightning event? ...
2
votes
1answer
464 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
385 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
411 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
901 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
299 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
0answers
646 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
100 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
217 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
896 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
346 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 ...

1 3 4 5 6 7 14