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
1 answer
20 views

How to make custom accordian loooks like a standard one

I am making a custom accordian and want to apply the same CSS as the Salesoforce standard page . Is is possible in LWC Cmp with the help of custom CSS. kindly help me. Custom -- Expected to make look ...
Shekher's user avatar
  • 19
0 votes
0 answers
19 views

What type of aura component is this?

Here you can see I've created two custom components that show your own open opps and tasks when viewing your own user record page but they show someone else's when you're viewing theirs. I cloned the ...
SethH's user avatar
  • 31
0 votes
1 answer
33 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?...
Dimitrije Pesicc's user avatar
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, ...
Pooja Kumbhar's user avatar
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} ...
Paras Saini's user avatar
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 ...
salesforce Developer's user avatar
0 votes
0 answers
154 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 ...
Neeraj Rautela's user avatar
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 ...
Sindhuja's user avatar
  • 155
0 votes
0 answers
117 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 { ...
Sanu Singh's user avatar
0 votes
1 answer
125 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,...
Sundi Chaithanya Reddy's user avatar
1 vote
1 answer
150 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 ...
Lauren Sweet's user avatar
1 vote
0 answers
738 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, ...
Luke's user avatar
  • 11
0 votes
1 answer
150 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 ...
Praveen's user avatar
  • 15
1 vote
1 answer
120 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-...
saivinay manapuram's user avatar
-1 votes
1 answer
350 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/'; ...
lazy coder's user avatar
0 votes
2 answers
338 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&...
Jason Rickert's user avatar
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 ...
fraserbrookhouse's user avatar
0 votes
0 answers
214 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 ...
DevelBase2's user avatar
0 votes
2 answers
2k views

How to display toast message in multiple lines using LWC

I need to show toast message in separate lines using LWC. Like this, I tried with '\n' and 'br' tag but it is not working. <div> <lightning-button label="Toast Msg" variant=&...
Kamal's user avatar
  • 13
0 votes
0 answers
102 views

Lightning Table Fixed Headers will not center

I am referencing below article in my code, applying fixed headers. When I do this I'm not able to center align the column headers or change the height of the header row. I have tried class="text-...
ThatGuy's user avatar
  • 75
0 votes
1 answer
111 views

slds-backdrop not covering the input fields on the screen

I am trying to add a lightning spinner, and I see the following behavior. The Input fields are not greying out when the spinner is on the screen Below is the code : CSS : .loadingSpinner{ position:...
SFDC Learner's user avatar
0 votes
1 answer
487 views

pagination in tiles in LWC

I wanna create UI Like this, I wanna add Pagination in Tiles using LWC is it possible? and this Title of section is accordion it should be expandable/collapsible, when I click on > arrow, the below ...
NMS's user avatar
  • 3
-1 votes
1 answer
1k views

How to change border-style to none in <lightning-input> LWC

I am trying to change the border style to none of a LWC Lightning-input tag. How should I do it?
Dilipan Manoharan's user avatar
0 votes
1 answer
3k views

How to show lightning layout item in 2 columns in LWC?

I created visual picker LWC component, the component is working as expected but unable to change the items to 2 columns instead of single column. I tried to use size="6" class="slds-...
Anjali's user avatar
  • 247
0 votes
1 answer
423 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={...
Gene's user avatar
  • 1
0 votes
0 answers
410 views

LWC Quick Action component can be opened as a modal on click of a lightning-button

I have a lwc modal component which opens on a quick action in Account object. Can I call that component using a custom lightning-button from another custom lwc component in Account lightning record ...
KTC's user avatar
  • 3
1 vote
1 answer
181 views

Related record ID in Aura Component with out server side controller (apex)

I am trying to create a Aura component that fires the create new page with the default values. I am calling the Aura Component from the Quick action where I can get the the record ID but how I can get ...
user4912134's user avatar
-1 votes
2 answers
215 views

onchange event not working on Salesforce ios app and Safari browser

We have a Salesforce application developed with LWC and published on Experience site. We also launched this application in android and iphone. The application is working fine in Windows Desktop and ...
Aruna's user avatar
  • 427
1 vote
1 answer
381 views

LWC not creating record on click of a button

My requirement is something like this: There is a create account button which creates a new account based on 'Name' input field in the lightning card. Once I click on this button, another button to ...
sourav guha's user avatar
-1 votes
1 answer
379 views

LWC: Alignment lost when using Name in Lightning-record-edit-form

I have a requirement to mimic the create contact form in LWC. For this, I am using lightning-rec-rd-edit-form. When I use Name field, it consumes 4 rows as it has Salutation, First name, Middle name, ...
Rahul Allada's user avatar
0 votes
1 answer
97 views

Lightning Design System SVG example doesn't show up if included in a static resource

We would like to implement an LWC that would use the https://www.lightningdesignsystem.com/components/illustration/#No-Task no task SVG image. <template> <div class="slds-...
Patlatus's user avatar
  • 16.8k
1 vote
1 answer
500 views

How can I add a transition to a lightning utility icon?

I need to add a transition to a lightning utility icon <lightning-icon>. I can't find any docs or solutions to this. Does anyone know how or does anyone have any good articles or docs relating ...
Matthew H's user avatar
0 votes
1 answer
169 views

LWC on Heroku with lightning design system and lightning base components

I want to deploy a lwc to heroku and use the lightning desing system and lightning base components. I tried a lot of different approaches I found online but non of them worked. As described here at ...
Jonas's user avatar
  • 3
0 votes
1 answer
1k views

How to retrieve Data on selecting combobox value in LWC?

I have try to create custom list view on Account but I have faced some issue while I am selecting the combo Box value How to retrieved apex class data ? Please help me to solve this issue..... and my ...
Crazy Man's user avatar
3 votes
2 answers
3k views

Activities standard component UI is changed with spring 23 release

We have standard activities component on record page. The UI for that component is as below for scratch org which does not yet have Spring 23 release: As salesforce spring 23 release coming we have ...
Jason Rickert's user avatar
2 votes
1 answer
351 views

Lookup CSS dropdown-alignment implementation in lightning-datatable

I'm currently having some issues with the lookup implementation that is being used within a lightning-datatable implementation. The lookup bar is being cutoff, and instead pushes the entire table ...
Kevin Yao's user avatar
  • 117
0 votes
0 answers
84 views

Thin border renders unevenly in LWC (Resolved)

I'm curious why does lightning renders the thin border of table cells uneven while in code the border-top and border-bottom was set to 1px dotted grey I hope someone can help. Thanks
Zed's user avatar
  • 1
0 votes
1 answer
385 views

SLDS Page Header Object Home with List Box

I'm trying t create a custom lightning aura component that looks like below screenshot. I've used the Page Header Object Home in SLDS, as well as the listbox pattern from the combobox or picklist SLDS....
jojopogi's user avatar
  • 492
0 votes
1 answer
676 views

How to pass Dynamic object query in lightning Data Table in Aura Lightning?

I wanted to add the dynamic object query result in Lightning datatable in Aura Lightning ? Data comes in console log but how to add in lightning data table ? Please help me. Code:- public class ...
Crazy XYZ's user avatar
1 vote
1 answer
2k views

Remove bottom border from Lightning Card?

I have a Lightning Card in a Tabset and I cannot remove the bottom border. Below is the code (I have removed the other tabs for simplicity). I needed to use a CSS to display the Border in the Card - ...
Jeff Callahan's user avatar
1 vote
1 answer
419 views

How to style lightning grid and icon like this photo?

I am trying to get a lightning grid with lightning cards similar to this example below. I have my wireframe and the actual image. It seems that there can be more cards you can scroll through using the ...
Alan's user avatar
  • 27
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> ...
Arka Sen's user avatar
0 votes
2 answers
2k views

lightning-input type=datetime [Unable to set / consider the locale time for the validation as per the Locale of the User]

.html snippet (LWC Component) .js snippet (LWC Component) import { LightningElement, track } from 'lwc'; export default class DateTimePickerLightningInput extends LightningElement { @track today; ...
Salesforce Developer's user avatar
-2 votes
1 answer
466 views

lightning icon size is changing

I am using lightning-icon in a tile.But for a sentence ,the size of the icon is changing.(icon is not in round shape). [![<template> <div class="values"> <div ...
Tency Serah's user avatar
2 votes
1 answer
815 views

Final check progress-indicator lwc

I'm trying use the lightning-progress-indicator of lwc. I want show the final check if step is finished <lightning-progress-indicator class="path-checks" current-step={...
Rodolfo's user avatar
  • 316
2 votes
1 answer
76 views

How to replicate a custom button/VF in Lightning

We migrated to Lightning and there is a custom button on the Opportunity page that loads a Visualforce page and I need to get it replicated to work in Lightning. I am not a developer nor do I have one ...
user7417's user avatar
  • 331
2 votes
1 answer
3k views

Creating Multiple Data Table for list of Records using LWC

Can anyone tell me how do I create multiple data table using single lightning data table in my html and iterating over with template for each with the list ? I am looking at something like this: ...
Ajay's user avatar
  • 45
1 vote
0 answers
396 views

How to add onclick event on Path(Path from Salesforce Lightning Design System)?

I am working on a Lightning web component and used path from Lightning Design System to show the value of the picklist field. I want to the change the value of picklist field by clicking on the other ...
PARAG TALUKA's user avatar
1 vote
1 answer
7k views

How to get the close icon(cross sign) at top right corner of modal in LWC?

I am creating a modal and copied the code of modal from Salesforce Lightning Design System. Here is the code : <section role="dialog" tabindex="-1" aria-modal="true" ...
PARAG TALUKA's user avatar
2 votes
0 answers
32 views

Branding Setup Page and SLDS Tokens

Is there a place or has someone documented which SLDS Design Tokens that are marked "Themeable" Yes match up with what is presented on the "New Custom Theme" under the Themes and ...
Bryan Anderson's user avatar

1
2 3 4 5
18