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
0 votes
0 answers
21 views

How to remove x on lightning pill but in LWC

I saw there is an answer to this question but its not working for LWC, I think it does the job for aura component, so what do I need to write in Css so I can have x removed from all my lightning pills?...
0 votes
1 answer
9k views

How to scroll on the top of modal

i have a modal popup with scrolling, i am trying to scroll the user to the top of the modal when the user clicks on a button. window.scrollTo(0,0) is scrolling the main window not the modal.
0 votes
1 answer
868 views

Scrollbars always visible in lightning page

I want to show both scrollbars always visible as my content in table is too large row and column wise. How can I implement this? PLease find this figure to understand what I want. Currently I am ...
0 votes
1 answer
879 views

slds-modal class not working inside Community

The typical modal code from the lds reference website does not work inside a community. There is no overlay behind the modal that covers the rest of the screen. Has anyone else encountered this and ...
12 votes
1 answer
1k views

mCustomScrollbar not working when Locker Service is enabled in Salesforce-1

I am having problem when using mCustomScrollbar (GIT Hub) when locker service is activated. During initialization of mCustomScrollbar in the helper, it throws the following error [TypeError: ...
0 votes
1 answer
26 views

<lightning-tree> LWC Adding each section a dynamic color

I am working on and we got a requirement to have different color for each section dynamically based on the data available for each section. I have tried with template.queryselector() to get section, ...
0 votes
1 answer
31 views

Make lightning-input Label as P1 font and value as P2

<lightning-input data-validate data-automation="lastname" label={_lastNameLabel} readonly={_readOnly} value={lastName} ...
2 votes
1 answer
803 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 ...
1 vote
1 answer
933 views

lightning tree grid how to hidden column button

Question 1 How to sets the visibility of the button-icon based on the fields in the data. such as 'status' Question 2 How to resize button-icon?. html <template> <div class="slds-...
0 votes
1 answer
5k views

In LWC is there a way to Save selected Radio Button value to a record

My requirement is to display picklist values as radio buttons in a Lightning record edit form, but I am unable to save the values selected from the radio buttons to the record. Default save button of ...
3 votes
1 answer
812 views

onclick not working for ui:outputcurrency

I have code that iterates over a list. for some reason the onclick method does not seem to fire. Is there something wrong in my code below? Also how can I get the index id of the clicked row ?` <...
0 votes
2 answers
2k views

Error message from server side controller lightning

Hi i want the error message to be displayed, i am getting value in response.getError() function, i want message argument in this function. Below is the snippet of how i'm doing, i am getting undefined ...
0 votes
0 answers
28 views

Styling custom drop down to not hide inside flow modal and extend modal length

I have a custom reusable lookup dropdown LWC component that I'm using in another parent component, which is then used in a flow screen. The dropdown hides inside the flow modal content area. I want ...
1 vote
1 answer
2k views

How to get popovers in LWC to go across LEX page sections

My question is how do I get my custom popover to span across LEX page sections like this standard popover? I'm using SLDS styling. LWC html: <template> <div class="slds-page-header&...
2 votes
1 answer
2k 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 ...
0 votes
1 answer
2k views

lightning:menuItem in lightning:buttonMenu is not working in a nested component

I have two lightning components. One gets account's basic information on load and iterates over it and another displays the each account's basic information in a row. I have explained the div tag ...
2 votes
4 answers
5k 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 vote
2 answers
1k views

Drag and Drop - multi file upload in Custom Lightning Component

I want to create a drag and drop multi-file upload in a lightning component form. The form is displayed in a community. I have used <lightning:fileUpload label="Attach receipt" ...
0 votes
0 answers
150 views

When creating a lightning-record-edit-form with two columns, the fields are not occupying the full width of the page

I have created a lightning-record-edit-form with two columns, but in the UI, the fields are not occupying the full width of the page. I have tried various approaches, including using SLDS, layout ...
0 votes
2 answers
5k views

How to show fields from different Objects in a single lightning-record-form in LWC

There is a use case in which we have to build a form using lightning-record-form. We have to display the set of fields from different objects into that form in different accordion sections. I was ...
1 vote
2 answers
1k views

lightning-input-field [Lightning Web Components]

I am currently trying to make a table where I use the lightning-record-edit-form. I am trying to make the helptext icon disappear (without deleting it on the field itself), without any luck.. Can ...
0 votes
1 answer
422 views

Resize lightning-input-field when it is a rich text field using the cursor

I have this in my LWC component <lightning-record-edit-form> <template for:each={draftableFields} for:item="field"> <lightning-layout-item key={...
7 votes
2 answers
13k views

LWC datatable Header wrapping

I am working on a LWC component where in a lightning datatable I have more than 7-8 columns. When I add the component into detail section of a record page, the headers of the table is getting ...
0 votes
1 answer
2k views

Scrollable Utility Not Working on Aura Component in Global Action

I've got a Flow being called in a Global Action via a Lightning Aura Component. The Flow and Component are working, but for some reason the scrollable utility isn't. Does anyone have any idea what the ...
1 vote
1 answer
2k views

Dynamically update Lightning path (Chevron)

My Lightning/Salesforce Path was displaying the Chevron based on the Case Pick list field which has 15 pick list options. Every Case is unique and doesn't require all the 15 options, how can I make my ...
0 votes
0 answers
67 views

How to get the selected image in parent in <lightning-carousel>

I have a requirement where on click of lightning-carousel dots, we need to get the lightning-carousel-image that got clicked and we need to process the logic based on the selected image. Here I need ...
0 votes
1 answer
1k views

Apply HTML elements dynamically from JS in LWC

I have an html element: <span style="font-size: smaller;font-weight: 400;white-space: initial;text-transform: none;"> I want to dynamically apply this html element to an Accordion ...
0 votes
3 answers
5k views

how to create lwc component to create new record for custom object ? only the name field is saving but other fields are not saving

html code <lightning-card> <h3 slot="title"> <lightning-icon icon-name="standard:record" size="small"></lightning-icon> ...
1 vote
1 answer
5k views

Show Custom Links in Lightning Home Page

I have a custom lightning component in my home page "Salesforce Login" Now my scenario is whenever I am clicking this "Salesforce login" in my homepage, it should redirect me to salesforce login page. ...
0 votes
0 answers
116 views

Why I am getting padding of 2px in my Lightning-radio-group element's all the radio button except first radio in LWC in salesforce?

CSS: .vertical-radio-group { display: flex; flex-direction: column; align-items: flex-start; margin-left: var(--slds-c-lightning-radio-group-spacing-inline-start, 0rem); } .slds-radio { ...
0 votes
1 answer
8k views

How to open a new dialog box in lwc in a pop up window instead opening in a tab or subtab

How to open a new dialog box in lwc in a pop up window instead opening in a tab or subtab. I tried opening using navigation.maxin but it opens in a subtab I have a lwc component and used a lightning ...
0 votes
0 answers
502 views

Lightning Carousel is adding empty Indicators to existing images when event is fired

I have two components Stage and Carousel, The stage will have 4 values (stage 1, stage 2, stage 3 and stage 4), When ever a stage is changed I am pulling Carousel images related to that "stage" from ...
0 votes
1 answer
124 views

How can I print object related object fields in lwc with wire and apex

public with sharing class retriveaccndcon { @AuraEnabled public static list<account> getrecords(string parentId) { return [select id,name,(select Id,FirstName,LastName,...
0 votes
2 answers
2k views

Size of lightning-helptext icon?

How can I modify the size of an Icon in lightning-helptext? My code: <lightning-helptext content={errorLabel} icon-variant="error" class="slds-p-right_small" icon-name="...
1 vote
1 answer
145 views

LWC: Making child cards grow with each other

I'm very new to all of this, so apologize if this is obvious to others. I have four cards that I am using in a parent lwc. The content of each is different, but I want all of the cards to be the same ...
2 votes
2 answers
968 views

How to close lightning-combobox menu items when scrolling the page in LWC?

I have a LWC and a lightning-combobox inside it, but while the dropdown items are open and I scroll the page, the menu items are still visible on top of other items. I need to auto-hide the menu items ...
1 vote
0 answers
722 views

Change text color in header of Lightning Data Table (LWC)

I am trying to change the text color in a lightning data table (LWC), and I'm not having any luck. I've read several posts about changing the background color of the headers in a lightning data table, ...
9 votes
3 answers
56k views

SLDS table with fixed header

I'm implementing SLDS table in lightning component where you load more data on vertical scroll and it would be nice to have headers fixed. The code that I'm using is pretty much as in the slds docs: &...
0 votes
1 answer
146 views

Lightning Layout scrollable is breaking the table and showing only few columns

I am working on the Custom product family selection LWC component, I added the rows and columns in the lightning layout using table. For 4 fields the table is showing all the rows and columns, but if ...
2 votes
1 answer
48k views

Align SLDS buttons to right [closed]

I am trying to create a file explorer system, wherein all the folders are iterated and created. I have two buttons beside every folder I need to move those two buttons to complete right. I tried with '...
5 votes
1 answer
6k views

Unable to use SLDS Icons in Lightning Web Component

I am developing an app and I need to add SLDS icon with custom color (i.e. green or blue) to the UI. Which is why I can't use <lightning-icon> component because you can override it style. Thus ...
3 votes
1 answer
593 views

ui:inputText getting zoom in

I have an input text as <div class="slds"> <div class="slds-form"> <div class="slds-form-element " > <ui:inputText aura:id="textSearch" class="slds-input ...
1 vote
1 answer
119 views

lightning-progress-indicator not rerendering if the total step count is changed

parentCmp.html <template> <c-progress-cmp total-steps={currentStep} current-step={currentStep}></c-progress-cmp> <template if:true={showFirstComponent}> <c-...
-1 votes
1 answer
346 views

I am getting deployment error while calling my apex class in LWC, Unable to activate Apex Language server

apex class global class UserLoginController { @AuraEnabled global static String login(String userName, String passWord){ String homeUrl = ' https://nttdata-32c-dev-ed.my.site.com/s/'; ...
3 votes
2 answers
8k views

Layout a Lightning Web Component Card as a standard related list

due to some business requirements, I need to develop a custom related-list for Contacts on the Account object. I wanted to do so with a LWC utilizing the lightning-card component. Unfortunately, I am ...
0 votes
2 answers
334 views

Increasing thickness of Lightning progress bar

I have an requirement where I need to increase the thickness of progress bar to 1rem. Salesforce has provided progress bar as below: <lightning-progress-bar value="50" size="large&...
0 votes
0 answers
58 views

How do I make three divs within a lightning layout item evenly space out to take up the entirety of the available space?

How do I make my three divs within this lightning layout item evenly space with the logo at the absolute top of the layout item and the button at the absolute bottom? Right now the text displays right ...
2 votes
0 answers
262 views

How to avoid using position:absolute in stylesheets for aura components due to security concerns as mentioned in the ISV guide

I'm trying to pass security review for my managed package. I have to a security issue to address: Unsafe CSS position declaration: position: absolute; The Salesforce Platform tries to ensure that ...
0 votes
0 answers
213 views

How to hide the rendered lines above each row in a datatable?

I am implementing a nested datatable within a column of a another datatable. This datatable is supposed to have no borders around the rows. My code is based on Datatable with no borders: Parent ...
12 votes
1 answer
4k views

Lightning : Show Stencil When Component Loads

So I see in the docs for SLDS they talk about using "Stencils" while a page loads. I can't find any examples of how they're implemented. Can anyone point me to any docs or samples that use this?

1
2 3 4 5
18