Skip to content

Commit

Permalink
Prevent styles interfering with global styles and block supports
Browse files Browse the repository at this point in the history
  • Loading branch information
aaronrobertshaw committed Dec 16, 2022
1 parent d8f7b81 commit 5911a54
Showing 1 changed file with 25 additions and 7 deletions.
32 changes: 25 additions & 7 deletions packages/block-library/src/latest-comments/style.scss
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,23 @@ ol.wp-block-latest-comments {
box-sizing: border-box;
}

// Following styles leverage :where so that typography block support styles and
// global styles apply when necessary.
:where(.wp-block-latest-comments:not([style*="line-height"] .wp-block-latest-comments__comment)) {
line-height: 1.1;
}

.has-dates,
.has-excerpts {
:where(.wp-block-latest-comments:not([style*="line-height"])) {
line-height: 1.5;
}
}

:where(.wp-block-latest-comments:not([style*="line-height"] .wp-block-latest-comments__comment-excerpt p)) {
line-height: 1.8;
}

// Higher specificity - target list via wrapper.
.wp-block-latest-comments .wp-block-latest-comments {
// Remove left spacing. Higher specificity required to
Expand All @@ -17,7 +34,6 @@ ol.wp-block-latest-comments {
}

.wp-block-latest-comments__comment {
line-height: 1.1;
list-style: none;
margin-bottom: 1em;

Expand All @@ -30,16 +46,10 @@ ol.wp-block-latest-comments {
margin-left: 3.25em;
}
}

.has-dates &,
.has-excerpts & {
line-height: 1.5;
}
}

.wp-block-latest-comments__comment-excerpt p {
font-size: 0.875em;
line-height: 1.8;
margin: 0.36em 0 1.4em;
}

Expand All @@ -57,3 +67,11 @@ ol.wp-block-latest-comments {
margin-right: 0.75em;
width: 2.5em;
}

// Enforce font size when user has made selection at the individual block level.
.wp-block-latest-comments[style*="font-size"],
.wp-block-latest-comments[class*="-font-size"] {
a {
font-size: inherit;
}
}

1 comment on commit 5911a54

@github-actions
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Flaky tests detected.
Some tests passed with failed attempts. The failures may not be related to this commit but are still reported for visibility. See the documentation for more information.

🔍 Workflow run URL: https://github.com/WordPress/gutenberg/actions/runs/3711532471
📝 Reported issues:

Please sign in to comment.