Questions tagged [slds]

Salesforce Lightning Design System (SLDS) is a collection of design patterns, components, and guidelines for creating unified UI in the Salesforce ecosystem.

Filter by
Sorted by
Tagged with
0
votes
0answers
88 views

VisualForce Page onKeyup javascript not working after SLDS styling

I have a VFP that I migrating to Ligntning using <apex:slds/>. I have a js validate function onKeyUp() for an input Text. I know the javascript needs to be handled differently in such scenario. ...
0
votes
1answer
229 views

<apex:slds /> against static resource

I'm using SLDS datepicker on my VF page. I tried <apex:slds /> at the first place to load utility-sprite event icon to click and load the calendar. But it didn't load properly. Then i switched ...
3
votes
1answer
207 views

How do i have SLDS box align next to each other with same height

I know this is mostly related to css, but i just want to see if this can be accomplished using available classes in SLDS. Here is what i am trying to accomplish. I want to have 2 box side by side ...
0
votes
0answers
241 views

Re-orderable Listbox in Lightning

Does anyone know how to instantiate a re-orderable listbox in a Lightning page or component? Here is the description of the Re-orderable Listbox: https://www.lightningdesignsystem.com/accessibility/...
4
votes
3answers
3k views

How to create with SLDS grid system and lightning:cards some “full-screen” height cols and inner scrolls on overflow

First of all, I'm open to suggestions on how to make the title more descriptive ;) What I'm trying to achieve is to have a "full-screen layout" using the slds grid system but I don't know all the ...
7
votes
1answer
299 views

Unstyled Flows in Lightning Out

I have a static site, hosted in a AWS S3 bucket. The static site uses Lightning Out to load a component that contains a flow. I have included the SLDS stylesheet in the static site, and have ...
0
votes
2answers
2k views

Copy lightning experience background look and feel

I am developing a community and I would like it to look like lightning experience. One main thing is the background picture that is dissolving into blue - I want to achieve a background like this: ...
2
votes
1answer
347 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 ...
3
votes
1answer
933 views

lightning:treeGrid Conditional Action(button) column

We are trying to build a Hierarchical view of records using lightning:treeGrid and based on value from a field in each record, the button in action(button) column should change. Let's Say we are ...
0
votes
0answers
178 views

Parse a list Of wrapper class in javascript don't want apex:repeat [duplicate]

I have a list of wrapper class list tempList public class employeeBookedClass{ public string locationName; public string locationDate; public string trainerName; public string ...
3
votes
1answer
466 views

Lightning Out SLDS Weirdness

I am trying to load a lightning out app in a static site hosted via an S3 bucket. I started with a lightning app that extends ltng:outApp and it describes a single component as a dependency. The app ...
6
votes
1answer
97 views

Locale Supported Format For Visualforce Input Field

I've been rewriting a Visualforce page to use SLDS styling. Part of this requires rewriting dynamics DateTIme fields to SLDS Date time picker. This therefore means writing the Date part of the ...
1
vote
0answers
180 views

How can I specify an SLDS icon for the icon attribute of QuickAction

Are the SLDS icons exposed as static resources (without a manual upload)? Is there a syntax for referencing the the SLDS icons, as static resources, from metadata? I am creating a QuickAction using ...
6
votes
1answer
2k views

Lightning: How to open a newly-added accordion section?

Assume the following pseudo-markup: <component> <attribute recordList/> <button label="Add" onclick="{!c.addRec}"/> <accordion> <iterate over recordList ...
1
vote
0answers
39 views

Opening another VF page from Lightning Experience 's VF Page

We have migrated a VF page from Classic to Lightning and it is working fine. In this page, we need to open another page on a click of a link. So, we have written code as below : <apex:outputLink ...
1
vote
2answers
2k views

Lightning Component File/Image Upload and having it show up in Notes & Attachments

I am trying to pop open a modal form with an input to upload a documentation image on it. Everything else on the form is working perfectly fine, I just had a last minute ask to add this file input ...
1
vote
1answer
839 views

Style and Show command Link as Command Button in Classic & Lightning

I would like a command link to look like a command button. I was once told that I could to that with using the style.
5
votes
4answers
4k views

How to set autocomplete=“off” in lightning form

The Problem I am trying to set the HTML attribute auto-complete="off" on an input element with the class slds-input. For some reason the template always converts this to autocomplete="true" in ...
2
votes
1answer
244 views

What design system can I use with Salesforce Communities

We are considering building a portal based on Salesforce Communities. There a new "Build Your Own" template that comes with Communities, which is attractive to us as it would seem we would have a lot ...
3
votes
1answer
973 views

Lightning styling of multi-picklist in visualforce page?

was wondering if anyone had any suggestions for how to do styling of a multi-picklist in a lightning manner within a visualforce page? <apex:repeat value="{!$ObjectType.Surgery__c.FieldSets[fixed]}...
0
votes
1answer
2k views

Lightning component : slds-truncate Not working

I am not able to truncate a long text area field {! consult.Situation__c } when displayed in a Lightning component: <aura:component controller="ConsultationListViewByOperatorCtrl" description="...
0
votes
1answer
844 views

force:recordData getNewRecord( DYNAMIC recordTypeId )

How can I get the function getNewRecord() to take a variable as the record Type ID? I'm in a different scratch org and I don't want to have to keep going through and finding the specific recordTypeID. ...
-4
votes
1answer
61 views

How Can I use SLDS system in my Salesforce Devloper Blog for styling? How? [closed]

How Can I use SLDS system in my Salesforce Devloper Blog for styling? How? I have blog where I keep posting about Salesforce development. I want to give look and fill of SLDS for that blog.
1
vote
5answers
5k views

Styling Issues - Lightning Component Framework Specialist Superbage

I'm going through the Lightning Component Framework Specialist Superbage. I am on step 3 of the challenge (the elaboration about which is under the Populate the Search Results subtitle on the ...
1
vote
2answers
1k views

Why is only utility icons allowed on lightning:buttonIcon and other types like standard?

I want to use a standard icon as button in my application but it is not allowed in lightning:buttonIcon. If I use lightning:icon, it does not contain onclick handlers. If I enclose it in div or ...
0
votes
1answer
511 views

slds-table_striped not working in lightning but works in visualforce

Lightning Component: <aura:component implements="forceCommunity:availableForAllPageTypes" access="global" > <div class="slds-grid slds-wrap"> <table class="slds-table slds-...
8
votes
1answer
1k views

Dynamically Render Toast Message With Icon?

I wrote a dynamic component to build toast messages based on ApexPages.Message in my answer here, but one aspect of it has been bothering me ever since, and I'm trying to fix it. When the toast is ...
1
vote
2answers
506 views

Checkbox group in lightning design system

I am trying to use checkbox group in a customer facing page using lightning design system styling. The output should look something like this. I tried using multi select picklist but the rendering ...
1
vote
1answer
518 views

slds-size not working as expected (each element is on a new line)

I have my html set up like: <div class="slds-container--center slds-container--medium" id="userSettingsTable"> <ul class="outline slds-box--border"> ...
2
votes
1answer
4k views

Lightning button Variant - To appear blue/white and appear center aligned

Trying to build a form and I put 2 buttons in the form. Want 1 of the button as to appear blue and other to appear white. I created below component: Searchform.cmp <aura:component > <!--...
0
votes
0answers
107 views

Getting lightning stylesheets in salesforce1 page?

I am migrating a VF page to look better and be usable in the Salesforce1 app on mobile devices. I have been pulling in lightning stylesheets by including <apex:includeScript value="/lightning/...
1
vote
1answer
419 views

Unable to customize style for flow text area with lightning component on visualforce page

I had some fun this weekend embedding a flow on a visualforce page w/ lightning runtime and using it in a chatter profile tab in a subtab app. My one remaining issue w this approach is that the ...
1
vote
3answers
391 views

How to fix arrow areas rendering in the wrong color in an slds-path?

I'm writing a Lightning Component that renders an SLDS Path based on some custom configuration data (so I can't use the lightning:path component). A few weeks ago a colleague tried this out and couldn'...
6
votes
2answers
11k views

One column/two column form responsive layout using SLDS that preserves field ordering?

When I Google about responsive design, I find many examples where two areas that display side by side: AAA BBB AAA BBB AAA BBB display one after the other when the screen width is reduced: AAA AAA ...
4
votes
2answers
901 views

apex:slds vs apex:includelightning vs apex:page lightningStylesheets=“true”

apex:slds vs apex:includelightning vs apex:page lightningStylesheets="true". Which one do we need to use to enable lightning experience in existing visualforce pages?
-1
votes
1answer
852 views

<lightning:card> not working properly

I tried to use lightning:card in my Lightning Component which is not working properly <aura:component> <lightning:card> <aura:set attribute="title"> Hello! ...
2
votes
2answers
386 views

When creating a Lightning Component using SLDS resources, I am receiving an error of “Failed to save globalMessageBlock.cmp: null: Source”

I am creating a resuable message component for use in the Lightning App Builder, and previously was using ui:message. However, as that uses Classic styling and this will be used in Lightning, I used ...
0
votes
1answer
406 views

SLDS SVG Icons not showing in IE 11

SLDS SVG icons not displaying on IE 11, having this issue with IE only, it works for rest of the browsers. Is there any solution for it?
0
votes
1answer
127 views

How to reduce space in table items in SLDS

I have a requirement to send survey form to customer through mail when record meets specific criteria. So, i installed surveyforce appexchange package and made some font size & others. And in ...
1
vote
1answer
591 views

How to iterate records using SLDS

I am trying to create a datatable using the SLDS but when I use Apex DataTable I cannot get the column names which are <apex:facets> to get in the correct style slds-text-title_caps Here's my ...
1
vote
2answers
1k views

apex:slds is not working in Napili Community

apex:slds tag works in Lightning Experience where as it is not working in Napili Community.This visualforce page is added as action button. <apex:page standardController="Account"> <apex:...
0
votes
0answers
224 views

apex:inputField not correctly rendering

I use some apex:inputField components in my visualforce page but suggestion menu does not render correctly: This is my code: <apex:page standardController="Campaign" extensions="...
2
votes
2answers
124 views

Winter18 override sizes on compound forms

With Winter18, elements sizes in compound forms are overridden to something like slds-size--1-of-1, despite the slds-size specified. For example, this code from the SLDS Documentation used to work, ...
13
votes
3answers
5k views

apex:slds vs lightningstylesheet option

What is the benefit of using <apex:slds> vs specifying the lightningstylesheet attribute on your <apex:page>? These links talks about both but I don't understand the difference apex:slds ...
1
vote
1answer
2k views

Extending/implementing force:slds at component level

With Lightning most of my use case has been creating a component and adding it to the Lightning app builder page. I use just to preview my component behavior from developer console. Having said ...
0
votes
0answers
492 views

How to use SLDS CSS as hosted Static Resource in Web-To-Lead

So I am creating a web-to-lead form but I'd like to use the SLDS CSS. I uploaded the SLDS zip to my Org as a public facing static resource. However, when I put it in my HTML page it's not working. (!...
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="...
3
votes
0answers
378 views

Loss of Lightning Card style on reRender of outputPanel in Visualforce

I have a visualforce page that gets initially loaded, then an action function is triggered that does a webservice callout. Once the action is finished and the output panel rerenders, I am losing the ...
3
votes
2answers
1k views

Close Lightning Modal by clicking anywhere outside of it

Just wondering whether this is possible? i.e. once a modal is open, close it by clicking anywhere on the grey backdrop? I've tried invoking my custom close-modal function via: - Adding onclick to the ...
0
votes
2answers
495 views

SLDS Header row with full height left and right div

Trying to use the grid system to do something similar to the following: =================================HEADER ROW Size 1 of 1=========================== + + + ...