Dashboards CSS impacting other elements using layout builder

Created on 13 June 2024, 17 days ago

Problem/Motivation

I've noticed that some styles added by the module can impact elements of the site built with laypout builder, that are not using Dashboards.

For example: I've found .layout--twocol-section.layout--twocol-section--50-50 being defined in dashboard.css:61. This rule is adding gap and flex settings and it changed the look of other two-column section on my site. And this is despite the fact that when adding section in layout builder, I've chosen "Two column" layout and not "Dashboard: 2 Columns"

Steps to reproduce

Install and enable "Dashboards with Layout Builder" module
Create any page with layout builder
Add new section and choose "Two column" (do not choose "Dashboard: 2 Columns"
Save the page
Note that styles from dashboards.css are added to the div with classes layout layout--twocol-section layout--twocol-section--50-50

Proposed resolution

Change selectors in dashboard.css in a way that they would be only used in dahboard layouts

πŸ› Bug report
Status

Active

Version

2.1

Component

Code

Created by

πŸ‡΅πŸ‡±Poland besek

Live updates comments and jobs are added and updated live.
Sign in to follow issues

Comments & Activities

Production build 0.69.0 2024