Hide post footer when empty (#2926)

* Add `Post-footer--empty` class if the post footer contains no items

* Hide post footer when it has class `Post-footer--empty`

* Swap to `:empty` pseudoselector

* Prefer ternary operator

* Fix typo
This commit is contained in:
David Wheatley 2021-07-13 13:42:19 +01:00 committed by GitHub
parent 7562878325
commit 7283254b4a
2 changed files with 6 additions and 6 deletions

View File

@ -44,6 +44,7 @@ export default class Post extends Component {
attrs.className = this.classes(attrs.className).join(' ');
const controls = PostControls.controls(this.attrs.post, this).toArray();
const footerItems = this.footerItems().toArray();
return (
<article {...attrs}>
@ -71,9 +72,7 @@ export default class Post extends Component {
)}
</ul>
</aside>
<footer className="Post-footer">
<ul>{listItems(this.footerItems().toArray())}</ul>
</footer>
<footer className="Post-footer">{footerItems.length ? <ul>{listItems(footerItems)}</ul> : null}</footer>
</div>
</article>
);

View File

@ -247,9 +247,6 @@
a {
font-weight: bold;
}
.Post-footer {
margin-bottom: 0;
}
}
.EventPost-info {
font-size: 14px;
@ -287,6 +284,10 @@
font-size: 14px;
margin-right: 5px;
}
&:empty {
display: none;
}
}
.Post-actions {
margin-top: -5px;