3

Lightning Component used in Lightning Tab is called 'Wizard'. The markup for Spring 18 release looks as follows:

enter image description here

Winter 18 version looks as follows:

enter image description here

The 'slds-card'-styled div which was added in Spring 18 makes the container not transparent any more, the background is white now. Is there an option in setup to deactivate the card-div-wrapper?

Locker service does not allow to access the wrapper element's styling generated by Salesforce.

Update

Workaround right now is to add styles (warning! bad practice to have such selectors, temporary fix):

#brandBand_1 > div > div > div > div.slds-card {
    background: transparent;
    border: none;
    box-shadow: none;
}

in Static Resource named wrapperCardReset. And then use the resource in the main component:

<ltng:require styles="{!$Resource.wrapperCardReset}"/>
Improve this question
0

2 Answers 2

Reset to default
1

I don't think you can disable the Card Style but Salesforce has given an option "Delaying Rollout of the New Look" in Winter '18 Where you can disable this background image and color in Setup, reverting the background color of pages to the same white color used in Summer ’17 before these UI enhancements.

Source: - https://developer.salesforce.com/blogs/developer-relations/2017/08/winter-coming-lightning.html

Improve this answer
1
  • Thank you for the reply. The Winter 2018 works just fine. The problem arises in Spring 2018 which was rolled out past weekend.
    – Kiryl Kazlovich
    Jan 8, 2018 at 11:00
0

Kiryl, this is very odd. I am not seeing the extra slds-card in my org. Is the component on a standard Lightning page?

On a side note, you should avoid specifying a CSS selector like you showed in your update, as we can't ever guarantee that the DOM will remain the same.

Improve this answer
2
  • It is odd. Our old component, which we didn't touch in a long time has gotten the card styling when we checked it on Monday this week and it definitely not coming from the component itself. It can be noticed on screenshots of the markup that 'slds-card' div does not have 'cWizard' style class, so I assume it is rendered by Salesforce itself without some custom logic involved. Sure, the DOM might change, and it is generally a bad practice to have such CSS selectors, we just urgently needed our old styling back. We will keep an eye on the changes in future. Thank you.
    – Kiryl Kazlovich
    Jan 12, 2018 at 10:30
  • Maybe some of those have influence: implements="force:appHostable,flexipage:availableForAllPageTypes,force:lightningQuickAction,force:hasRecordId"
    – Kiryl Kazlovich
    Jan 12, 2018 at 10:31

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .