2022 Developer Survey is open! Take survey.

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

How can i add lightning:select in recordEditForm's one of input field?

How can i added lightning:select in recordEditForm's one of input field which is the simple input field? Can i change field from input to select in recordEditForm? This is input field from lightning:...
user avatar
0 votes
1 answer
15 views

For lighning:recordEditForm

I want to part 2 columns in my record edit form because it has too many fields.
user avatar
0 votes
1 answer
34 views

How to display profile avatar and text inside lightning data table

I am trying to create a custom Account Team for a custom project called "Project". The Project will have "Project Members" so we can see which users are working on the project and ...
user avatar
0 votes
0 answers
15 views

i notice for some records lightning open files event is not working. Any Idea what could be the issue?

Below is the code i am pasting for opening the document. if (!$A.util.isEmpty(csDoc)){ this.callServer(component, 'c.getExistingDocumentID', ...
user avatar
0 votes
0 answers
57 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-...
user avatar
  • 323
0 votes
2 answers
59 views

Want to increase lwc icon size in in specific pixels. so what i did is added style="size:50px" this is not worked for me

This is the code. <lightning-button-icon style="size:50px" icon-name="utility:settings" variant="bare" alternative-text="Settings" icon-class="slds-m-...
user avatar
0 votes
1 answer
15 views

Mistakenly set Boolean attribute to Yes in lightning

In my lightning component have an attribute defined as boolean <aura:attribute name="test" type="Boolean" default="false"/> ...... ..... //...
user avatar
2 votes
0 answers
16 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 ...
user avatar
0 votes
1 answer
42 views

How to add slds-line-clamp to a lightning-datatable?

SLDS's slds-line-clamp is a good way to truncate multi-line text at a fixed number of lines. But it appears awkward to apply this to text cells in a lightning-datatable. This column data approach ...
user avatar
  • 129k
0 votes
1 answer
159 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 ...
user avatar
2 votes
1 answer
126 views

2 Column Width Issue during iteration LWC

I am not able to get a 2 column fields. I am trying to iterate over a list of 5 field to show all fields with 2 field each in one row. <div class="slds-grid"> <div class="...
user avatar
0 votes
1 answer
324 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 ...
user avatar
0 votes
1 answer
25 views

Show fields (consider 500 field or more) based on values of 3 different picklist fields

I have 3 picklist: P1, P2, P3 I want to show others fields on Lightning page based on the values selected on P1,P2,P3. Example: P1 has values as : P1V1, P1V2 P2 has values as : P2V1, P2V2 P3 has ...
user avatar
2 votes
1 answer
133 views

"No TOKEN named force:base.varFontSize7 found" design token build error started today

We have a LWC that has not changed for months that includes a reference to the $font-size-7 design token: .notes-output__span { min-height: calc(var(--lwc-varFontSize7,1.25rem) + 1px); } and ...
user avatar
  • 129k
0 votes
0 answers
28 views

How to make the toggle button allign beside a combobox

` <div class="slds-grid slds-wrap"> <div class="slds-col slds-p-around_small slds-size_1-of-1 slds-medium-size_1-of-2 slds-large-...
user avatar
  • 30
1 vote
1 answer
128 views

Checkboxes and icons margin and padding not visually good as the original ones

folks! I am trying to replicate a record detail layout's from a object into my LWC. But, the checkbox and the pencils icons padding and margin are not equal as the original one, why? I did create a ...
user avatar
0 votes
1 answer
164 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="...
user avatar
  • 157
0 votes
0 answers
18 views

How to see and edit before upload csv file in object?

HTML <template> <lightning-card title="File Upload Demo LWC" icon-name="custom:custom14"> <div class="slds-m-around_medium"> <...
user avatar
0 votes
0 answers
99 views

Button-menu-item's displays below DIV's with higher z-index

I'm creating a process design App with process steps. Each process step is represented by a child LWC component having a container div with a different z-index, to allow correct placement and drag &...
user avatar
  • 16
0 votes
0 answers
13 views

I want to hide the edit buttons present beside the column records(I have used lightningstylesheets=True for my vf page)

I have changed my existing vf page to lightning by using lightningstylesheets=true.After changing my apex:pageblocktable is looking wierd with that edit buttons and below is my code. apex:pageblock ...
user avatar
0 votes
1 answer
37 views

Lightning Design System - alignment utilities

I am currently going through the LDS documentation and I stumbled upon the section of alignment utilities, which contains only one example - absolute center: <div class="slds-align_absolute-...
user avatar
0 votes
1 answer
23 views

<ui:inputText/> and <lightning-input></lightning-input> onchange method

I'm a newbie in Aura Components and LWC. I was scrolling through the specifications <ui:inputText/> (https://developer.salesforce.com/docs/component-library/bundle/ui:inputText/specification) ...
user avatar
0 votes
0 answers
132 views

Show only Year and Month in Datepicker LWC

<template> <div> <lightning-input type="date" name="input4" label="Date field with placeholder" placeholder="type here..."></...
user avatar
  • 83
0 votes
0 answers
21 views

Custom LWC slds-dueling-listbox for narrow region

I have customized the dueling list box as shown below: <lightning-layout-item size="12" class="slds-p-left_small"> <div class="slds-dueling-list__column slds-...
user avatar
1 vote
1 answer
197 views

need to display Icon near to field label in LWC for Combobox

I have t create one icon and need to show near to field name for combobox in modal window below is my code <div class="slds-modal__content slds-p-around_medium" id="modal-content-id-...
user avatar
  • 13
0 votes
0 answers
16 views

lightning-radio-group: did not switch to mobile layout on resize

according to the documentation, the type="button" component inherits styling from Radio Button Group in the Lightning Design System. But instead of shrinking as written in the documentation, ...
user avatar
0 votes
1 answer
393 views

CSS in LWC - lightning-combobox box to be curved (border-radius)

I want the lightning-combobox input box to be curved(border-radius: 18px). My research and attempts: I tried CSS for lightning-input as: .slds-modal input[type="text"]{ border-radius: ...
user avatar
  • 13
0 votes
1 answer
66 views

Displaying Euro currency in lightning-datatable properly

Salesforce junior here. I am currently trying to display some price information in a lightning-datatable. However, the result is formatted like it's seen in the US, while I want it the amount of money ...
user avatar
1 vote
2 answers
196 views

change color of a lightning-vertical-navigation-item-icon

I am building an lwc menu and have a <lightning-vertical-navigation-item-icon label="Sessions" name="sessions" icon-name="utility:event" class="myIcon&...
user avatar
  • 15
0 votes
1 answer
175 views

placing button menu in lightning-tile lwc

I am trying to create a tile which will iterate records. I am trying to place the button menu exactly opposite to "Salesforce UX" towards right corner. I am unable to it. Below is my code. ...
user avatar
  • 1,516
0 votes
0 answers
34 views

How can I update specific indexes in an array in a dynamic form?

I am trying to update specific data fields in an array of data. I am struggling to come up with a solution to updating specific fields of an array with multiple entries. Lets say there are 2 fields ...
user avatar
0 votes
0 answers
18 views

Styling lightning layout problems

My code is: <template for:each={t} for:item="t"> <lightning-accordion-section key={t.id} data-item={t.id} label={t.label} name={t.id} class="slds-truncate"...
user avatar
  • 157
0 votes
0 answers
84 views

Docking utility bar on modal footer LWC

I am trying to implement to use Utility bar on Modal . The issue i am facing is i am unable to dock the utility bar on modal footer, its getting docked on page footer. Is it possible to dock on modal ...
user avatar
  • 1,516
0 votes
1 answer
86 views

slds-grid system not working as expected

My requirement was to dynamically render div's in an grid horizontally once a platform event is received to the component. Here is my code and what i am doing as of now : HTML : <!--The Grid ...
user avatar
0 votes
1 answer
17 views

datetimepicker opening up and not showing day month selection

I have used lightning-input type="date", however when it opens, it open up when it is zoomed and then hides the rest of the selection and doesn't work properly. Can you please suggest how to ...
user avatar
  • 497
0 votes
0 answers
34 views

How to account for the "Logged in as..." banner extra height when handling a mouse event in an LWC?

Lightning shows this banner: when you login as a different user. I have an LWC that positions a popover based on the clientX/clientY of a mouse event, but a simple hardcoding of an offset to set the ...
user avatar
  • 129k
0 votes
1 answer
74 views

landscape view in mobile

I have created a form where we have around 21 fields to be filled. when I viewed this form in mobile toggle, for portrait view its working fine, but for landscape view, The alignment getting disturb ,...
user avatar
0 votes
0 answers
23 views

Need to get row value from datatable in JS in LWC, but unable to get it [duplicate]

I have simple datattable where i am displaying couple of columns ,on click of any row in datatable i need to get the value from Name column to JS for further processing <template> <lightning-...
user avatar
  • 7
1 vote
0 answers
407 views

Alignment of lightning columns in lightning datatable. The columns are overlapping over each other

I'm using a CustomDataTable by extending LightningDataTable for custom DataType in lightning data table. I've used Picklist and lookup data type as custom data type in the lightning Data Table. Please ...
user avatar
1 vote
0 answers
327 views

Can we add previous and next arrow in the Lwc lightning-carousel tag for image slider? [closed]

I am trying to build component that has lighting carousel tag and which has image slider in it but I wanted to add arrow buttons of previous and next button for manual control over the slider.
user avatar
0 votes
1 answer
48 views

Is there a way to add x amount of new components based on clicks?

I am wanting to add new components to specific section of the screen depending on when a menu item is clicked. The menu items would be mobile phone and landline phone. Anytime one of the menu items ...
user avatar
0 votes
0 answers
78 views

Is it possible for SLDS-Backdrop to gray out only current tab and not the entire screen?

I am using SLDS-Backdrop CSS to gray out the background while a progress bar runs. This CSS class grays out the entire screen till the progress completes itself, which the business doesn't want, as it ...
user avatar
0 votes
1 answer
648 views

Remove the Validation and Error message from Lightning-input field on Focus

I am using the Lightning-input field which is required field. When I leave the field empty it shows a validation error. But the error stays there till I give some input and click outside Is there any ...
user avatar
0 votes
1 answer
81 views

How to hide white background on LWC Component load?

When you load an lwc component that is a screenAction, when you click a button to activate component or is triggered via a connectedCallback, this alway appears. How would you hide the white ...
user avatar
0 votes
0 answers
77 views

Getting error when loading CSS style from static resource in LW

I am trying to load a CSS file (modal.css) in the Connectedcallback function via PromiseAll. LWC.js import {LightningElement,api,track,wire} from 'lwc'; import {loadStyle} from 'lightning/...
user avatar
  • 718
0 votes
1 answer
88 views

How would you get a child's grid to align to the Parent's grid? (Lightning Design System)

In essence I am trying to achieve LDS Column Nesting but with child components inside of a parent component. I am trying to have the child components, of the parent's, stretch out to the their size_4-...
user avatar
0 votes
1 answer
1k views

How do i display field values from a related objects in my lightning data table in LWC

Hi im trying to display some parent object fields in my data table and for some reason the fields are not being displayed. I have tried flattening my json but still no luck. Looking for some help to ...
user avatar
2 votes
1 answer
341 views

Why slds-backdrop is not part of slds-modal in Modal?

While reading generic documentation on modal box implementation, I found that there is usually one container class for it - .modal: HTML <!-- The Modal --> <div class="modal"> ...
user avatar
  • 4,645
0 votes
0 answers
47 views

Override Standard Design Tokens to Apply Site-Wide in Community

I have been reviewing Documentation recently and came across Design Tokens. I understand the use of them with Custom Components; however, it is not clear what (if any) functionality is available with ...
user avatar
  • 101
1 vote
1 answer
33 views

Is there a way to change prefixed c-childfunction to myteamname-childfunction?

As title says, I was wondering if it is possible to change the name of calling a component from <c-childfunction></c-childfunction> to <myteamname-childfunction></myteamname-...
user avatar

1
2 3 4 5
18